首页修改

src/views/agreement/agreementTask/index.vue

@@ -302,7 +302,7 @@
         </el-table-column>
         <el-table-column label="录入时间" align="center">
           <el-input
-            v-model="agreementitemsList.createTime"
+            v-model="createTime"
             placeholder="默认录入时间"
             :disabled="true"
             clearable
@@ -367,6 +367,7 @@ export default {
       loading: true,
       loading_s: false,
       goodsOptions:[],
+      createTime:'',
       // 选中数组
       ids: [],
       // 客户(客户数据)
@@ -564,11 +565,13 @@ export default {
       this.open = true
       this.title = '添加仓储费'
       queryUserVal().then((response) => {
-        console.log(response.user.userName)
+        console.log(response)
         this.$set(this.form, "fDeptid", response.dept.deptId);
         this.$set(this.agreementitemsList, "createBy", response.user.userName);
         //格式化时间戳
-        this.$set(this.agreementitemsList, "createTime", moment(Date.parse(new Date())).format("YYYY-MM-DD HH:mm:ss"));
+        this.agreementitemsList.createTime = Date.parse(new Date())
+        this.createTime = moment(Date.parse(new Date())).format("YYYY-MM-DD HH:mm:ss")
+        // this.$set(this.agreementitemsList, "createTime", moment(Date.parse(new Date())).format("YYYY-MM-DD HH:mm:ss"));
       });
     },
     /** 修改按钮操作 */
@@ -576,12 +579,12 @@ export default {
       this.reset()
       const fId = row.fId || this.ids
       getAgreement(fId).then(response => {
+        console.log(response)
         this.form = response.data.tWarehouseAgreement
         this.fMblnoOptions = response.data.corps
         // this.goodsOptions  = response.data.corps
         this.agreementitemsList = response.data.tWarehouseAgreementitems
         console.log(this.form)
-        console.log(response)
         this.open = true
         this.title = '修改仓储费'
       })
@@ -604,14 +607,13 @@ export default {
         if (valid) {
           if (this.form.fId != null) {
             updateAgreement(this.form).then(response => {
-              console.log(response)
               let formData = new window.FormData();
               // 附件数据
               formData.append("agreement",JSON.stringify(this.form))
               formData.append("agreementitems", JSON.stringify(this.agreementitemsList));
               addAgreement(formData).then(response => {
                 this.msgSuccess('修改成功')
-                console.log(response)
+                console.log(this.form)
                 this.open = false
                 this.getList()
                 this.agreementitemsList = []

src/views/index.vue

@@ -68,16 +68,22 @@
       </div>
     </div>
     <div style="width: 100%;margin-bottom: 50px">
-      <el-table :data="tableData" style="width: 65%;float: left;">
+      <el-table :data="tableData" :header-cell-style="{borderBottom:'1px dashed #dfe6ec'}" :cell-style="cellStyle" style="width: 65%;float: left;">
         <el-table-column prop="name" label="待办事宜" width="360"></el-table-column>
         <el-table-column prop="date" label="时间" width="300"></el-table-column>
         <el-table-column prop="address" label="操作"></el-table-column>
       </el-table>
-      <el-table :data="tableData" style="width: 30%;float: left;margin-left: 20px;margin-right: 20px;">
+      <el-table :data="tableData" :header-cell-style="{borderBottom:'1px dashed #dfe6ec'}" :cell-style="cellStyle" style="width: 30%;float: left;margin-left: 20px;margin-right: 20px;">
         <el-table-column prop="name" label="消息中心" width="220"/>
         <el-table-column prop="address" label="操作"/>
       </el-table>
     </div>
+    <div style="width: 100%;float: left;margin-top:20px;">
+      <div style="display: flex;">
+        <div id="box_s" style="width:100%;height:350px;"></div>
+        <div id="box_ss" style="width:100%;height:350px;"></div>
+      </div>
+    </div>
   </div>
 </template>
 
@@ -106,11 +112,17 @@ export default {
   },
   mounted() {
     this.drawLine();
+    this.drawLine_s();
+    this.drawLine_ss();
   },
   created(){
     this.getList();
   },
   methods: {
+    //设置单元格边框
+    cellStyle({row, column, rowIndex, columnIndex}) {
+      return 'border-bottom: 1px dashed rgb(223, 230, 236)'
+    },
     //查询消息中心
     getList() {
       this.loading = true;
@@ -230,6 +242,122 @@ export default {
           }
         ]
       });
+    },
+    drawLine_s() {
+      // 基于准备好的dom，初始化echarts实例，所以只能在mounted中调用
+      let myChart = this.$echarts.init(document.getElementById('box_s'))
+      // 绘制图表
+      myChart.setOption({
+        backgroundColor: '#fff',
+
+        title: {
+          text: '某某统计',
+          left: 'center',
+          top: 20,
+          textStyle: {
+            color: '#333333'
+          }
+        },
+
+        tooltip: {
+          trigger: 'item',
+          formatter: '{a} <br/>{b} : {c} ({d}%)'
+        },
+
+        visualMap: {
+          show: false,
+          min: 80,
+          max: 600,
+          inRange: {
+            colorLightness: [0, 1]
+          }
+        },
+        series: [
+          {
+            name: '虚构数据',
+            type: 'pie',
+            radius: '80%',
+            center: ['50%', '60%'],
+            data: [
+              {value: 335, name: '某某库存1'},
+              {value: 310, name: '某某库存2'},
+              {value: 274, name: '某某库存3'},
+              {value: 235, name: '某某库存4'},
+              {value: 400, name: '某某库存5'}
+            ].sort(function (a, b) { return a.value - b.value; }),
+            roseType: 'radius',
+            label: {
+              // color: 'rgba(0, 0, 0, 1)'
+            },
+            labelLine: {
+              lineStyle: {
+                // color: 'rgba(51, 51, 51, 1)'
+              },
+              smooth: 0.2,
+              length: 10,
+              length2: 20
+            },
+            itemStyle: {
+              // color: '#000',
+              // shadowBlur: 200,
+              shadowColor: 'rgba(0, 0, 0, 0.5)'
+            },
+
+            animationType: 'scale',
+            animationEasing: 'elasticOut',
+            animationDelay: function (idx) {
+              return Math.random() * 200;
+            }
+          }
+        ]
+      });
+    },
+    drawLine_ss() {
+      // 基于准备好的dom，初始化echarts实例，所以只能在mounted中调用
+      let myChart = this.$echarts.init(document.getElementById('box_ss'))
+      // 绘制图表
+      myChart.setOption({
+        title: {
+          text: '某某库存统计',
+          subtext: '虚构数据',
+          left: 'center'
+        },
+        color: ['#3398DB'],
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {            // 坐标轴指示器，坐标轴触发有效
+            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
+          }
+        },
+        grid: {
+          left: '3%',
+          right: '4%',
+          bottom: '3%',
+          containLabel: true
+        },
+        xAxis: [
+          {
+            type: 'category',
+            data: ['1号仓库', '2号仓库', '3号仓库', '4号仓库', '5号仓库', '6号仓库', '7号仓库'],
+            axisTick: {
+              alignWithLabel: true
+            }
+          }
+        ],
+        yAxis: [
+          {
+            type: 'value'
+          }
+        ],
+        series: [
+          {
+            name: '实时状态',
+            type: 'bar',
+            barWidth: '60%',
+            data: [10, 52, 200, 334, 390, 330, 220]
+          }
+        ]
+      });
     }
   },
 };