763 lines
42 KiB
Plaintext
763 lines
42 KiB
Plaintext
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="main.aspx.cs" Inherits="FineUIPro.Web.common.main" %>
|
||
|
||
<%@ Register Assembly="System.Web.DataVisualization, Version=4.0.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"
|
||
Namespace="System.Web.UI.DataVisualization.Charting" TagPrefix="asp" %>
|
||
<!DOCTYPE html>
|
||
<html>
|
||
<head id="Head1" 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" />
|
||
<script src="../Scripts/jquery-3.7.1.min.js"></script>
|
||
<script src="../Scripts/layer/layer.js"></script>
|
||
<script src="../Scripts/echarts/echarts.js"></script>
|
||
<style>
|
||
.f-grid-row.color1,
|
||
.f-grid-row.color1 .f-icon,
|
||
.f-grid-row.color1 a {
|
||
color: #A52A2A;
|
||
}
|
||
|
||
.f-grid-row.color2,
|
||
.f-grid-row.color2 .f-icon,
|
||
.f-grid-row.color2 a {
|
||
color: #A9A9A9;
|
||
}
|
||
|
||
.colorRed {
|
||
color: #FF0000;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body class="f-body-bgcolor">
|
||
<form id="form1" runat="server">
|
||
<f:PageManager ID="PageManager1" runat="server" AutoSizePanelID="Panel2" />
|
||
<f:Panel ID="Panel2" CssClass="blockpanel" Margin="0px" runat="server" ShowBorder="false" ShowHeader="false" Layout="Region">
|
||
<Items>
|
||
<f:Panel runat="server" ID="panelTopRegion" RegionPosition="Center"
|
||
Title="中间面板" ShowBorder="false" ShowHeader="false" Layout="VBox">
|
||
<Items>
|
||
<f:HiddenField runat="server" ID="hidVendor_Name"></f:HiddenField>
|
||
<f:HiddenField runat="server" ID="hidFO_NO"></f:HiddenField>
|
||
<f:Grid ID="Grid1" ShowBorder="true" ShowHeader="false" EnableCollapse="true" runat="server"
|
||
BoxFlex="1" DataKeyNames="ID" AllowCellEditing="true" ClicksToEdit="2" DataIDField="ID"
|
||
AllowSorting="true" SortField="FO_NO" SortDirection="DESC" OnSort="Grid1_Sort"
|
||
AllowPaging="true" IsDatabasePaging="true" PageSize="15" OnPageIndexChange="Grid1_PageIndexChange" EnableRowSelectEvent="true" EnableRowClickEvent="true" OnRowClick="Grid1_RowClick" AllowFilters="true"
|
||
OnFilterChange="Grid1_FilterChange" OnRowDataBound="Grid1_RowDataBound">
|
||
<Toolbars>
|
||
<f:Toolbar ID="Toolbar1" Position="Top" runat="server">
|
||
<Items>
|
||
<f:DropDownList ID="drpValidContracts" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DropDownList_SelectedIndexChanged">
|
||
<f:ListItem Value="1" Text="Valid Contracts" />
|
||
<f:ListItem Value="2" Text="All Contracts" />
|
||
</f:DropDownList>
|
||
<f:TextBox ID="txtDescription" runat="server" EmptyText="Description" AutoPostBack="true" OnTextChanged="DropDownList_SelectedIndexChanged"></f:TextBox>
|
||
<f:TextBox ID="txtContractor" runat="server" EmptyText="Contractor" AutoPostBack="true" OnTextChanged="DropDownList_SelectedIndexChanged"></f:TextBox>
|
||
<f:ToolbarFill ID="ToolbarFill1" runat="server"></f:ToolbarFill>
|
||
<f:Button ID="btnSearch" runat="server" Icon="SystemSearch" Text="Search" OnClick="btnSearch_Click"></f:Button>
|
||
<f:HiddenField ID="hdKeyword" runat="server"></f:HiddenField>
|
||
<f:HiddenField ID="hdContractNo" runat="server"></f:HiddenField>
|
||
<f:HiddenField ID="hdContractAdmin" runat="server"></f:HiddenField>
|
||
<f:HiddenField ID="hdPricingScheme" runat="server"></f:HiddenField>
|
||
<f:HiddenField ID="hdItemsString" runat="server"></f:HiddenField>
|
||
</Items>
|
||
</f:Toolbar>
|
||
</Toolbars>
|
||
<Columns>
|
||
<f:TemplateField Width="40px">
|
||
<ItemTemplate>
|
||
<asp:Label ID="Label1" runat="server" Text='<%# Container.DataItemIndex + 1 %>'></asp:Label>
|
||
</ItemTemplate>
|
||
</f:TemplateField>
|
||
<f:RenderField Width="100px" ColumnID="FO_NO" DataField="FO_NO" SortField="FO_NO"
|
||
FieldType="String" HeaderText="FO No." HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList4" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="150px" ColumnID="Discipline" DataField="Discipline" SortField="Discipline"
|
||
FieldType="String" HeaderText="Discipline" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList1" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="130px" ColumnID="Contractor" DataField="Contractor" SortField="Contractor"
|
||
FieldType="String" HeaderText="Contractor" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList2" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="120px" ColumnID="Pricing_Scheme" DataField="Pricing_Scheme"
|
||
FieldType="String" HeaderText="Pricing Scheme" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList3" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="100px" ColumnID="Original_WC" DataField="Original_WC" SortField="Original_WC"
|
||
FieldType="String" HeaderText="Work Center" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList5" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="100px" ColumnID="Contract_Admin" DataField="Contract_Admin" SortField="Contract_Admin"
|
||
FieldType="String" HeaderText="Contract<br/>Admin" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList7" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="100px" ColumnID="Buyer" DataField="Buyer"
|
||
FieldType="String" HeaderText="Buyer" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList11" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="100px" ColumnID="Main_Coordinator" DataField="Main_Coordinator"
|
||
FieldType="String" HeaderText="Main<br/>Coordinator" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList12" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="100px" ColumnID="User_Representative" DataField="User_Representative"
|
||
FieldType="String" HeaderText="User<br/>Representative" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList13" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="130px" ColumnID="Contract_Person" DataField="Contract_Person"
|
||
FieldType="String" HeaderText="Contract_Person" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList14" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="120px" ColumnID="Contract_Tel" DataField="Contract_Tel"
|
||
FieldType="String" HeaderText="Tel." HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList15" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="110px" ColumnID="Validate_Date" DataField="Validate_Date"
|
||
FieldType="Date" Renderer="Date" HeaderText="Valid Date" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList16" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<f:RenderField Width="100px" ColumnID="Expire_Date" DataField="Expire_Date"
|
||
FieldType="Date" Renderer="Date" HeaderText="Expiry Date" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList17" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
<%--<f:RenderField Width="90px" ColumnID="Remaining_Budget_Rate" DataField="Remaining_Budget_Rate"
|
||
FieldType="String" HeaderText="Remaining<br/>Budget%" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList8" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>--%>
|
||
<f:RenderField Width="90px" ColumnID="Remaining_Duration_Rate" DataField="Remaining_Duration_Rate"
|
||
FieldType="String" HeaderText="Remaining<br/>Duration%" HeaderTextAlign="Center" EnableFilter="true">
|
||
<Filter EnableMultiFilter="true" ShowMatcher="true">
|
||
<Operator>
|
||
<f:DropDownList ID="DropDownList9" runat="server">
|
||
<f:ListItem Text="equal to" Value="equal" />
|
||
<f:ListItem Text="include" Value="contain" Selected="true" />
|
||
</f:DropDownList>
|
||
</Operator>
|
||
</Filter>
|
||
</f:RenderField>
|
||
</Columns>
|
||
<PageItems>
|
||
<f:ToolbarSeparator ID="ToolbarSeparator1" runat="server">
|
||
</f:ToolbarSeparator>
|
||
<f:ToolbarText ID="ToolbarText1" runat="server" Text="Number of records per page：">
|
||
</f:ToolbarText>
|
||
<f:DropDownList runat="server" ID="ddlPageSize" Width="80px" AutoPostBack="true"
|
||
OnSelectedIndexChanged="ddlPageSize_SelectedIndexChanged">
|
||
<f:ListItem Text="15" Value="15" />
|
||
<f:ListItem Text="20" Value="20" />
|
||
<f:ListItem Text="25" Value="25" />
|
||
<f:ListItem Text="30" Value="30" />
|
||
</f:DropDownList>
|
||
</PageItems>
|
||
</f:Grid>
|
||
</Items>
|
||
</f:Panel>
|
||
<f:Panel runat="server" ID="panelBottomRegion" RegionPosition="Bottom" RegionSplit="true" RegionSplitWidth="20px" EnableCollapse="true" Height="380px"
|
||
Title="底部面板" ShowBorder="false" ShowHeader="false" BodyPadding="1px">
|
||
<Items>
|
||
<f:Panel ID="Panel3" runat="server" Layout="Fit" Height="370px" EnableCollapse="false" ShowBorder="false" ShowHeader="true" Title="Deduction">
|
||
<Items>
|
||
<f:Panel runat="server" BlockMD="12"
|
||
Layout="Block" BlockConfigSpace="5px" ShowBorder="false" ShowHeader="false">
|
||
<Items>
|
||
<%--左--%>
|
||
<f:Panel CssClass="blockpanel" BlockMD="6" Height="370px"
|
||
runat="server" ShowBorder="true" ShowHeader="false">
|
||
<Toolbars>
|
||
<f:Toolbar ID="Toolbar3" runat="server">
|
||
<Items>
|
||
<f:DatePicker runat="server" BlockMD="5" Label="Time Range" LabelAlign="Right" DateFormatString="yyyy-MM" ID="StartTime" DisplayType="Month"></f:DatePicker>
|
||
<f:DatePicker ID="EndTime" Readonly="false" BlockMD="5" DateFormatString="yyyy-MM" runat="server" DisplayType="Month" ShowTodayButton="false"></f:DatePicker>
|
||
<f:Button ID="btnSubmit" runat="server" BlockMD="2" ValidateForms="SimpleForm1" Text="Submit" OnClientClick="return btnSubmit()">
|
||
</f:Button>
|
||
</Items>
|
||
</f:Toolbar>
|
||
</Toolbars>
|
||
<Items>
|
||
<f:TabStrip ID="TabStrip4" IsFluid="true" BlockMD="12" CssClass="blockpanel" Height="370px" ShowBorder="true" TabPosition="Right" ActiveTabIndex="0" runat="server">
|
||
<Tabs>
|
||
<f:Tab Title="KPI1" BodyPadding="1px" BlockMD="12" runat="server">
|
||
<Items>
|
||
<f:ContentPanel runat="server" BlockMD="12" ShowHeader="false" ShowBorder="false">
|
||
<div id="kpi1" style="width: 100%; height: 300px;"></div>
|
||
</f:ContentPanel>
|
||
</Items>
|
||
</f:Tab>
|
||
<f:Tab Title="KPI2" BodyPadding="1px" BlockMD="12" runat="server">
|
||
<Items>
|
||
<f:ContentPanel runat="server" BlockMD="12" ShowHeader="false" ShowBorder="false">
|
||
<div id="kpi2" style="width: 100%; height: 300px;"></div>
|
||
</f:ContentPanel>
|
||
</Items>
|
||
</f:Tab>
|
||
<f:Tab Title="KPI3" BodyPadding="1px" BlockMD="12" runat="server">
|
||
<Items>
|
||
<f:ContentPanel runat="server" BlockMD="12" ShowHeader="false" ShowBorder="false">
|
||
<div id="kpi3" style="width: 100%; height: 300px;"></div>
|
||
</f:ContentPanel>
|
||
</Items>
|
||
</f:Tab>
|
||
</Tabs>
|
||
</f:TabStrip>
|
||
</Items>
|
||
</f:Panel>
|
||
<%--右--%>
|
||
<f:Panel CssClass="blockpanel" BlockMD="6" Height="370px"
|
||
runat="server" ShowBorder="true" ShowHeader="false">
|
||
<Toolbars>
|
||
<f:Toolbar ID="Toolbar2" runat="server">
|
||
<Items>
|
||
<f:DatePicker runat="server" BlockMD="5" Label="Time Range" LabelAlign="Right" DateFormatString="yyyy-MM-dd" ID="rStartTime"></f:DatePicker>
|
||
<f:DatePicker ID="rEndTime" Readonly="false" BlockMD="5" CompareControl="rStartTime" DateFormatString="yyyy-MM-dd" CompareOperator="GreaterThan" runat="server" ShowTodayButton="false"></f:DatePicker>
|
||
<f:Button ID="Button1" runat="server" BlockMD="2" ValidateForms="SimpleForm1" Text="Submit" OnClientClick="return KPIR()">
|
||
</f:Button>
|
||
</Items>
|
||
</f:Toolbar>
|
||
</Toolbars>
|
||
<Items>
|
||
<f:ContentPanel runat="server" BlockMD="12" ShowHeader="false" ShowBorder="false">
|
||
<div id="kpir" style="width: 650px; height: 300px;"></div>
|
||
</f:ContentPanel>
|
||
</Items>
|
||
</f:Panel>
|
||
</Items>
|
||
</f:Panel>
|
||
</Items>
|
||
</f:Panel>
|
||
</Items>
|
||
</f:Panel>
|
||
</Items>
|
||
</f:Panel>
|
||
<f:Window ID="Window1" Title="Search" Hidden="true" EnableIFrame="true" EnableMaximize="false"
|
||
Target="Parent" EnableResize="true" runat="server" IsModal="true" Width="600px"
|
||
Height="300px" OnClose="Window1_Close">
|
||
</f:Window>
|
||
</form>
|
||
<script type="text/javascript">
|
||
//点击合同加载执行方法
|
||
function PagePostBank() {
|
||
KPIR();
|
||
btnSubmit();
|
||
}
|
||
|
||
//KPIR
|
||
function KPIR() {
|
||
var Contractor = $("#Panel2_panelTopRegion_hidVendor_Name-inputEl").val();
|
||
var FO_NO = $("#Panel2_panelTopRegion_hidFO_NO-inputEl").val();
|
||
if (FO_NO == "" || FO_NO == undefined || FO_NO == null) {
|
||
layer.alert("Please select Fo No.!");
|
||
return false;
|
||
}
|
||
var rStartId = '<%= rStartTime.ClientID %>';
|
||
var rEndId = '<%= rEndTime.ClientID %>';
|
||
var kpirlegend = "";
|
||
var kpirxAxis = "";
|
||
var kpirDateEnd = "";
|
||
$.ajax({
|
||
type: "POST",
|
||
dataType: "text",
|
||
url: "main.ashx",
|
||
data: { "action": "kpir", "startTime": (F(rStartId) == null || F(rStartId) == undefined) ? "" : F(rStartId).ollO1, "endTime": (F(rEndId) == null || F(rEndId) == undefined) ? "" : F(rEndId).ollO1, "Contractor": Contractor, "FO_NO": FO_NO },
|
||
async: false,
|
||
success: function (result) {
|
||
var data = jQuery.parseJSON(result);
|
||
kpirlegend = data.kpirJson.split('||')[0];
|
||
kpirxAxis = data.kpirJson.split('||')[1];
|
||
kpirDateEnd = data.kpirJson.split('||')[2];
|
||
kpirUser = data.kpirJson.split('||')[3];
|
||
kpirDep = data.kpirJson.split('||')[4];
|
||
kpirAll = data.kpirJson.split('||')[5];
|
||
}
|
||
});
|
||
|
||
if ($("#Panel2_panelBottomRegion_Panel3_TabStrip1_ctl00_ctl00_ctl01").width() != undefined) {
|
||
$("#kpir").css('width', $("#Panel2_panelBottomRegion_Panel3_TabStrip1_ctl00_ctl00_ctl01").width());
|
||
}
|
||
var KPIR = echarts.init(document.getElementById("kpir"));
|
||
var optionKpiR = {
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
axisPointer: {
|
||
type: 'shadow'
|
||
}
|
||
},
|
||
legend: {
|
||
data: kpirlegend.split(',')
|
||
},
|
||
grid: {
|
||
left: '3%',
|
||
right: '4%',
|
||
containLabel: true
|
||
},
|
||
xAxis: {
|
||
type: 'category',
|
||
data: kpirxAxis.split(',')
|
||
},
|
||
yAxis: {
|
||
type: 'value'
|
||
},
|
||
series: [
|
||
{
|
||
name: "User",
|
||
type: "bar",
|
||
stack: "tb",
|
||
barWidth: "30",
|
||
data: kpirUser.split(','),
|
||
itemStyle: {
|
||
normal: {
|
||
color: '#94AF0a'
|
||
}
|
||
}
|
||
},
|
||
{
|
||
name: "Dep",
|
||
type: "bar",
|
||
stack: "tb",
|
||
barWidth: "30",
|
||
data: kpirDep.split(','),
|
||
itemStyle: {
|
||
normal: {
|
||
color: 'blue'
|
||
}
|
||
}
|
||
},
|
||
{
|
||
name: "All",
|
||
type: "line",
|
||
stack: "tb",
|
||
barWidth: "30",
|
||
data: kpirAll.split(','),
|
||
itemStyle: {
|
||
normal: {
|
||
label: {
|
||
show: true, //开启显示
|
||
formatter: '{c}',
|
||
position: 'top', //在上方显示
|
||
textStyle: { //数值样式
|
||
color: 'black',
|
||
fontSize: 12,
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
],
|
||
dataZoom: [{
|
||
show: true,
|
||
start: 0,
|
||
end: parseInt(kpirDateEnd)
|
||
}],
|
||
};
|
||
KPIR.setOption(optionKpiR);
|
||
}
|
||
|
||
function btnSubmit() {
|
||
var Contractor = $("#Panel2_panelTopRegion_hidVendor_Name-inputEl").val();
|
||
var FO_NO = $("#Panel2_panelTopRegion_hidFO_NO-inputEl").val();
|
||
if (FO_NO == "" || FO_NO == undefined || FO_NO == null) {
|
||
layer.alert("Please select Fo No.!");
|
||
return false;
|
||
}
|
||
var StartId = '<%= StartTime.ClientID %>';
|
||
var EndId = '<%= EndTime.ClientID %>';
|
||
//KPI1
|
||
var kpi1xAxis = "";
|
||
var kpi1serieshze = "";
|
||
var kpi1serieshzl = "";
|
||
var kpi1DateEnd = "";
|
||
//KPI2
|
||
var kpi2series = "";
|
||
//KPI3
|
||
var kpi3xAxis = "";
|
||
var kpi3seriesSsr = "";
|
||
var kpi3serieshzl = "";
|
||
var kpi3DateEnd = "";
|
||
$.ajax({
|
||
type: "POST",
|
||
dataType: "text",
|
||
url: "main.ashx",
|
||
data: { "action": "mainkpi", "startTime": (F(StartId) == null || F(StartId) == undefined) ? "" : F(StartId).ollO1, "endTime": (F(EndId) == null || F(EndId) == undefined) ? "" : F(EndId).ollO1, "Contractor": Contractor, "FO_NO": FO_NO },
|
||
async: false,
|
||
success: function (result) {
|
||
var data = jQuery.parseJSON(result);
|
||
//kpi1
|
||
kpi1xAxis = data.Kpi1json.split('||')[0];
|
||
kpi1serieshze = data.Kpi1json.split('||')[1];
|
||
kpi1serieshzl = data.Kpi1json.split('||')[2];
|
||
kpi1DateEnd = data.Kpi1json.split('||')[3];
|
||
//kpi2
|
||
kpi2series = data.Kpi2json;
|
||
//kpi3
|
||
kpi3xAxis = data.Kpi3json.split('||')[0];
|
||
kpi3seriesSsr = data.Kpi3json.split('||')[1];
|
||
kpi3serieshzl = data.Kpi3json.split('||')[2];
|
||
kpi3DateEnd = data.Kpi3json.split('||')[3];
|
||
}
|
||
});
|
||
Kpi1(kpi1xAxis, kpi1serieshze, kpi1serieshzl, kpi1DateEnd, Contractor);
|
||
Kpi2(kpi2series, Contractor);
|
||
KPI3(kpi3xAxis, kpi3seriesSsr, kpi3serieshzl, kpi3DateEnd, Contractor);
|
||
return true;
|
||
}
|
||
//KPI1
|
||
function Kpi1(kpi1xAxis, kpi1serieshze, kpi1serieshzl, kpi1DateEnd, Contractor) {
|
||
if ($("#Panel2_panelBottomRegion_Panel3_ctl00_ctl00_TabStrip4_ctl00_ctl00").width() != undefined) {
|
||
$("#kpi1").css('width', $("#Panel2_panelBottomRegion_Panel3_ctl00_ctl00_TabStrip4_ctl00_ctl00").width());
|
||
}
|
||
var KPI1 = echarts.init(document.getElementById("kpi1"));
|
||
var optionKpi1 = {
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
grid: {
|
||
left: '15%',
|
||
},
|
||
title: {
|
||
left: 'center',
|
||
text: Contractor,
|
||
top: '5%',
|
||
textStyle: {
|
||
//头部字体大小
|
||
fontSize: 12
|
||
}
|
||
},
|
||
legend: {
|
||
data: ['Deduction Cost(RMB)', 'Deduction Rate(%)'],
|
||
},
|
||
xAxis: [
|
||
{
|
||
type: 'category',
|
||
data: kpi1xAxis.split(','),
|
||
axisPointer: {
|
||
type: 'shadow'
|
||
}
|
||
}
|
||
],
|
||
yAxis: [
|
||
{
|
||
type: 'value',
|
||
name: 'Deduction Cost(RMB)',
|
||
},
|
||
{
|
||
type: 'value',
|
||
name: 'Deduction Rate(%)',
|
||
max: 100,
|
||
axisLabel: {
|
||
formatter: '{value} %'
|
||
}
|
||
}
|
||
],
|
||
dataZoom: [
|
||
{
|
||
show: true,
|
||
start: 0,
|
||
end: parseInt(kpi1DateEnd)
|
||
}
|
||
],
|
||
series: [
|
||
{
|
||
name: 'Deduction Cost(RMB)',
|
||
type: 'bar',
|
||
data: kpi1serieshze.split(','),
|
||
itemStyle: {
|
||
normal: {
|
||
color: '#94AF0a',
|
||
label: {
|
||
show: false, //开启显示
|
||
formatter: '{c}',
|
||
position: 'top', //在上方显示
|
||
textStyle: { //数值样式
|
||
color: 'black',
|
||
fontSize: 12
|
||
}
|
||
}
|
||
}
|
||
}
|
||
},
|
||
{
|
||
name: 'Deduction Rate(%)',
|
||
type: 'line',
|
||
yAxisIndex: 1,
|
||
data: kpi1serieshzl.split(','),
|
||
itemStyle: {
|
||
normal: {
|
||
label: {
|
||
show: true, //开启显示
|
||
formatter: '{c}%',
|
||
position: 'top', //在上方显示
|
||
textStyle: { //数值样式
|
||
color: 'black',
|
||
fontSize: 12,
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
]
|
||
};
|
||
KPI1.setOption(optionKpi1);
|
||
}
|
||
|
||
//KPI2
|
||
function Kpi2(kpi2series, Contractor) {
|
||
if (parseInt($("#kpi1").width()) > 0) {
|
||
$("#kpi2").css('width', $("#kpi1").width());
|
||
}
|
||
var kpi2hze = kpi2series.split('||')[0];
|
||
var kpi2hzl = kpi2series.split('||')[1];
|
||
var kpi2ses = kpi2series.split('||')[2];
|
||
var series = [];
|
||
for (var i = 0; i < kpi2hze.split(',').length; i++) {
|
||
var arr = [];
|
||
arr.push(parseFloat(kpi2hze.split(',')[i]), parseFloat(kpi2hzl.split(',')[i]));
|
||
series.push(arr);
|
||
}
|
||
var KPI2 = echarts.init(document.getElementById("kpi2"));
|
||
var optionKpi2 = {
|
||
tooltip: {
|
||
/*返回需要的信息*/
|
||
formatter: function (param) {
|
||
var value = param.value;
|
||
return '<div style="border-bottom: 1px solid rgba(255,255,255,.3); font-size: 16px;padding-bottom: 7px;margin-bottom: 7px;">' + kpi2ses.split(',')[param.dataIndex] + '[' + value[0] + ',' + value[1] + ']' + '</div>';
|
||
}
|
||
},
|
||
title: {
|
||
left: 'center',
|
||
text: Contractor,
|
||
top: '5%',
|
||
textStyle: {
|
||
//头部字体大小
|
||
fontSize: 12
|
||
}
|
||
},
|
||
xAxis: {
|
||
scale: true,
|
||
name: 'Deduction Cost（RMB）',
|
||
position: 'left',//位置靠左
|
||
nameLocation: 'middle', //位置居中
|
||
nameGap: 30, //与y轴距离
|
||
nameRotate: 0, //角度
|
||
nameTextStyle: {
|
||
fontSize: 14,
|
||
fontWeight: 'bolder'
|
||
}
|
||
},
|
||
yAxis: {
|
||
scale: true,
|
||
name: 'Deduction Rate（%）',
|
||
position: 'left',//位置靠左
|
||
nameLocation: 'middle', //位置居中
|
||
nameGap: 30, //与y轴距离
|
||
nameRotate: 90, //角度
|
||
nameTextStyle: {
|
||
fontSize: 14,
|
||
fontWeight: 'bolder'
|
||
}
|
||
},
|
||
series: [{
|
||
type: 'effectScatter',
|
||
symbolSize: 20
|
||
}, {
|
||
type: 'scatter',
|
||
data: series,
|
||
}]
|
||
};
|
||
KPI2.setOption(optionKpi2);
|
||
}
|
||
|
||
//KPI3
|
||
function KPI3(kpi3xAxis, kpi3seriesSsr, kpi3serieshzl, kpi3DateEnd, Contractor) {
|
||
if (parseInt($("#kpi1").width()) > 0) {
|
||
$("#kpi3").css('width', $("#kpi1").width());
|
||
}
|
||
var KPI3 = echarts.init(document.getElementById("kpi3"));
|
||
var optionKpi3 = {
|
||
tooltip: {
|
||
trigger: 'axis'
|
||
},
|
||
title: {
|
||
left: 'center',
|
||
text: Contractor,
|
||
top: '5%',
|
||
textStyle: {
|
||
//头部字体大小
|
||
fontSize: 12
|
||
}
|
||
},
|
||
legend: {
|
||
data: ['Cost(RMB)', 'Deduction Rate(%)']
|
||
},
|
||
grid: {
|
||
left: '15%',
|
||
},
|
||
xAxis: [
|
||
{
|
||
type: 'category',
|
||
data: kpi3xAxis.split(','),
|
||
axisPointer: {
|
||
type: 'shadow'
|
||
}
|
||
}
|
||
],
|
||
yAxis: [
|
||
{
|
||
type: 'value',
|
||
name: 'Cost(RMB)'
|
||
},
|
||
{
|
||
type: 'value',
|
||
name: 'Deduction Rate(%)',
|
||
axisLabel: {
|
||
formatter: '{value} %'
|
||
}
|
||
}
|
||
],
|
||
dataZoom: [
|
||
{
|
||
show: true,
|
||
start: 0,
|
||
end: parseInt(kpi3DateEnd)
|
||
}
|
||
],
|
||
series: [
|
||
{
|
||
name: 'Cost(RMB)',
|
||
type: 'bar',
|
||
data: kpi3seriesSsr.split(','),
|
||
itemStyle: {
|
||
normal: {
|
||
color: '#94AF0a'
|
||
}
|
||
}
|
||
},
|
||
{
|
||
name: 'Deduction Rate(%)',
|
||
type: 'line',
|
||
yAxisIndex: 1,
|
||
data: kpi3serieshzl.split(','),
|
||
itemStyle: {
|
||
normal: {
|
||
label: {
|
||
show: true, //开启显示
|
||
formatter: '{c}%',
|
||
position: 'top', //在上方显示
|
||
textStyle: { //数值样式
|
||
color: 'black',
|
||
fontSize: 12,
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
]
|
||
};
|
||
KPI3.setOption(optionKpi3);
|
||
}
|
||
</script>
|
||
<script>
|
||
function renderSalary(value) {
|
||
return F.addCommas(value.toFixed(0));
|
||
}
|
||
</script>
|
||
</body>
|
||
</html>
|