163 lines
8.5 KiB
Plaintext
163 lines
8.5 KiB
Plaintext
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ProjectHighlightsSitePic.aspx.cs" Inherits="FineUIPro.Web.CQMS.ProjectHighlightsSite.ProjectHighlightsSitePic" %>
|
||
|
||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||
|
||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||
<head runat="server">
|
||
<title>项目现场亮点照片</title>
|
||
<link href="../../res/css/common.css" rel="stylesheet" type="text/css" />
|
||
<link href="../../res/css/viewer.min.css" rel="stylesheet" />
|
||
<script src="../../res/js/jquery-3.4.1.min.js" type="text/javascript"></script>
|
||
<script src="../../res/js/viewer.min.js" type="text/javascript"></script>
|
||
<style type="text/css">
|
||
.customlabel span {
|
||
margin-left: 140px;
|
||
color: red;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.f-grid-row .f-grid-cell-inner {
|
||
white-space: normal;
|
||
word-break: break-all;
|
||
}
|
||
|
||
.imgPreview {
|
||
display: none;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%; /*容器占满整个屏幕*/
|
||
height: 100%;
|
||
position: fixed;
|
||
background: rgba(0, 0, 0, 0.5);
|
||
}
|
||
|
||
.imgPreview img {
|
||
z-index: 100;
|
||
width: 60%;
|
||
position: fixed;
|
||
top: 50%;
|
||
left: 50%;
|
||
transform: translate(-50%,-50%);
|
||
}
|
||
/*添加鼠标移入图片效果*/
|
||
.img {
|
||
cursor: url("ico/放大镜.png"), auto;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<form id="form1" runat="server">
|
||
<f:PageManager ID="PageManager1" AutoSizePanelID="Panel1" runat="server" />
|
||
<f:Panel ID="Panel1" runat="server" Margin="5px" BodyPadding="5px" Title="项目现场亮点照片" ShowHeader="false" Layout="HBox">
|
||
<Items>
|
||
<f:Grid ID="Grid1" Title="项目现场亮点照片" ShowHeader="false" EnableCollapse="true" PageSize="100000" ForceFit="true"
|
||
ShowBorder="true" AllowPaging="false" IsDatabasePaging="false" runat="server" EnableColumnLines="true" EnableRowDoubleClickEvent="true" OnRowDoubleClick="Grid1_RowDoubleClick"
|
||
DataKeyNames="Id" DataIDField="Id" OnPageIndexChange="Grid1_PageIndexChange" AllowFilters="true" OnFilterChange="Grid1_FilterChange" EnableTextSelection="True">
|
||
<Toolbars>
|
||
<f:Toolbar ID="Toolbar2" Position="Top" runat="server">
|
||
<Items>
|
||
<f:DropDownList runat="server" EnableSimulateTree="True" LabelAlign="Right" Label="大类" ID="drpMainType" AutoPostBack="true" OnSelectedIndexChanged="drpMainType_SelectedIndexChanged">
|
||
</f:DropDownList>
|
||
<f:DropDownList ID="drpReport" runat="server" Label="上报" LabelAlign="Right" EnableEdit="true" AutoPostBack="true" OnSelectedIndexChanged="drpMainType_SelectedIndexChanged" LabelWidth="80px" Width="200px">
|
||
<f:ListItem Text="-请选择-" Value="" />
|
||
<f:ListItem Text="已上报" Value="1" />
|
||
<f:ListItem Text="未上报" Value="0" />
|
||
</f:DropDownList>
|
||
<f:DropDownList ID="drpUploadPic" runat="server" Label="亮点照片" LabelAlign="Right" EnableEdit="true" AutoPostBack="true" OnSelectedIndexChanged="drpMainType_SelectedIndexChanged" LabelWidth="80px" Width="200px">
|
||
<f:ListItem Text="-请选择-" Value="" />
|
||
<f:ListItem Text="已上传" Value="1" />
|
||
<f:ListItem Text="未上传" Value="0" Selected="true" />
|
||
</f:DropDownList>
|
||
<f:ToolbarFill runat="server"></f:ToolbarFill>
|
||
<f:Label ID="Label3" runat="server" Text="双击或者选中数据行，鼠标右键维护项目现场亮点信息" CssClass="customlabel"></f:Label>
|
||
<%--<f:Button ID="btnGet" Text="获取" ToolTip="从集团获取项目现场亮点类型" Icon="FolderPage" runat="server" OnClick="btnGet_Click">
|
||
</f:Button>--%>
|
||
</Items>
|
||
</f:Toolbar>
|
||
</Toolbars>
|
||
<Columns>
|
||
<f:RowNumberField EnablePagingNumber="true" HeaderText="序号" Width="50px" HeaderTextAlign="Center" TextAlign="Center" />
|
||
<f:RenderField Width="120px" ColumnID="MainTypeName" DataField="MainTypeName" FieldType="String"
|
||
HeaderText="大类" HeaderTextAlign="Center" TextAlign="Center">
|
||
</f:RenderField>
|
||
<f:RenderField Width="180px" ColumnID="SubType" DataField="SubType" FieldType="String"
|
||
HeaderText="小类" HeaderTextAlign="Center" TextAlign="Left">
|
||
</f:RenderField>
|
||
<f:TemplateField ColumnID="tfImageUrl1" MinWidth="120px" HeaderText="亮点照片" HeaderTextAlign="Center"
|
||
TextAlign="Center">
|
||
<ItemTemplate>
|
||
<asp:Label ID="lbImageUrl1" runat="server" Text='<%# ConvertImageUrlByImage(Eval("PicUrl")) %>'></asp:Label>
|
||
</ItemTemplate>
|
||
</f:TemplateField>
|
||
<f:RenderField Width="320px" ColumnID="Resume" DataField="Resume" FieldType="String"
|
||
HeaderText="亮点描述" HeaderTextAlign="Center" TextAlign="Left" ExpandUnusedSpace="true">
|
||
</f:RenderField>
|
||
</Columns>
|
||
<Listeners>
|
||
<f:Listener Event="beforerowcontextmenu" Handler="onRowContextMenu" />
|
||
</Listeners>
|
||
</f:Grid>
|
||
</Items>
|
||
</f:Panel>
|
||
<f:Window ID="Window1" Title="成果" Hidden="true" EnableIFrame="true" EnableMaximize="true"
|
||
Target="Parent" EnableResize="false" runat="server" IsModal="true" OnClose="Window1_Close"
|
||
Width="680px" Height="520px">
|
||
</f:Window>
|
||
<f:Menu ID="Menu1" runat="server">
|
||
<Items>
|
||
<f:MenuButton ID="btnMenuModify" EnablePostBack="true" runat="server" Text="维护亮点" Icon="Pencil" OnClick="btnMenuModify_Click" Hidden="true">
|
||
</f:MenuButton>
|
||
<f:MenuButton ID="btnMenuDel" EnablePostBack="true" runat="server" Icon="Delete" Text="删除亮点信息" ConfirmText="确定删除亮点信息？"
|
||
OnClick="btnMenuDel_Click" Hidden="true">
|
||
</f:MenuButton>
|
||
</Items>
|
||
</f:Menu>
|
||
</form>
|
||
<div class="imgPreview">
|
||
<img src="#" alt="" id="imgPreview" />
|
||
</div>
|
||
<script type="text/javascript">
|
||
var menuID = '<%= Menu1.ClientID %>';
|
||
// 返回false，来阻止浏览器右键菜单
|
||
function onRowContextMenu(event, rowId) {
|
||
F(menuID).show(); //showAt(event.pageX, event.pageY);
|
||
return false;
|
||
}
|
||
function reloadGrid() {
|
||
__doPostBack(null, 'reloadGrid');
|
||
}
|
||
var imgID = '<%=Grid1.ClientID %>';
|
||
function showImg() {
|
||
var $wrap = $("#" + imgID)
|
||
console.log($wrap)
|
||
$wrap.find('img').on('click', function () {
|
||
var src = $(this).attr('src');
|
||
console.log(src)
|
||
if (src.indexOf("/res/icon") != -1) {
|
||
return;
|
||
}
|
||
var div = document.createElement('div');
|
||
div.style.display = 'none';
|
||
div.innerHTML = '<img src="' + src + '">'; // 创建一个包含图片的 div 元素
|
||
document.body.appendChild(div); // 将 div 元素添加到页面中
|
||
|
||
var viewer = new Viewer(div.firstChild); // 创建 Viewer 实例并传入图片元素
|
||
viewer.show(); // 显示图片预览
|
||
|
||
// 在 Viewer 关闭后移除添加的 div 元素
|
||
viewer.on('hidden', function () {
|
||
document.body.removeChild(div);
|
||
});
|
||
|
||
});
|
||
$('.imgPreview').on('click', function () {
|
||
// $('.imgPreview').hide()
|
||
});
|
||
}
|
||
F.ready(function () {
|
||
showImg();
|
||
})
|
||
</script>
|
||
</body>
|
||
</html>
|