lpf/SGGL_SHJ
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

总部检查图片预览功能实现

Browse Source
This commit is contained in:
杨红卫
2024-03-07 16:12:32 +08:00
parent 5823d7534e
commit d03c9a0e00
9 changed files with 339 additions and 189 deletions
Download Patch File Download Diff File Expand all files Collapse all files
SGGL/FineUIPro.Web/HSSE/Check/OfficeCheck.aspx
+44 -15
View File
@@ -5,8 +5,7 @@
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>总部检查</title>
<link href="../../res/css/common.css" rel="stylesheet" type="text/css" />
<title></title>
<script type="text/javascript" src="../../Controls/My97DatePicker/WdatePicker.js"></script>
</head>
<body>
@@ -23,7 +22,7 @@
<Toolbars>
<f:Toolbar ID="Toolbar1" Position="Top" ToolbarAlign="Left" runat="server">
<Items>
<f:RadioButtonList ID="rbStates" runat="server" Label="状态"
<f:RadioButtonList ID="rbStates" runat="server" Label="状态"
LabelAlign="Right" Width="400px" AutoPostBack="true" OnSelectedIndexChanged="rbStates_SelectedIndexChanged">
<f:RadioItem Text="不合格" Value="0" Selected="true" />
<f:RadioItem Text="合格" Value="1" />
@@ -36,9 +35,9 @@
SortField="RectifyItemId" FieldType="String" HeaderTextAlign="Center" TextAlign="Center"
Hidden="true">
</f:RenderField>
<f:RenderField Width="100px" ColumnID="StatesName" DataField="StatesName" FieldType="string"
HeaderText="状态">
</f:RenderField>
<f:RenderField Width="100px" ColumnID="StatesName" DataField="StatesName" FieldType="string"
HeaderText="状态">
</f:RenderField>
<f:RenderField Width="100px" ColumnID="RectifyCode" DataField="RectifyCode" FieldType="string"
HeaderText="整改单">
</f:RenderField>
@@ -53,11 +52,23 @@
</f:RenderField>
<f:LinkButtonField HeaderText="整改前" ConfirmTarget="Top" Width="80" CommandName="AttachUrl"
TextAlign="Center" ToolTip="整改照片" Text="详细" />
<f:TemplateField ColumnID="tfImageUrl1" Width="120px" HeaderText="整改前" HeaderTextAlign="Center"
TextAlign="Left">
<ItemTemplate>
<asp:Label ID="lbImageUrl" runat="server" Text='<%# ConvertImageUrlByImage(Eval("RectifyItemId")) %>'></asp:Label>
</ItemTemplate>
</f:TemplateField>
<f:RenderField Width="100px" ColumnID="RectifyResults" DataField="RectifyResults" FieldType="string"
HeaderText="整改结果">
</f:RenderField>
<f:LinkButtonField ColumnID="ReAttachUrl" HeaderText="整改后" ConfirmTarget="Top" Width="80" CommandName="ReAttachUrl"
TextAlign="Center" ToolTip="整改照片" Text="整改后" />
<f:TemplateField ColumnID="tfImageUrl2" Width="120px" HeaderText="整改后" HeaderTextAlign="Center"
TextAlign="Left">
<ItemTemplate>
<asp:Label ID="Label2" runat="server" Text='<%# ConvertImageUrlByImage2(Eval("RectifyItemId")) %>'></asp:Label>
</ItemTemplate>
</f:TemplateField>
</Columns>
<Listeners>
<f:Listener Event="dataload" Handler="onGridDataLoad" />
@@ -70,26 +81,44 @@
Target="Parent" EnableResize="false" runat="server" IsModal="true" Width="700px"
Height="500px">
</f:Window>
<div id="imgID1" style="position: absolute; left: 0; top: 0; width: 300px; height: 300px; z-index: 99999999;">
<img src="" alt="Alternate Text" style="width: 100%; height: auto;" />
</div>
<f:Menu ID="Menu1" runat="server">
<Items>
<f:MenuButton ID="btnSubmit" EnablePostBack="true" runat="server"
<f:MenuButton ID="btnSubmit" EnablePostBack="true" runat="server"
Text="提交" Icon="TableEdit" OnClick="btnSubmit_Click">
</f:MenuButton>
</f:MenuButton>
</Items>
</f:Menu>
</form>
<script type="text/javascript">
<script type="text/javascript">
var menuID = '<%= Menu1.ClientID %>';
// 返回false，来阻止浏览器右键菜单
function onRowContextMenu(event, rowId) {
F(menuID).show(); //showAt(event.pageX, event.pageY);
return false;
}
}
function onGridDataLoad(event) {
this.mergeColumns(['RectifyCode'], { depends: true });
}
</script>
function onGridDataLoad(event) {
this.mergeColumns(['RectifyCode'], { depends: true });
}
</script>
<script type="text/javascript">
var imgID = '<%=Grid1.ClientID %>';
F.ready(function () {
var $wrap = $("#" + imgID)
$wrap.find('img').hover(function (e) {
console.log($(this).offset())
var top = $(this).offset().top;
var left = $(this).offset().left - 200;
var src = $(this).attr('src')
console.log('src', src, top, left)
$('#imgID1').css("left", left).css("top", top).show().find('img').attr('src', src)
}, function () {
$('#imgID1').hide()
})
})
</script>
</body>
</html>