|
|
@@ -1,1050 +1,736 @@
|
|
|
<template>
|
|
|
- <div id="container">
|
|
|
- <div class="page_top">
|
|
|
- <div class="top_left">
|
|
|
- <div class="logo">
|
|
|
- <img src="../../assets/logo.jpg"/>
|
|
|
- </div>
|
|
|
- <h2 class="wms_name"><span>保税区A仓</span><em>单仓</em></h2>
|
|
|
- <div class="depot">
|
|
|
- <input type="text" placeholder="选择仓库..." readonly="readonly"/>
|
|
|
- <div class="depo_down">
|
|
|
- <ul>
|
|
|
- <li>A仓库</li>
|
|
|
- <li>B仓库</li>
|
|
|
- <li>C仓库</li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="top_time">
|
|
|
- <input type="text" class="time_star" id="time_star" value="2018-11-11 00:00:00" readonly="readonly"/><span>至</span><input type="text" class="time_end" id="time_end" value="2018-12-11 00:00:00" readonly="readonly"/>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!--顶部-->
|
|
|
- <div class="order_list">
|
|
|
- <div class="order">
|
|
|
- <div class="order_name">总单量</div>
|
|
|
- <h2 class="order_num">204398</h2>
|
|
|
- </div>
|
|
|
- <div class="order">
|
|
|
- <div class="order_name">总出库量</div>
|
|
|
- <h2 class="order_num">197672</h2>
|
|
|
- </div>
|
|
|
- <div class="order">
|
|
|
- <div class="order_name">未出库单量</div>
|
|
|
- <h2 class="order_num">1350</h2>
|
|
|
- </div>
|
|
|
- <div class="order">
|
|
|
- <div class="order_name">今天出库量</div>
|
|
|
- <h2 class="order_num">5414</h2>
|
|
|
- </div>
|
|
|
- <div class="order">
|
|
|
- <div class="order_name">未开始单量</div>
|
|
|
- <h2 class="order_num">734</h2>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!--订单量-->
|
|
|
- <div class="maina">
|
|
|
- <div class="main_left">
|
|
|
- <div class="home_today" >
|
|
|
- <div class="home_tit">
|
|
|
- 今天作业趋势图
|
|
|
- </div>
|
|
|
- <div class="home_list">
|
|
|
- <div class="home_order">
|
|
|
- <div class="home_name">
|
|
|
- 新增单量
|
|
|
- </div>
|
|
|
- <div class="home_num new_num">
|
|
|
- 86
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="home_order">
|
|
|
- <div class="home_name">
|
|
|
- 拣选单量
|
|
|
- </div>
|
|
|
- <div class="home_num jian_num">
|
|
|
- 0
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="home_order">
|
|
|
- <div class="home_name">
|
|
|
- 质检单量
|
|
|
- </div>
|
|
|
- <div class="home_num zhi_num">
|
|
|
- 2
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="home_order">
|
|
|
- <div class="home_name">
|
|
|
- 出库单量
|
|
|
- </div>
|
|
|
- <div class="home_num chu_num">
|
|
|
- 5
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div id="home_today"></div>
|
|
|
- <!--今日作业趋势图-->
|
|
|
- </div>
|
|
|
- <div class="ship_order" id="ship_order"></div>
|
|
|
- <!--货主订单执行情况-->
|
|
|
- </div>
|
|
|
- <div class="main_midd">
|
|
|
- <div class="imple" id="imple"></div>
|
|
|
- <!--订单执行情况-->
|
|
|
- <div class="order_wait" >
|
|
|
- <div class="commis">
|
|
|
- <div class="comm_tit">
|
|
|
- 订单代办事项
|
|
|
- </div>
|
|
|
- <div class="comm_list">
|
|
|
- <div class="comm_cont">
|
|
|
- <span class="com_name">收货等待</span><span class="com_num">228</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="comm_list">
|
|
|
- <div class="comm_cont">
|
|
|
- <span class="com_name">上架等待</span><span class="com_num">9</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="comm_list">
|
|
|
- <div class="comm_cont">
|
|
|
- <span class="com_name">分配等待</span><span class="com_num">0</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="comm_list">
|
|
|
- <div class="comm_cont">
|
|
|
- <span class="com_name">拣货等待</span><span class="com_num">0</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="comm_list">
|
|
|
- <div class="comm_cont">
|
|
|
- <span class="com_name">复核等待</span><span class="com_num">6</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="comm_list">
|
|
|
- <div class="comm_cont">
|
|
|
- <span class="com_name">发货等待</span><span class="com_num">0</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="comm_list">
|
|
|
- <div class="comm_cont">
|
|
|
- <span class="com_name">异常等待</span><span class="com_num">0</span>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!--订单代办事项-->
|
|
|
- <div class="abort">
|
|
|
- <div class="abot_tit">
|
|
|
- 截止时间出库率
|
|
|
- </div>
|
|
|
- <div class="abort_box">
|
|
|
- <div class="abort_list">
|
|
|
- <div class="abort_use">
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主1
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主2
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主3
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主4
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主5
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主6
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主4
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主5
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主6
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主4
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主5
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主6
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="abort_cont">
|
|
|
- <div class="abort_name">
|
|
|
- 货主7
|
|
|
- </div>
|
|
|
- <div class="abort_num">
|
|
|
- 90%
|
|
|
- </div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!--截止时间出库率-->
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- <div class="main_rig">
|
|
|
- <div class="situ_tit">
|
|
|
- 上一小时作业情况
|
|
|
- </div>
|
|
|
- <div class="situ_use">
|
|
|
- <div class="situ_list">
|
|
|
-
|
|
|
- <ul>
|
|
|
- <li>
|
|
|
- <div class="situ_top">
|
|
|
- <span class="situ_name">货主1</span><span class="situ_time">(8点)</span>
|
|
|
- </div>
|
|
|
- <div class="lssl">
|
|
|
- <div class="lsl_name">
|
|
|
- 出库量
|
|
|
- </div>
|
|
|
- <div class="lal_num">
|
|
|
- 138
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lal_all"></div>
|
|
|
- <div class="quan">
|
|
|
- <div class="quan_name">
|
|
|
- 接单量
|
|
|
- </div>
|
|
|
- <div class="quan_num">
|
|
|
- 99
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="quan_all"><div class="tity"></div></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="situ_top">
|
|
|
- <span class="situ_name">货主2</span><span class="situ_time">(8点)</span>
|
|
|
- </div>
|
|
|
- <div class="lssl">
|
|
|
- <div class="lsl_name">
|
|
|
- 出库量
|
|
|
- </div>
|
|
|
- <div class="lal_num">
|
|
|
- 57
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lal_all"></div>
|
|
|
- <div class="quan">
|
|
|
- <div class="quan_name">
|
|
|
- 接单量
|
|
|
- </div>
|
|
|
- <div class="quan_num">
|
|
|
- 23
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="quan_all"><div class="tity"></div></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="situ_top">
|
|
|
- <span class="situ_name">货主3</span><span class="situ_time">(8点)</span>
|
|
|
- </div>
|
|
|
- <div class="lssl">
|
|
|
- <div class="lsl_name">
|
|
|
- 出库量
|
|
|
- </div>
|
|
|
- <div class="lal_num">
|
|
|
- 80
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lal_all"></div>
|
|
|
- <div class="quan">
|
|
|
- <div class="quan_name">
|
|
|
- 接单量
|
|
|
- </div>
|
|
|
- <div class="quan_num">
|
|
|
- 40
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="quan_all"><div class="tity"></div></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="situ_top">
|
|
|
- <span class="situ_name">货主4</span><span class="situ_time">(8点)</span>
|
|
|
- </div>
|
|
|
- <div class="lssl">
|
|
|
- <div class="lsl_name">
|
|
|
- 出库量
|
|
|
- </div>
|
|
|
- <div class="lal_num">
|
|
|
- 400
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lal_all"></div>
|
|
|
- <div class="quan">
|
|
|
- <div class="quan_name">
|
|
|
- 接单量
|
|
|
- </div>
|
|
|
- <div class="quan_num">
|
|
|
- 300
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="quan_all"><div class="tity"></div></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="situ_top">
|
|
|
- <span class="situ_name">货主5</span><span class="situ_time">(8点)</span>
|
|
|
- </div>
|
|
|
- <div class="lssl">
|
|
|
- <div class="lsl_name">
|
|
|
- 出库量
|
|
|
- </div>
|
|
|
- <div class="lal_num">
|
|
|
- 57
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lal_all"></div>
|
|
|
- <div class="quan">
|
|
|
- <div class="quan_name">
|
|
|
- 接单量
|
|
|
- </div>
|
|
|
- <div class="quan_num">
|
|
|
- 45
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="quan_all"><div class="tity"></div></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="situ_top">
|
|
|
- <span class="situ_name">货主6</span><span class="situ_time">(8点)</span>
|
|
|
- </div>
|
|
|
- <div class="lssl">
|
|
|
- <div class="lsl_name">
|
|
|
- 出库量
|
|
|
- </div>
|
|
|
- <div class="lal_num">
|
|
|
- 57
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lal_all"></div>
|
|
|
- <div class="quan">
|
|
|
- <div class="quan_name">
|
|
|
- 接单量
|
|
|
- </div>
|
|
|
- <div class="quan_num">
|
|
|
- 30
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="quan_all"><div class="tity"></div></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="situ_top">
|
|
|
- <span class="situ_name">货主7</span><span class="situ_time">(8点)</span>
|
|
|
- </div>
|
|
|
- <div class="lssl">
|
|
|
- <div class="lsl_name">
|
|
|
- 出库量
|
|
|
- </div>
|
|
|
- <div class="lal_num">
|
|
|
- 57
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lal_all"></div>
|
|
|
- <div class="quan">
|
|
|
- <div class="quan_name">
|
|
|
- 接单量
|
|
|
- </div>
|
|
|
- <div class="quan_num">
|
|
|
- 40
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="quan_all"><div class="tity"></div></div>
|
|
|
- </li>
|
|
|
- <li>
|
|
|
- <div class="situ_top">
|
|
|
- <span class="situ_name">货主8</span><span class="situ_time">(8点)</span>
|
|
|
- </div>
|
|
|
- <div class="lssl">
|
|
|
- <div class="lsl_name">
|
|
|
- 出库量
|
|
|
- </div>
|
|
|
- <div class="lal_num">
|
|
|
- 57
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="lal_all"></div>
|
|
|
- <div class="quan">
|
|
|
- <div class="quan_name">
|
|
|
- 接单量
|
|
|
- </div>
|
|
|
- <div class="quan_num">
|
|
|
- 50
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="quan_all"><div class="tity"></div></div>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
+ <!-- <dv-full-screen-container> -->
|
|
|
+ <el-scrollbar class="screen" ref="scrollDiv" >
|
|
|
+ <!-- :style="{height:height}" -->
|
|
|
+ <div class="statistics" v-on:mouseenter="rollstop" v-on:mouseleave="rollcontinue">
|
|
|
+ <div class="editDate">
|
|
|
+ <!-- 标题装饰组件 -->
|
|
|
+ <!-- <header-decoration /> -->
|
|
|
+ <!-- <div class="stitle">实验室管理看板</div> -->
|
|
|
+ <!-- <div class="block" style="display:none">
|
|
|
+ <span class="demonstration">开始:</span>
|
|
|
+ <el-date-picker v-model="BeginDate" type="year" size="mini" value-format="yyyy" format="yyyy年" style="width: 96px;"
|
|
|
+ :clearable="false" @change="checkYear(BeginDate,'begin')" placeholder="选择日期">
|
|
|
+ </el-date-picker>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <!-- <div class="block"> -->
|
|
|
+ <!-- <span class="demonstration">查询年度:</span> -->
|
|
|
+ <!-- <el-date-picker v-model="endDate" type="year" size="mini" value-format="yyyy" format="yyyy年" :clearable="false" style="width: 96px;"
|
|
|
+ @change="checkYear(endDate,'end')" placeholder="选择日期"> -->
|
|
|
+ <!-- <el-date-picker
|
|
|
+ v-model="endDate"
|
|
|
+ type="year"
|
|
|
+ value-format="yyyy"
|
|
|
+ @change="checkYear(endDate,'end')"
|
|
|
+ placeholder="选择年">
|
|
|
+ </el-date-picker> -->
|
|
|
+ <!-- </el-date-picker> -->
|
|
|
+ <!-- </div> -->
|
|
|
+ <div
|
|
|
+ style="width: 98%;
|
|
|
+ height:2.825rem;
|
|
|
+ line-height: 2.825rem;
|
|
|
+ text-align:center;
|
|
|
+ float: left;
|
|
|
+ margin: 1% 0% 0 1%;
|
|
|
+ color: #fff !important;
|
|
|
+ align-items: center;
|
|
|
+ display:flex" >
|
|
|
+ <!-- <div>
|
|
|
+ 部门：
|
|
|
+ </div>
|
|
|
+ <el-select v-model="bumen" clearable @change="selectAll()" placeholder="请选择部门">
|
|
|
+ <el-option
|
|
|
+ v-for="item in quality"
|
|
|
+ :key="item.id_"
|
|
|
+ :label="item.name_"
|
|
|
+ :value="item.id_">
|
|
|
+ </el-option>
|
|
|
+ </el-select> -->
|
|
|
+ <!-- <div>
|
|
|
+ 月份：
|
|
|
+ </div> -->
|
|
|
+ <el-date-picker
|
|
|
+ v-model="endDate"
|
|
|
+ style="width:100%"
|
|
|
+ type="monthrange"
|
|
|
+ align="right"
|
|
|
+ unlink-panels
|
|
|
+ format="yyyy 年 MM 月"
|
|
|
+ value-format="yyyy-MM"
|
|
|
+ @change="checkYear(endDate,'end')"
|
|
|
+ range-separator="至"
|
|
|
+ start-placeholder="开始日期"
|
|
|
+ end-placeholder="结束日期">
|
|
|
+ </el-date-picker>
|
|
|
+
|
|
|
+ <!-- <el-button type="primary" size="mini" plain @click="selectAll">
|
|
|
+ 查询
|
|
|
+ </el-button> -->
|
|
|
+ <!-- <el-date-picker
|
|
|
+ class="chooseMonth"
|
|
|
+ v-model="NowTime1"
|
|
|
+ type="month"
|
|
|
+ @change="changeTime1"
|
|
|
+ format="yyyy-MM"
|
|
|
+ value-format="yyyy-MM"
|
|
|
+ placeholder="请选择时间">
|
|
|
+ </el-date-picker> -->
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <!-- <div class="block">
|
|
|
+
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <!-- <div class="goBackButton" @click.prevent="goBack()" >
|
|
|
+ 返回
|
|
|
+ </div> -->
|
|
|
+ <!-- <div
|
|
|
+ @click.prevent="rollstop()"
|
|
|
+ style="width: 8%;
|
|
|
+ height:2.825rem;
|
|
|
+ line-height: 2.825rem;
|
|
|
+ text-align:center;
|
|
|
+ float: right;
|
|
|
+ margin: -3% 17.1% 0 0;"
|
|
|
+ v-if="rollup">
|
|
|
+ <dv-border-box-8>暂停</dv-border-box-8>
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ @click.prevent="rollcontinue()"
|
|
|
+ style="width: 8%;
|
|
|
+ height:2.825rem;
|
|
|
+ line-height: 2.825rem;
|
|
|
+ text-align:center;
|
|
|
+ float: right;
|
|
|
+ margin: -3% 17.1% 0 0;"
|
|
|
+ v-else>
|
|
|
+ <dv-border-box-8>继续</dv-border-box-8>
|
|
|
+ </div> -->
|
|
|
+ <!-- <div
|
|
|
+ @click.prevent="goBack()"
|
|
|
+ style="width: 8%;
|
|
|
+ height:2.825rem;
|
|
|
+ line-height: 2.825rem;
|
|
|
+ text-align:center;
|
|
|
+ float: right;
|
|
|
+ margin: -3% 17.1% 0 0;" >
|
|
|
+ <dv-border-box-8>返回</dv-border-box-8>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <!-- <dv-border-box-7 backgroundColor="rgba(6, 30, 93, 0.5)" ><div class="ttitle">质量方针：公正、科学、准确、高效</div></dv-border-box-7>
|
|
|
+ <div class="congxiebox7" style="display: flex;justify-content: space-between;padding: 1.5% 0.2%;">
|
|
|
+ <div style="width:16.4%">
|
|
|
+ <div class="gongshiAll">
|
|
|
+ <div class="touwidth">检测任务完成及时率=</div>
|
|
|
+ <div style="margin: 0 0.2%;">
|
|
|
+ <div class="gongshiXian">及时完成检测项目数量</div>
|
|
|
+ <div style="text-align:center;font-size:12px;padding-top: 6%;">有效检测任务总数</div>
|
|
|
+ </div>
|
|
|
+ <div>×100%</div>
|
|
|
+ </div>
|
|
|
+ <div class="mubiaozhi">当前目标值：{{quality[0].val}}</div>
|
|
|
+ </div>
|
|
|
+ <div style="width:21.4%">
|
|
|
+ <div class="gongshiAll">
|
|
|
+ <div class="touwidth">检测报告差错率=</div>
|
|
|
+ <div style="margin: 0 0.2%;">
|
|
|
+ <div class="gongshiXian">统计期内检测数据的差错次数</div>
|
|
|
+ <div style="text-align:center;font-size:12px;padding-top: 6%;">统计期内检测报告总数</div>
|
|
|
+ </div>
|
|
|
+ <div>×100%</div>
|
|
|
+ </div>
|
|
|
+ <div class="mubiaozhi">当前目标值：{{quality[1].val}}</div>
|
|
|
+ </div>
|
|
|
+ <div style="width:17.4%">
|
|
|
+ <div class="gongshiAll">
|
|
|
+ <div class="touwidth">客户满意度=</div>
|
|
|
+ <div style="margin: 0 0.2%;">
|
|
|
+ <div class="gongshiXian">评分得分*有效问卷数量</div>
|
|
|
+ <div style="text-align:center;font-size:12px;padding-top: 6%;">有效问卷总分</div>
|
|
|
+ </div>
|
|
|
+ <div>×100%</div>
|
|
|
+ </div>
|
|
|
+ <div class="mubiaozhi">当前目标值：{{quality[2].val}}</div>
|
|
|
+ </div>
|
|
|
+ <div style="width:17.4%">
|
|
|
+ <div class="gongshiAll">
|
|
|
+ <div class="touwidth">投诉率=</div>
|
|
|
+ <div style="margin: 0 0.2%;">
|
|
|
+ <div class="gongshiXian">统计期内有效投诉项目数</div>
|
|
|
+ <div style="text-align:center;font-size:12px;padding-top: 6%;">统计期内检测委托总数</div>
|
|
|
+ </div>
|
|
|
+ <div>×100%</div>
|
|
|
+ </div>
|
|
|
+ <div class="mubiaozhi">当前目标值：{{quality[3].val}}</div>relOf
|
|
|
+ </div>
|
|
|
+ <div style="width:27.4%">
|
|
|
+ <div class="gongshiAll">
|
|
|
+ <div class="touwidth">投诉回复及时率=</div>
|
|
|
+ <div style="margin: 0 0.2%;">
|
|
|
+ <div class="gongshiXian">统计期内投诉处理完成次数</div>
|
|
|
+ <div style="text-align:center;font-size:12px;padding-top: 6%;">统计期内有效投诉总次数</div>
|
|
|
+ </div>
|
|
|
+ <div>×100%</div>
|
|
|
+ </div>
|
|
|
+ <div class="mubiaozhi">当前目标值：{{quality[4].val}}</div>
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+ <!-- <div class="congxiebox7" v-if="pageOT==1&&bumen!=''">
|
|
|
+ <div class="ttitle" style="text-align: center;">部门质量目标与质量指标</div>
|
|
|
+ <div class="componentsData" v-if="relOf"> -->
|
|
|
+ <!--
|
|
|
+ <s1jianCe :height="'290%'" :width="static=='row' ? '19.5%': '100%'" :colorw = "colorw" :mubiao = "quality[1].val"
|
|
|
+ v-if="showAll || showComponents[5]" :data = "getS2jianCe()" />
|
|
|
+ <s3tousu :height="'290%'" :width="static=='row' ? '19.5%': '100%'" :colorw = "colorw" :mubiao = "quality[3].val"
|
|
|
+ v-if="showAll || showComponents[6]" :data = "getS3tousu()"/>
|
|
|
+ <s13shengWu :height="'290%'" :width="static=='row' ? '19.5%': '100%'" :colorw = "colorw" :mubiao = "quality[4].val"
|
|
|
+ v-if="showAll || showComponents[17]" :data = "getS3tousu()"/> -->
|
|
|
+ <!-- <s11biaoZhunWucol :height="'390%'" :width="static=='row' ? '100%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[15]" :data = "getfenzuZLZBObjNum()"/> -->
|
|
|
+ <!-- <div class="clear"></div>
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+ <!-- <div class="congxiebox7" style="overflow:hiddien" v-if="pageOT==1&&bumen!=''">
|
|
|
+ <div class="ttitle" style="margin:2% 0;text-align: center;">质量目标与质量指标公式</div>
|
|
|
+ <div class="componentsData" v-if="relOf"> -->
|
|
|
+ <!-- <dv-scroll-board style="height:350px;white-space:pre-wrap"
|
|
|
+ v-if="showAll || showComponents[23]||tableData1.data.length>0"
|
|
|
+ :config="tableData1" -->
|
|
|
+ <!-- /> -->
|
|
|
+ <!-- <div class="clear"></div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+ <!-- <div class="congxiebox7" style="display:inline-block;width:79%;" v-if="pageOT==1&&bumen==''">
|
|
|
+ <div class="ttitle" style="margin:2% 0;text-align: center;">各部门质量目标与质量指标</div>
|
|
|
+ <div class="componentsData" v-if="relOf"> -->
|
|
|
+ <s11biaoZhunWu :height="'290%'" :width="static=='row' ? '100%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[15]" :data = "getyangPinCaiJiObjNum()"/>
|
|
|
+ <!-- <div class="clear"></div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="congxiebox7" style="display:inline-block;width:19%;float:right;overflow:hiddien" v-if="pageOT==1&&bumen==''">
|
|
|
+ <div class="ttitle" style="margin:9% 0;text-align: center;">质量目标与质量指标总计</div>
|
|
|
+ <div class="componentsData" v-if="relOf">
|
|
|
+ <dv-scroll-board style="height:835px;"
|
|
|
+ v-if="showAll || showComponents[22]||tableData.data.length>0"
|
|
|
+ :config="tableData"
|
|
|
+ />
|
|
|
+
|
|
|
+ <div class="clear"></div>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <!-- <div class="congxiebox7" style="display:inline-block;width:49%;" v-if="pageOT==2">
|
|
|
+ <div class="ttitle" style="text-align: center;">人员培训与管理</div>
|
|
|
+ <div class="componentsData" v-if="relOf"> -->
|
|
|
+ <s4renYuanPeiXun :height="'250%'" :width="static=='row' ? '50%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[8]" :data = "getS4renYuanPeiXun()"/>
|
|
|
+ <s5renYuanJianDu :height="'250%'" :width="static=='row' ? '50%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[9]" :data = "getS5renYuanJianDu()"/>
|
|
|
+ <!-- <s16bzJunZhu :height="'290%'" :width="static=='row' ? '33%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[20]" :data = "getbzJunZhujNum()"/>
|
|
|
+ <s17bzXiBao :height="'290%'" :width="static=='row' ? '33%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[21]" :data = "getbzXiBaoObjNum()"/>
|
|
|
+ <div class="clear"></div> -->
|
|
|
+ <!-- </div>
|
|
|
+ </div> -->
|
|
|
+ <!-- <div class="congxiebox7" style="display:inline-block;width:49%;float:right;" v-if="pageOT==2">
|
|
|
+ <div class="ttitle" style="text-align: center;">设备维保</div>
|
|
|
+ <div class="componentsData" v-if="relOf"> -->
|
|
|
+ <s7sheBeiJiaoZhun :height="'250%'" :width="static=='row' ? '50%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[12]" :data = "getJiaoYanObjNum()"/>
|
|
|
+ <s8sheBeiHeCha :height="'250%'" :width="static=='row' ? '50%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[11]" :data = "gethechaObjNum()"/>
|
|
|
+ <!-- <div class="clear"></div> -->
|
|
|
+ <!-- </div>
|
|
|
+ </div>
|
|
|
+ <div class="congxiebox7" v-if="pageOT==2">
|
|
|
+
|
|
|
+ <div class="ttitle" style="text-align: center;">质量管理</div>
|
|
|
+ <div class="componentsData" v-if="relOf"> -->
|
|
|
+ <s9neiBuZhiLiang :height="'250%'" :width="static=='row' ? '25%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[13]" :data = "getS9neiBuZhiLiang()"/>
|
|
|
+ <s10waiBuNengLi :height="'250%'" :width="static=='row' ? '25%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[14]" :data = "getnengtliObjNum()"/>
|
|
|
+
|
|
|
+ <s15tousu :height="'250%'" :width="static=='row' ? '25%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[19]" :data = "getS3tousu()"/>
|
|
|
+ <s12fengXian :height="'250%'" :width="static=='row' ? '25%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[16]" :data = "getS12fengXian()"/>
|
|
|
+ <!-- <div class="clear"></div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="congxiebox7" style="display:inline-block;width:49%;" v-if="pageOT==2">
|
|
|
+ <div class="ttitle" style="text-align: center;">内审计划</div>
|
|
|
+ <div class="componentsData" v-if="relOf"> -->
|
|
|
+ <s2manYiDu :height="'250%'" :width="static=='row' ? '50%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[7]" :data = "getS2manYiDu()"/>
|
|
|
+ <s14bufuhexiang :height="'250%'" :width="static=='row' ? '50%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[18]" :data = "getS14bufuhexiang()"/>
|
|
|
+ <!-- </div>
|
|
|
+ </div>
|
|
|
+ <div class="congxiebox7" style="display:inline-block;width:49%;float:right;" v-if="pageOT==2">
|
|
|
+ <div class="ttitle" style="text-align: center;">管审计划</div>
|
|
|
+ <div class="componentsData" v-if="relOf"> -->
|
|
|
+ <s1zhiLiangMuBiao :height="'250%'" :width="static=='row' ? '50%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[1]" :data = "getS1renwu()"/>
|
|
|
+ <s16bzJunZhu :height="'250%'" :width="static=='row' ? '50%': '100%'" :colorw = "colorw"
|
|
|
+ v-if="showAll || showComponents[20]" :data = "getbzJunZhujNum()"/>
|
|
|
+ <!-- </div>
|
|
|
+ </div>
|
|
|
+ -->
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ </div>
|
|
|
+ </el-scrollbar>
|
|
|
+ <!-- </dv-full-screen-container> -->
|
|
|
</template>
|
|
|
-<script scoped>
|
|
|
- import echarts from 'echarts'
|
|
|
- import $ from 'jquery'
|
|
|
-
|
|
|
-
|
|
|
|
|
|
+<script>
|
|
|
+ //全屏展示
|
|
|
+ import screenfull from 'screenfull'
|
|
|
+ //大屏标题组件
|
|
|
+ import headerDecoration from './headerDecoration'
|
|
|
+
|
|
|
+ import s1zhiLiangMuBiao from './item/s1zhiLiangMuBiao.vue'
|
|
|
+ import s1zhiLiang1 from './item/s1zhiLiang1.vue'
|
|
|
+ import s1zhiLiang2 from './item/s1zhiLiang2.vue'
|
|
|
+ import s1zhiLiang3 from './item/s1zhiLiang3.vue'
|
|
|
+
|
|
|
+ import s1jianCe from './item/s1jianCe.vue'
|
|
|
+ import s2manYiDu from './item/s2manYiDu.vue'
|
|
|
+ import s3tousu from './item/s3tousu.vue'
|
|
|
+ import s4renYuanPeiXun from './item/s4renYuanPeiXun.vue'
|
|
|
+ import s5renYuanJianDu from './item/s5renYuanJianDu.vue'
|
|
|
+ import s6sheBeiWeiHu from './item/s6sheBeiWeiHu.vue'
|
|
|
+ import s7sheBeiJiaoZhun from './item/s7sheBeiJiaoZhun.vue'
|
|
|
+ import s8sheBeiHeCha from './item/s8sheBeiHeCha.vue'
|
|
|
+ import s9neiBuZhiLiang from './item/s9neiBuZhiLiang.vue'
|
|
|
+ import s10waiBuNengLi from './item/s10waiBuNengLi.vue'
|
|
|
+ import s11biaoZhunWu from './item/s11biaoZhunWuCol2.vue'
|
|
|
+ import s11biaoZhunWucol from './item/s11biaoZhunWuCol.vue'
|
|
|
+
|
|
|
+ import s12fengXian from './item/s12fengXian.vue'
|
|
|
+ import s13shengWu from './item/s13shengWu.vue'
|
|
|
+ import s14bufuhexiang from './item/s14bufuhexiangCol.vue'
|
|
|
+ import s15tousu from './item/s15tousu.vue'
|
|
|
+ import s16bzJunZhu from './item/s16bzJunZhuCol2.vue'
|
|
|
+ import s17bzXiBao from './item/s17bzXiBao.vue'
|
|
|
+
|
|
|
+
|
|
|
+ import none from './item/none.vue'
|
|
|
+
|
|
|
+ import { DBData ,getConfig,getJiaoYanObj, gethechaObj, getnengliObj,getkangningyangpinObj,getgaijinxiangObj,getbufuheObj,getguanshenObj,getneishenObj,getfengxianObj,getyingjiObj,getneibuObj,getwaibuObj,gethechaMGObj,getJiaoYanMGObj,getgangqianpeixunObj,getzaigangrenyuanObj,getfenzuZLZBObj,getzongZLMBObj,getzhiliangzhibiaotitleObj, getyangPinCaiJiObj,getbiaozhunTObj,getbzJunZhuObj,getbzJunZhuTObj,getbzXiBaoObj,getbzXiBaoTObj} from './js/selectDB.js'
|
|
|
+ import sendDatas from './sendDatas.js'
|
|
|
+ import repostCurd from '@/business/platform/form/utils/custom/joinCURD.js'
|
|
|
+import * as forEach from 'lodash/forEach'
|
|
|
export default {
|
|
|
- components:{
|
|
|
-
|
|
|
+ components:{
|
|
|
+ headerDecoration,
|
|
|
+ none,
|
|
|
+ s1zhiLiang1,
|
|
|
+ s1zhiLiang2,
|
|
|
+ s1zhiLiang3,
|
|
|
+ s1zhiLiangMuBiao,
|
|
|
+ s1jianCe,
|
|
|
+ s2manYiDu,
|
|
|
+ s3tousu,
|
|
|
+ s4renYuanPeiXun,
|
|
|
+ s5renYuanJianDu,
|
|
|
+ s6sheBeiWeiHu,
|
|
|
+ s7sheBeiJiaoZhun,
|
|
|
+ s8sheBeiHeCha,
|
|
|
+ s9neiBuZhiLiang,
|
|
|
+ s10waiBuNengLi,
|
|
|
+ s11biaoZhunWu,
|
|
|
+ s12fengXian,
|
|
|
+ s13shengWu,
|
|
|
+ s14bufuhexiang,
|
|
|
+ s15tousu,
|
|
|
+ s16bzJunZhu,
|
|
|
+ s17bzXiBao,
|
|
|
+ s11biaoZhunWucol
|
|
|
+ },
|
|
|
+ props:{
|
|
|
+ shows:{ //传入的内容显示序号
|
|
|
+ type: Array,
|
|
|
+ default:() => []
|
|
|
},
|
|
|
- props:{
|
|
|
-
|
|
|
- },
|
|
|
- mounted() {
|
|
|
-
|
|
|
- $(".order_num").each(function(){
|
|
|
- var that=$(this);
|
|
|
- var text1=that.text();
|
|
|
- var text1_1=parseInt(text1);
|
|
|
- var te=formatNum(text1_1+"");
|
|
|
- that.text(te)
|
|
|
- })
|
|
|
- function formatNum(str) {
|
|
|
- var newStr = "";
|
|
|
- var count = 0;
|
|
|
- if (str.indexOf(".") == -1) {
|
|
|
- for (var i = str.length - 1; i >= 0; i--) {
|
|
|
- if (count % 3 == 0 && count != 0) {
|
|
|
- newStr = str.charAt(i) + "," + newStr;
|
|
|
- } else {
|
|
|
- newStr = str.charAt(i) + newStr;
|
|
|
- }
|
|
|
- count++;
|
|
|
- }
|
|
|
- str = newStr;
|
|
|
- return str;
|
|
|
- }
|
|
|
-
|
|
|
- }
|
|
|
-$(function(){
|
|
|
- $("body").click(function(){
|
|
|
- $(".depo_down").slideUp();
|
|
|
- })
|
|
|
- $(".depot").click(function(e){
|
|
|
- e.stopPropagation();
|
|
|
- if($(this).hasClass("active")){
|
|
|
- $(this).removeClass("active");
|
|
|
- $(".depo_down").slideUp();
|
|
|
- }else{
|
|
|
- $(this).addClass("active");
|
|
|
- $(".depo_down").slideDown();
|
|
|
- }
|
|
|
- })
|
|
|
- $(".depo_down li").click(function(){
|
|
|
- var tex=$(this).text();
|
|
|
- $(".depot input").val(tex);
|
|
|
- })
|
|
|
- })
|
|
|
-let myChart1 =echarts.init(document.getElementById('home_today'));
|
|
|
- let option1 = {
|
|
|
- backgroundColor: '#1b1e25',
|
|
|
- title: {
|
|
|
- text: ''
|
|
|
- },
|
|
|
-
|
|
|
- tooltip: {
|
|
|
- enterable:true,
|
|
|
- trigger: 'axis'
|
|
|
-
|
|
|
- },
|
|
|
- grid: {
|
|
|
- left: '3%',
|
|
|
- right: '3%',
|
|
|
- top: '10%',
|
|
|
- bottom:"2%",
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
- xAxis : [
|
|
|
- {
|
|
|
- axisLine:{
|
|
|
- lineStyle:{
|
|
|
- color:'#3e4148',
|
|
|
- width:1,//这里是为了突出显示加上的
|
|
|
- }
|
|
|
- },
|
|
|
- type : 'category',
|
|
|
- boundaryGap : false,
|
|
|
- data : ['0','1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20','21','22','23']
|
|
|
- }
|
|
|
- ],
|
|
|
- yAxis : [
|
|
|
- {
|
|
|
- splitLine:{
|
|
|
- lineStyle:{
|
|
|
- color: '#21242b',
|
|
|
- }
|
|
|
- },
|
|
|
- type : 'value',
|
|
|
- axisLine:{
|
|
|
- lineStyle:{
|
|
|
- color:'#43484e',
|
|
|
- width:0,//这里是为了突出显示加上的
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- ],
|
|
|
- series : [
|
|
|
- {
|
|
|
- name:'新增单量',
|
|
|
- type:'line',
|
|
|
- symbol:'none',
|
|
|
- data:[50, 132,40, 1500, 2000, 800, 210,100],
|
|
|
- smooth: true,
|
|
|
- itemStyle : {
|
|
|
- normal : {
|
|
|
- lineStyle:{
|
|
|
- color:'#533d86'
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- areaStyle: {normal: { color: ['rgba(255,255,255,0.1)']}},
|
|
|
-
|
|
|
- },
|
|
|
- {
|
|
|
- name:'拣选单量',
|
|
|
- type:'line',
|
|
|
- symbol:'none',
|
|
|
- data:[2, 8, 500, 2000,200,100, 50,50],
|
|
|
- smooth: true,
|
|
|
- itemStyle : {
|
|
|
- normal : {
|
|
|
- lineStyle:{
|
|
|
- color:'#60ba9e'
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- areaStyle: {normal: { color: ['rgba(255,255,255,0.1)']}},
|
|
|
-
|
|
|
- },
|
|
|
- {
|
|
|
- name:'质检单量',
|
|
|
- type:'line',
|
|
|
- symbol:'none',
|
|
|
- data:[150, 500, 530, 1500, 1000, 330, 410,60],
|
|
|
- smooth: true,
|
|
|
- itemStyle : {
|
|
|
- normal : {
|
|
|
- lineStyle:{
|
|
|
- color:'#476d9e'
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- areaStyle: {normal: { color: ['rgba(255,255,255,0.1)']}},
|
|
|
-
|
|
|
- },
|
|
|
- {
|
|
|
- name:'出库单量',
|
|
|
- type:'line',
|
|
|
- symbol:'none',
|
|
|
- data:[800, 400, 1500, 1200, 800, 700, 600,200],
|
|
|
- smooth: true,
|
|
|
- itemStyle : {
|
|
|
- normal : {
|
|
|
- lineStyle:{
|
|
|
- color:'#b1526a'
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- areaStyle: {normal: { color: ['rgba(255,255,255,0.1)']}},
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
-
|
|
|
- let myChart2 =echarts.init(document.getElementById('ship_order'));
|
|
|
- let option2 = {
|
|
|
- backgroundColor: '#1b1e25',
|
|
|
- title: {
|
|
|
- text: '货主订单执行情况',
|
|
|
- textStyle:{ //设置主标题风格
|
|
|
- color:'#ffffff',//设置主标题字体颜色
|
|
|
- fontSize:'14px',
|
|
|
-
|
|
|
- },
|
|
|
- subtext: '货主1 货主2 货主3 货主4 货主5 货主6 货主7',
|
|
|
- subtextStyle: {
|
|
|
- color: '#ffffff' // 副标题文字颜色
|
|
|
- }
|
|
|
- },
|
|
|
- color: ['#ed4b97', '#26a0c9', '#44cb90', '#d2bd7a'],
|
|
|
- tooltip: {},
|
|
|
- legend: {
|
|
|
- data: ['未开始', '作业中', '出库', '拦截'],
|
|
|
- textStyle: {
|
|
|
- color: '#ffffff'
|
|
|
- },
|
|
|
- right: 10,
|
|
|
- itemWidth: 10,
|
|
|
- itemHeight: 10
|
|
|
- },
|
|
|
-
|
|
|
- calculable: true,
|
|
|
- grid: {
|
|
|
- left: '3%',
|
|
|
- right: '3%',
|
|
|
- bottom:"20",
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
- xAxis: [
|
|
|
- {
|
|
|
- type: 'category',
|
|
|
- axisTick: {show: false},
|
|
|
- data: ['货主1', '货主2', '货主3', '货主4', '货主5','货主6','货主7'],
|
|
|
- "axisLabel":{
|
|
|
- interval: 0
|
|
|
- },
|
|
|
- axisLine:{
|
|
|
- lineStyle:{
|
|
|
- color:'#ffffff',
|
|
|
- width:1,//这里是为了突出显示加上的
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- }
|
|
|
- ],
|
|
|
- dataZoom: [{
|
|
|
- type: 'slider',
|
|
|
- show: true, //flase直接隐藏图形
|
|
|
- xAxisIndex: [0],
|
|
|
- left: '9%', //滚动条靠左侧的百分比
|
|
|
- bottom: -5,
|
|
|
- height: 15,
|
|
|
- start: 0,//滚动条的起始位置
|
|
|
- end: 50
|
|
|
- }] ,
|
|
|
- yAxis: [
|
|
|
- {
|
|
|
- splitLine:{
|
|
|
- lineStyle:{
|
|
|
- color: '#21242b',
|
|
|
- }
|
|
|
- },
|
|
|
- type: 'value',
|
|
|
- axisLine:{
|
|
|
- lineStyle:{
|
|
|
- color:'#43484e',
|
|
|
- width:0,//这里是为了突出显示加上的
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- ],
|
|
|
- series: [
|
|
|
- {
|
|
|
- name: '未开始',
|
|
|
- type: 'bar',
|
|
|
- barGap: 0.2,
|
|
|
- data: [320, 332,310,200,222,40,300]
|
|
|
- },
|
|
|
- {
|
|
|
- name: '作业中',
|
|
|
- type: 'bar',
|
|
|
- data: [130, 182,30,50,122,20,30]
|
|
|
- },
|
|
|
- {
|
|
|
- name: '出库',
|
|
|
- type: 'bar',
|
|
|
- data: [320, 82,220,250,322,50,10]
|
|
|
- },
|
|
|
- {
|
|
|
- name: '拦截',
|
|
|
- type: 'bar',
|
|
|
- data: [100, 182,120,100,22,100,30]
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
- let myChart3 =echarts.init(document.getElementById('imple'));
|
|
|
- let option3 = {
|
|
|
- grid: {
|
|
|
- left: '3%',
|
|
|
- right: '3%',
|
|
|
- top: '10%',
|
|
|
- bottom:"2%",
|
|
|
- containLabel: true
|
|
|
- },
|
|
|
- title: {
|
|
|
- text: '订单执行情况',
|
|
|
- textStyle:{ //设置主标题风格
|
|
|
- color:'#90939a',//设置主标题字体颜色
|
|
|
- fontSize:'14px',
|
|
|
-
|
|
|
- },
|
|
|
- },
|
|
|
- backgroundColor: '#1b1e25',
|
|
|
- tooltip: {
|
|
|
- trigger: 'item',
|
|
|
- formatter: " {b}:{d}%"
|
|
|
- },
|
|
|
- legend: {
|
|
|
- orient: 'vertical',
|
|
|
- right: 10,
|
|
|
- y:'center',
|
|
|
- textStyle: {
|
|
|
- color: '#7c8081'
|
|
|
- },
|
|
|
- itemWidth: 10,
|
|
|
- itemHeight: 10,
|
|
|
- data:['未开始','波次','拣选','质检','拦截','出库'],
|
|
|
- formatter: function (params) {
|
|
|
- for (var i = 0; i < option3.series[0].data.length; i++) {
|
|
|
- if (option3.series[0].data[i].name == params) {
|
|
|
- return params +":"+ option3.series[0].data[i].value;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- series: [
|
|
|
- {
|
|
|
- name:'订单执行情况',
|
|
|
- type:'pie',
|
|
|
- radius: ['50%', '70%'],
|
|
|
- avoidLabelOverlap: false,
|
|
|
- label: {
|
|
|
- normal: {
|
|
|
- show: false,
|
|
|
- position: 'center'
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- show: true,
|
|
|
- textStyle: {
|
|
|
- fontSize: '20',
|
|
|
- fontWeight: 'bold'
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- labelLine: {
|
|
|
- normal: {
|
|
|
- show: false
|
|
|
- }
|
|
|
- },
|
|
|
- data:[
|
|
|
- {value:734, name:'未开始'},
|
|
|
- {value:260, name:'波次'},
|
|
|
- {value:62, name:'拣选'},
|
|
|
- {value:294, name:'质检'},
|
|
|
- {value:5376, name:'拦截'},
|
|
|
- {value:17672, name:'出库'}
|
|
|
- ],
|
|
|
- itemStyle: {
|
|
|
- emphasis: {
|
|
|
- shadowBlur: 10,
|
|
|
- shadowOffsetX: 0,
|
|
|
- shadowColor: 'rgba(0, 0, 0, 0.5)'
|
|
|
- },
|
|
|
- normal:{
|
|
|
- color:function(params) {
|
|
|
- //自定义颜色
|
|
|
- var colorList = [
|
|
|
- '#74529e', '#da8f3c', '#447cb7', '#be4868', '#4dc892', '#efbb43',
|
|
|
- ];
|
|
|
- return colorList[params.dataIndex]
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- ]
|
|
|
- };
|
|
|
- myChart1.setOption(option1);//今日作业趋势
|
|
|
- myChart2.setOption(option2);//货主订单执行情况
|
|
|
- myChart3.setOption(option3);//订单执行情况
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
-
|
|
|
+ static:{ //显示类型，默认为横向 ,作为表单统计图的外部引用为 line
|
|
|
+ type: String,
|
|
|
+ default:'row'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mixins: [sendDatas],
|
|
|
+ created() {
|
|
|
+ //时间
|
|
|
+ // this.currentTime()
|
|
|
+ this.getqualityData()
|
|
|
+ // if(screenfull.isEnabled && !screenfull.isFullscreen){
|
|
|
+ // this.allView()
|
|
|
+
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ provide(){ return{ rollcontinue:this.rollcontinue,rollstop:this.rollstop } },
|
|
|
+ mounted() {
|
|
|
+ /*以shows是否有参数来判断， 是否需要仅显示部分子组件*/
|
|
|
+ if(this.shows.length>0){
|
|
|
+ this.showAll=false
|
|
|
+ this.isShowComponents()
|
|
|
+ }
|
|
|
+ /* 开始及结束时间的默认设置*/
|
|
|
+ if (!this.BeginDate && !this.endDate) {
|
|
|
+ this.BeginDate = this.getDate(1) + ''
|
|
|
+ this.endDate = this.getDate(0)
|
|
|
+ // console.log(this.endDate)
|
|
|
+ this.dataScope.push(this.BeginDate)
|
|
|
+ this.dataScope.push(this.endDate)
|
|
|
+ }
|
|
|
+ //获取统计的配置
|
|
|
+
|
|
|
+ // if(this.buhegelvObj.length>0){
|
|
|
+ this.timer1 = setInterval(()=>{
|
|
|
+ if(this.pageOT>=2){
|
|
|
+ this.pageOT=1
|
|
|
+ }else{
|
|
|
+ this.pageOT = this.pageOT + 1
|
|
|
+ }
|
|
|
+ // console.log(this.pageOT)
|
|
|
+ },8000)
|
|
|
+ // }
|
|
|
+
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ height:(window.screen.height-200)+"px",
|
|
|
+ BeginDate: '',
|
|
|
+ endDate: '',
|
|
|
+ jiaoyanObj:[],
|
|
|
+ jiaoyanMGObj:[],
|
|
|
+ hechaObj:[],
|
|
|
+ hechaMGObj:[],
|
|
|
+ waibuObj:[],
|
|
|
+ neibuObj:[],
|
|
|
+ yingjiObj:[],
|
|
|
+ fengxianObj:[],
|
|
|
+ neishenObj:[],
|
|
|
+ guanshenObj:[],
|
|
|
+ bufuheObj:[],
|
|
|
+ gaijinxiangObj:[],
|
|
|
+ nengliObj:[],
|
|
|
+ buhegelvObj:[],
|
|
|
+ zhiliangzhibiaotitle:[],
|
|
|
+ biaozhunTObj:[],
|
|
|
+ bzJunZhuObj:[],
|
|
|
+ bzJunZhuTObj:[],
|
|
|
+ bzXiBaoObj:[],
|
|
|
+ bzXiBaoTObj:[],
|
|
|
+ fenzuzlmb:[],
|
|
|
+ zaigangrenyuan:[],
|
|
|
+ gangqianpeixun:[],
|
|
|
+ relData: {},
|
|
|
+ relOf: false,
|
|
|
+ selectEnd: '',
|
|
|
+ selectBeg: '',
|
|
|
+ showAll:true,
|
|
|
+ timer: '',
|
|
|
+ timer1: '',
|
|
|
+ showComponents:{},//显示全部统计子组件 , 若有新增，往后累计。 供动态表单进行查阅使用。
|
|
|
+ dataScope: [],
|
|
|
+ colorw: '#fff',
|
|
|
+ pageOT: 1,
|
|
|
+ rollup:true,
|
|
|
+ idsStr:'',
|
|
|
+ quality:[],
|
|
|
+ bumen:'',
|
|
|
+ tableNum:[],
|
|
|
+ tableData:{
|
|
|
+ header: ['<span style="font-size:16px;height:53px">质量指标</span>', '<span style="font-size:16px;height:53px">百分比/数量</span>'],
|
|
|
+ rowNum: 10,
|
|
|
+ columnWidth: [600, 400],
|
|
|
+ align: ['left','right'],
|
|
|
+ data: [
|
|
|
+ ['行1列1', '行1列2', '行1列3'],
|
|
|
+ ]
|
|
|
+ },
|
|
|
+ tableData1:{
|
|
|
+ header: ['<span style="font-size:16px;height:53px">质量指标</span>','<span style="font-size:16px;height:53px">计算公式</span>', '<span style="font-size:16px;height:53px">指标限值</span>'],
|
|
|
+ rowNum: 5,
|
|
|
+ columnWidth: [500,700, 200],
|
|
|
+ align: ['left','left','right'],
|
|
|
+ data: [
|
|
|
+ ['行1列1', '行1列2', '行1列3'],
|
|
|
+ ]
|
|
|
}
|
|
|
- },
|
|
|
- methods: {
|
|
|
-
|
|
|
}
|
|
|
+ },
|
|
|
+ beforeDestroy() {
|
|
|
+ // if(screenfull.isFullscreen){
|
|
|
+ // screenfull.toggle()
|
|
|
+ // }
|
|
|
+ clearInterval(this.timer);
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /* 判断是否统计子组件中传递过来的，是否需要隐藏。若需要则进行隐藏的遍历 */
|
|
|
+ isShowComponents(){
|
|
|
+ /* 将参数进行显示 */
|
|
|
+ for(let i=0;i<this.shows.length;i++){
|
|
|
+ this.showComponents[this.shows[i]] = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getqualityData() {
|
|
|
+ let pos = this.$store.getters.level.second?this.$store.getters.level.second:this.$store.getters.level.first
|
|
|
+ let sql="select id_,name_ from ibps_party_entity where name_ like '%组' and PATH_ like '%"+pos+"%'"
|
|
|
+ repostCurd('sql', sql).then(response => {
|
|
|
+ // console.log(sql)
|
|
|
+ let a = response.variables.data //结果一定存在第0个，因为只有一条数据
|
|
|
+ this.quality = a
|
|
|
+ // for (let i = 0; i < this.quality.length; i++) {
|
|
|
+ // let a = {}
|
|
|
+ // a.value = this.quality[i].id_
|
|
|
+ // a.label = this.quality[i].name_
|
|
|
+ // this.bumen.push(a)
|
|
|
+ // }
|
|
|
+ this.idsStr = this.quality.map(function(obj,index){
|
|
|
+ return obj.id_;
|
|
|
+ }).join(",");
|
|
|
+ if(this.bumen != ''){
|
|
|
+ this.getConfigData(this.endDate,this.bumen)
|
|
|
+ }else{
|
|
|
+ this.getConfigData(this.endDate,this.idsStr)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /* 查询统计配置中的完成率*/
|
|
|
+ getConfigData(end,info) {
|
|
|
+ let that = this
|
|
|
+ repostCurd('sql', getConfig()).then(response => {
|
|
|
+ that.config = response.variables.data //结果一定存在第0个，因为只有一条数据
|
|
|
+ repostCurd('sql', getyangPinCaiJiObj(end,info)).then(response1 => {
|
|
|
+ that.buhegelvObj = response1.variables.data
|
|
|
+ repostCurd('sql', getzhiliangzhibiaotitleObj(end,info)).then(response2 => {
|
|
|
+ that.zhiliangzhibiaotitle = response2.variables.data
|
|
|
+ repostCurd('sql', getzongZLMBObj(end,info)).then(response3 => {
|
|
|
+ that.tableNum = response3.variables.data
|
|
|
+ repostCurd('sql', getfenzuZLZBObj(end,info)).then(response4 => {
|
|
|
+ that.fenzuzlmb = response4.variables.data
|
|
|
+ repostCurd('sql', getzaigangrenyuanObj(end,info)).then(response5 => {
|
|
|
+ that.zaigangrenyuan = response5.variables.data
|
|
|
+ repostCurd('sql', getgangqianpeixunObj(end,info)).then(response6 => {
|
|
|
+ that.gangqianpeixun = response6.variables.data
|
|
|
+ repostCurd('sql', getJiaoYanObj(end,info)).then(response7 => {
|
|
|
+ that.jiaoyanObj = response7.variables.data
|
|
|
+ repostCurd('sql', getJiaoYanMGObj(end,info)).then(response8 => {
|
|
|
+ that.jiaoyanMGObj = response8.variables.data
|
|
|
+ repostCurd('sql', gethechaObj(end,info)).then(response9 => {
|
|
|
+ that.hechaObj = response9.variables.data
|
|
|
+ repostCurd('sql', gethechaMGObj(end,info)).then(response10 => {
|
|
|
+ that.hechaMGObj = response10.variables.data
|
|
|
+ repostCurd('sql', getwaibuObj(end,info)).then(response11 => {
|
|
|
+ that.waibuObj = response11.variables.data
|
|
|
+ repostCurd('sql', getneibuObj(end,info)).then(response12 => {
|
|
|
+ that.neibuObj = response12.variables.data
|
|
|
+ repostCurd('sql', getyingjiObj(end,info)).then(response13 => {
|
|
|
+ that.yingjiObj = response13.variables.data
|
|
|
+ repostCurd('sql', getfengxianObj(end,info)).then(response14 => {
|
|
|
+ that.fengxianObj = response14.variables.data
|
|
|
+ repostCurd('sql', getneishenObj(end,info)).then(response15 => {
|
|
|
+ that.neishenObj = response15.variables.data
|
|
|
+ repostCurd('sql', getguanshenObj(end,info)).then(response16 => {
|
|
|
+ that.guanshenObj = response16.variables.data
|
|
|
+ repostCurd('sql', getbufuheObj(end,info)).then(response17 => {
|
|
|
+ that.bufuheObj = response17.variables.data
|
|
|
+ repostCurd('sql', getgaijinxiangObj(end,info)).then(response18 => {
|
|
|
+ that.gaijinxiangObj = response18.variables.data
|
|
|
+
|
|
|
+ that.relOf = true
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+ })
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // that.relOf = true
|
|
|
+ },
|
|
|
+
|
|
|
+ async costPlannedAmountChange(record,value) {
|
|
|
+ // console.log(record,value,'34322222222222222222222222222222222222222222224')
|
|
|
+ },
|
|
|
+ /* 查询全部*/
|
|
|
+ selectAll() {
|
|
|
+ /* 上次查询时间不等于当次查询时间， 开始时间不能等于结束时间， 则开始查询。*/
|
|
|
+ // if (this.selectEnd != this.endDate) {
|
|
|
+ // this.getConfigData(this.endDate,this.idsStr)
|
|
|
+ this.getqualityData()
|
|
|
+
|
|
|
+ this.relOf = true;
|
|
|
+ this.timer = setTimeout(() => {
|
|
|
+ this.relOf = false
|
|
|
+ clearTimeout(this.timer)
|
|
|
+ }, 0)
|
|
|
+
|
|
|
+ // }
|
|
|
+ },
|
|
|
+ checkYear(year, data) {
|
|
|
+ this.selectAll()
|
|
|
+ },
|
|
|
+ /* 获取当前年份*/
|
|
|
+ getDate(year) {
|
|
|
+ year = year || 0
|
|
|
+ let nowDate = new Date();
|
|
|
+ let date = new Date(new Date().setDate(1)+ 30 * 24 * 60 * 60 * 1000);
|
|
|
+ let month = date.getMonth()+1;
|
|
|
+ let m1 = nowDate.getMonth()+1
|
|
|
+ let month1 = m1 < 10 ? "0" +m1:nowDate.getMonth()+1;
|
|
|
+ month = month<10 ? "0"+month : ""+month;
|
|
|
+ // console.log([nowDate.getFullYear() - year + "-" + month1,date.getFullYear() + "-" + month])
|
|
|
+ return [nowDate.getFullYear() - year + "-" + month1,date.getFullYear() + "-" + month];
|
|
|
+ },
|
|
|
+ // allView(){
|
|
|
+ // screenfull.request() //默认显示全屏
|
|
|
+ // },
|
|
|
+ goBack(){
|
|
|
+ this.$router.back(-1)
|
|
|
+ clearInterval(this.timer1);
|
|
|
+ },
|
|
|
+ rollcontinue(){
|
|
|
+ this.timer1 = setInterval(()=>{
|
|
|
+ if(this.pageOT>=2){
|
|
|
+ this.pageOT=1
|
|
|
+ }else{
|
|
|
+ this.pageOT = this.pageOT + 1
|
|
|
+ }
|
|
|
+ },8000)
|
|
|
+ this.rollup=true
|
|
|
+ },
|
|
|
+ rollstop(){
|
|
|
+ clearInterval(this.timer1);
|
|
|
+ console.log('dfhjsdifjsojfjiofjoijdiffffjidffffff')
|
|
|
+ this.rollup=false
|
|
|
+ },
|
|
|
}
|
|
|
+ }
|
|
|
</script>
|
|
|
-<style scoped lang="scss">/*大屏*/
|
|
|
-#container{height: 99%;background: #15181d;overflow: hidden;position: relative;padding: 0 2%;color: #ffffff;}
|
|
|
-.page_top{height: 13%;display: flex; flex-wrap: nowrap;justify-content: space-between;align-items:center;}
|
|
|
-.top_left{display: flex;justify-content:flex-start;align-items: center;}
|
|
|
-.top_time{float: right;display: flex;}
|
|
|
-.logo{display: flex;}
|
|
|
-.wms_name{display: flex;position: relative;font-size: 36px;color: #777985;margin-left: 5px;margin-right: 45px;}
|
|
|
-.wms_name em{position: absolute;display: block;background: #3c7cc6; right:-30px;top:10px;width: 27px;height: 15px;line-height: 15px;font-size: 12px;color: #FFFFFF;text-align: center;}
|
|
|
-.depot{display: flex;width:76px;height: 22px;background: #7a7a78;position: relative;justify-content:center;}
|
|
|
-.depot input{display: block;text-align: center; width: 100%;height: 22px;background: transparent;cursor: pointer;color: #5a9d67;font-weight: 900;box-sizing: border-box;line-height: 22px;}
|
|
|
-.depot input::-webkit-input-placeholder {color:#5a9d67;}
|
|
|
-.depot input:-moz-placeholder {color:#5a9d67;}
|
|
|
-.depot input::-moz-placeholder {color:#5a9d67;}
|
|
|
-.depot input:-ms-input-placeholder {color:#5a9d67;}
|
|
|
-.depo_down{position: absolute;width: 100%;left: 0;top: 22px;color: #FFFFFF;text-align: center;display: none;}
|
|
|
-.depo_down li{cursor: pointer;background: #7a7a78;transition: all .3s ease-in;}
|
|
|
-.depo_down li:hover{background: #6b6a6d;}
|
|
|
-.depo_down li+li{border-top: 1px dashed #b0b0b0;line-height: 26px;}
|
|
|
-.top_time{display: flex;justify-content:flex-end;height: 100%;align-items: center;}
|
|
|
-.top_time input{width: 140px;height: 22px;line-height: 22px;text-align: center;background: #2d313c;color: #FFFFFF;font-size: 14px;cursor: pointer;}
|
|
|
-.top_time span{margin: 0 5px;font-size: 12px;}
|
|
|
-.top_time .layui-laydate .layui-this{background-color:#7a7a78 !important;}
|
|
|
-/*top*/
|
|
|
-.order_list{height: 12.5%;display: flex;justify-content: space-between;align-items:center;}
|
|
|
-.order{height: 100%;background: #1b1e25;display: flex; flex-direction:column;padding-top: 5px; justify-content: center;align-items: flex-start;width:19.2%;padding-left: 1.2%;box-sizing: border-box;}
|
|
|
-.order_name{font-size: 14px;color: #989399;line-height: 26px;}
|
|
|
-.order_num{font-family: "黑体"; height: 100%;display: flex;justify-content:flex-start;align-items:center ;font-size: 32px;font-weight: 900;}
|
|
|
-.maina{height: 568px;background: #0c111d;margin-top: 1%;display: flex;justify-content:space-between;align-items:center;}
|
|
|
-.main_left{display: flex; width:48%;height: 100%;flex-direction: column;justify-content:center;align-items:center;}
|
|
|
-.main_midd{display: flex; width:35%;height: 100%;flex-direction: column;justify-content:space-between;align-items:flex-start;}
|
|
|
-.home_today{width: 100%;height: 49%;display: flex;background: #1b1e25;flex-direction: column;justify-content:flex-start;align-items:flex-start; margin-bottom: 2%;padding-top: 2%;box-sizing: border-box;}
|
|
|
-.home_tit{flex-grow:0;flex-shrink:0;display: flex;font-size: 14px;color: #797c85;padding-left: 3%;box-sizing: border-box;}
|
|
|
-.home_list{flex-grow:0;flex-shrink:0;padding-left: 2%;box-sizing: border-box;margin-top: 10px; display: flex;flex-direction: row ;width: 100%; justify-content: space-between;align-items:flex-start;}
|
|
|
-.home_order{width: 25%; display: flex;flex-direction: column;justify-content:flex-start;align-items:flex-start;}
|
|
|
-.home_name{font-size: 12px;color: #aca9b0;}
|
|
|
-.home_num{font-size: 18px;}
|
|
|
-.new_num{color: #533d86;}
|
|
|
-.jian_num{color: #60ba9e;}
|
|
|
-.zhi_num{color: #476d9e;}
|
|
|
-.chu_num{color: #b1526a;}
|
|
|
-.ship_order{width: 100%;height: 49%;display: flex;background: #1b1e25;}
|
|
|
-#home_today{width: 100%;display: flex;height: 100%;flex-direction: column;justify-content:flex-start;align-items:flex-start;}
|
|
|
-#ship_order{padding-top:10px;box-sizing: border-box;}
|
|
|
-.imple{width: 100%;height: 49%;padding-right: 20px;box-sizing: border-box; display: flex;background: #1b1e25;flex-direction: column;justify-content:flex-start;align-items:flex-start; margin-bottom: 2%;padding-top: 2%;box-sizing: border-box;}
|
|
|
-.order_wait{width: 100%;height: 49%;display: flex;justify-content:space-between;align-items:flex-start; box-sizing: border-box;}
|
|
|
-.commis{display: flex; width:49%;height: 100%;flex-direction: column;justify-content:center;align-items:flex-start;background: #1b1e25;padding:0 10px;box-sizing: border-box;}
|
|
|
-.comm_tit{font-size: 14px;color: #979b9e; padding-left: 17px;box-sizing: border-box;padding-top: 5px; line-height: 28px;}
|
|
|
-.comm_list{display: flex;height: 100%;width: 100%; flex-direction: column;justify-content: center;align-items: center;}
|
|
|
-.comm_cont{border-bottom: 2px solid #1e2225; display: flex;width: 100%;justify-content: space-between;align-items: center;}
|
|
|
-.com_name{display: flex;background: #d4d6d5;color: #2e2e2c;padding: 0 5px;}
|
|
|
-.com_num{display: flex;}
|
|
|
-.abort{display: flex; width:49%;height: 100%;flex-direction: column;padding-bottom: 10px;box-sizing: border-box; justify-content:flex-start;align-items:flex-start;background: #1b1e25;}
|
|
|
-.abot_tit{font-size: 14px;color: #e0e1e3;padding-left: 17px;box-sizing: border-box;padding-top: 5px;line-height: 28px;}
|
|
|
-.abort_box{display: flex;width: 100%;height: 100%;overflow: hidden;flex-direction: column;justify-content:flex-start;align-items:flex-start;}
|
|
|
-.abort_list{font-size: 14px;color: #e0e1e3;padding:0 10px;box-sizing: border-box; display: flex;width: 100%;height: 100%;overflow-y: scroll;flex-direction: column;justify-content:flex-start;align-items:flex-start;}
|
|
|
-.abort_cont{line-height:30px; display: flex;width: 100%;justify-content: space-between;align-items: center;}
|
|
|
-.abort_name{display: flex;width: 50%;justify-content:flex-start;align-items: center;}
|
|
|
-.abort_num{display: flex;width: 50%;justify-content:flex-start;align-items: center;}
|
|
|
-.abort_use{width: 100%;height: auto;}
|
|
|
-/*截止时间出库率*/
|
|
|
-.main_rig{display: flex;background: #1b1e25; width:15%;height: 100%;flex-direction: column;justify-content:flex-start;align-items:flex-start;padding: 10px;box-sizing: border-box;}
|
|
|
-.situ_tit{display: flex; font-size: 14px;color: #979b9e;line-height: 20px;padding-top: 5px;}
|
|
|
-.situ_use {display: flex;width: 100%;height: 100%;overflow: hidden;flex-direction: column;justify-content: flex-start;align-items: flex-start;}
|
|
|
-.situ_list{font-size: 14px;color: #e0e1e3;padding:0 10px;box-sizing: border-box; display: flex;width: 100%;height: 100%;overflow-y: scroll;flex-direction: column;justify-content:flex-start;align-items:flex-start;}
|
|
|
-.situ_use{width: 100%;height: 100%;}
|
|
|
-.situ_top span{vertical-align: middle;}
|
|
|
-.situ_name{display: inline-block;height: 20px;line-height: 20px;background: #d1d2d4;padding: 0 10px;color: #454b4b;}
|
|
|
-.situ_use ul{height: auto;width: 100%;}
|
|
|
-.situ_time{margin-left: 2px;}
|
|
|
-.situ_use li{margin-top: 10px;}
|
|
|
-.lssl{display: flex;justify-content: space-between;align-items: center;width: 100%;margin-top: 5px;}
|
|
|
-.lsl_name{display: flex;color: #898e94;}
|
|
|
-.lsl_num{display: flex;color: #dfe0e5;}
|
|
|
-.lal_all{width: 100%;height: 5px;background: #704fba;}
|
|
|
-.quan{display: flex;justify-content: space-between;align-items: center;width: 100%;margin-top: 5px;}
|
|
|
-.quan_name{display: flex;color: #898e94;}
|
|
|
-.quan_num{display: flex;color: #dfe0e5;}
|
|
|
-.quan_all{width: 100%;height: 5px;background: #1f2326;margin-top: 2px;position: relative;}
|
|
|
-.tity{width: 20%;height: 5px;position: absolute;left: 0;top: 0;background: #4983d4;}
|
|
|
-/*大屏*/
|
|
|
-
|
|
|
- h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td, img{border:medium none;margin: 0;padding: 0;font-size: 100%;}
|
|
|
-button, input, select, textarea{font-size: 14px;line-height: 1.5;font-family: Arial, 'Microsoft Yahei';}
|
|
|
-h1, h2, h3, h4, h5, h6{font-weight: normal;}
|
|
|
-em{font-style:normal;}
|
|
|
-ul, ol{list-style: none;}
|
|
|
-input[type="text"],
|
|
|
-input[type="password"],
|
|
|
-button{background: none;border: none;outline: none;-webkit-appearance: none;}
|
|
|
-textarea{resize: none;}
|
|
|
-a{text-decoration: none;color:#333;}
|
|
|
-a:hover{text-decoration: none;
|
|
|
- color:#008ccb;
|
|
|
- -moz-transition: all 0.3s ease-in;
|
|
|
- -webkit-transition: all 0.3s ease-in;
|
|
|
- -o-transition: all 0.3s ease-in;
|
|
|
- transition: all 0.3s ease-in;
|
|
|
-}
|
|
|
-img{border:0px; outline-width:0px; vertical-align:top;}
|
|
|
-.clearfix { *zoom: 1; }
|
|
|
-.clearfix:before, .clearfix:after { display: table; line-height: 0; content: ""; }
|
|
|
-.clearfix:after { clear: both; }
|
|
|
-.fl { float:left;}
|
|
|
-.fr { float:right;}
|
|
|
-.hide { display:none !important;}
|
|
|
-.show { display:block !important;}
|
|
|
-
|
|
|
-
|
|
|
-/* Loader container */
|
|
|
-.shcl {
|
|
|
- position: relative;
|
|
|
- width: 100px;
|
|
|
- height: 100px;
|
|
|
- margin: 0 auto;
|
|
|
-}
|
|
|
-
|
|
|
-
|
|
|
-/* Progress status */
|
|
|
-.shcl > span {
|
|
|
- font-family: Verdana, Tahoma, Arial, sans-serif;
|
|
|
- font-size: 14px;
|
|
|
- color: black;
|
|
|
-}
|
|
|
+<style lang="scss">
|
|
|
+ .statistics {
|
|
|
+ color: #fff;
|
|
|
+ .editDate{
|
|
|
+ display: contents;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color:rgb(249, 255, 255);
|
|
|
+ position: relative;
|
|
|
|
|
|
-/* Loader dots */
|
|
|
-.shcl > div {
|
|
|
+ }
|
|
|
+ .block{
|
|
|
+ float: left;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ #dv-full-screen-container {
|
|
|
+ // background-image: url('./img/stars.png');
|
|
|
+ // background-color: grey;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ box-shadow: 0 0 3px blue;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ // background-color: #f9ffff;
|
|
|
+ display: flex;
|
|
|
+ flex-direction:column;
|
|
|
+ align-items: stretch;
|
|
|
+
|
|
|
+ // .headerContent{
|
|
|
+ // flex: 1;
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+ // }
|
|
|
+ }
|
|
|
+ .el-scrollbar__wrap{
|
|
|
+ overflow-x: hidden;
|
|
|
+ background-color: grey;
|
|
|
+ }
|
|
|
+ .goBackButton{
|
|
|
+ width: 2%;
|
|
|
position: absolute;
|
|
|
- visibility: hidden;
|
|
|
- width: 10px;
|
|
|
- height: 10px;
|
|
|
- background: transparent;
|
|
|
- box-shadow: 0 0 10px black;
|
|
|
-
|
|
|
- -webkit-border-radius: 5px;
|
|
|
- -webkit-animation-name: shcl_bounce;
|
|
|
- -webkit-animation-duration: 1s;
|
|
|
- -webkit-animation-iteration-count: infinite;
|
|
|
- -webkit-animation-direction: linear;
|
|
|
-
|
|
|
- -moz-border-radius: 5px;
|
|
|
- -moz-animation-name: shcl_bounce;
|
|
|
- -moz-animation-duration: 1s;
|
|
|
- -moz-animation-iteration-count: infinite;
|
|
|
- -moz-animation-direction: linear;
|
|
|
-
|
|
|
- -o-border-radius: 5px;
|
|
|
- -o-animation-name: shcl_bounce;
|
|
|
- -o-animation-duration: 1s;
|
|
|
- -o-animation-iteration-count: infinite;
|
|
|
- -o-animation-direction: linear;
|
|
|
-
|
|
|
- -ms-border-radius: 5px;
|
|
|
- -ms-animation-name: shcl_bounce;
|
|
|
- -ms-animation-duration: 1s;
|
|
|
- -ms-animation-iteration-count: infinite;
|
|
|
- -ms-animation-direction: linear;
|
|
|
-
|
|
|
- border-radius: 5px;
|
|
|
- animation-name: shcl_bounce;
|
|
|
- animation-duration: 1s;
|
|
|
- animation-iteration-count: infinite;
|
|
|
- animation-direction: linear;
|
|
|
-}
|
|
|
-
|
|
|
-/* Animation keyframes */
|
|
|
-
|
|
|
-@-webkit-keyframes shcl_bounce {
|
|
|
- 0% {-webkit-transform: scale(1);}
|
|
|
- 80% {-webkit-transform: scale(.3);}
|
|
|
- 100% {-webkit-transform: scale(1);}
|
|
|
-}
|
|
|
-
|
|
|
-@-moz-keyframes shcl_bounce {
|
|
|
- 0% {-moz-transform: scale(1);}
|
|
|
- 80% {-moz-transform: scale(.3);}
|
|
|
- 100% {-moz-transform: scale(1);}
|
|
|
-}
|
|
|
-
|
|
|
-@-o-keyframes shcl_bounce {
|
|
|
- 0% {-o-transform: scale(1);}
|
|
|
- 80% {-o-transform: scale(.3);}
|
|
|
- 100% {-o-transform: scale(1);}
|
|
|
-}
|
|
|
-
|
|
|
-@-ms-keyframes shcl_bounce {
|
|
|
- 0% {-ms-transform: scale(1);}
|
|
|
- 80% {-ms-transform: scale(.3);}
|
|
|
- 100% {-ms-transform: scale(1);}
|
|
|
-}
|
|
|
-
|
|
|
-@keyframes shcl_bounce {
|
|
|
- 0% {transform: scale(1);}
|
|
|
- 80% {transform: scale(.3);}
|
|
|
- 100% {transform: scale(1);}
|
|
|
-}
|
|
|
-
|
|
|
-#loader{
|
|
|
- width: 80px;
|
|
|
- height: 80px;
|
|
|
- position: absolute;
|
|
|
- top: 50%;
|
|
|
- left: 50%;
|
|
|
- margin: -40px 0 0 -40px;
|
|
|
- z-index: 1000;
|
|
|
+ right: 0;
|
|
|
+ }
|
|
|
+ #dv-border-box-8{
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .stitle{
|
|
|
+ text-align: center;
|
|
|
+ font-size: 150%;
|
|
|
+ // font-family: PingFangSC-Semibold, sans-serif;
|
|
|
+ font-weight: 600;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+ .ttitle{
|
|
|
+ font-size: 120%;
|
|
|
+ font-weight: 600;
|
|
|
+ margin: 1% 0;
|
|
|
+ }
|
|
|
+ .screen{
|
|
|
+ height: 100%;
|
|
|
+
|
|
|
+ margin: 0 0.5%;
|
|
|
+ }
|
|
|
+ .clear{ clear: both; }
|
|
|
+ .congxiebox7{
|
|
|
+ background-color: rgba(6, 30, 93, 0.5);
|
|
|
+ box-shadow: rgb(128 128 128 / 30%) 0px 0px 40px inset;
|
|
|
+ border: 1px solid rgba(128, 128, 128, 0.3);
|
|
|
+ margin: 1% 0 0 0 ;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ .gongshiAll{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ // width: 20%;
|
|
|
+ .touwidth{
|
|
|
+ width: 30%;
|
|
|
+ text-align:right;
|
|
|
+ }
|
|
|
+ .gongshiXian{
|
|
|
+ border-bottom: #fff solid 2px;
|
|
|
+ padding-bottom: 6%;
|
|
|
+ text-align:center;
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .mubiaozhi{
|
|
|
+ text-align: center;
|
|
|
+ margin-top: 3%;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<style lang="scss">
|
|
|
+.el-year-table .today .cell {
|
|
|
+ color: #606266 !important;
|
|
|
+ font-weight: 100 !important;
|
|
|
}
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
+
|
|
|
</style>
|
cyy