|
@@ -1,72 +1,48 @@
|
|
|
<template>
|
|
|
<div class="status-panel">
|
|
|
<div class="pause" v-if="data.breakOff">中断</div>
|
|
|
- <ComPanel class="status-com-panel" :title="data.title">
|
|
|
- <!-- <div class="p-body">
|
|
|
+ <ComPanel class="status-com-panel" :title="data.title">
|
|
|
+ <div class="p-body">
|
|
|
<div class="category-box">
|
|
|
<div class="score">
|
|
|
<span>{{ data.category.score }}</span>
|
|
|
</div>
|
|
|
<div class="box">
|
|
|
- <div class="category-item" v-for="(item, index) of data.category.datas" :key="index">
|
|
|
+ <div
|
|
|
+ class="category-item"
|
|
|
+ v-for="(item, index) of data.category.datas"
|
|
|
+ :key="index"
|
|
|
+ >
|
|
|
<div>{{ item.text }}</div>
|
|
|
<div :class="item.color">{{ item.num }}</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="item-box">
|
|
|
- <div class="data-item" v-for="(item, index) of data.items" :key="index" :class="{ light: item.is_light }">
|
|
|
+ <div
|
|
|
+ class="data-item"
|
|
|
+ v-for="(item, index) of data.items"
|
|
|
+ :key="index"
|
|
|
+ :class="{ light: item.is_light }"
|
|
|
+ >
|
|
|
<div class="f1">{{ item.f1 }}</div>
|
|
|
<div class="f2">{{ item.f2 }}</div>
|
|
|
- <div class="f3">{{ item.f3 }}</div>
|
|
|
+ <div class="f3">( {{ item.f3 }} )</div>
|
|
|
<div class="f4">{{ item.f4 }}</div>
|
|
|
- <div class="f5">{{ item.f5 }}</div>
|
|
|
+ <div class="f5">( {{ item.f5 }} )</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- </div> -->
|
|
|
|
|
|
-
|
|
|
- <el-table
|
|
|
- :data="tableData"
|
|
|
- style="width: 100%">
|
|
|
- <el-table-column
|
|
|
- prop="date"
|
|
|
- label="日期"
|
|
|
- width="150">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="配送信息">
|
|
|
- <el-table-column
|
|
|
- prop="name"
|
|
|
- label="姓名"
|
|
|
- width="120">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="地址">
|
|
|
- <el-table-column
|
|
|
- prop="province"
|
|
|
- label="省份"
|
|
|
- width="120">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="city"
|
|
|
- label="市区"
|
|
|
- width="120">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="address"
|
|
|
- label="地址"
|
|
|
- width="300">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="zip"
|
|
|
- label="邮编"
|
|
|
- width="120">
|
|
|
+ <!-- <el-table :data="data.items" style="width: 100%">
|
|
|
+ <el-table-column :label="AGC">
|
|
|
+ <el-table-column prop="f1" label="地址" width="200">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="zip" label="邮编111" width="120">
|
|
|
+ </el-table-column>
|
|
|
</el-table-column>
|
|
|
- </el-table-column>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
-
|
|
|
-
|
|
|
- </ComPanel>
|
|
|
+ </el-table> -->
|
|
|
+ </div>
|
|
|
+ </ComPanel>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -114,56 +90,7 @@ export default {
|
|
|
// 数据
|
|
|
data() {
|
|
|
return {
|
|
|
- tableData: [{
|
|
|
- date: '2016-05-03',
|
|
|
- name: '王小虎',
|
|
|
- province: '上海',
|
|
|
- city: '普陀区',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄',
|
|
|
- zip: 200333
|
|
|
- }, {
|
|
|
- date: '2016-05-02',
|
|
|
- name: '王小虎',
|
|
|
- province: '上海',
|
|
|
- city: '普陀区',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄',
|
|
|
- zip: 200333
|
|
|
- }, {
|
|
|
- date: '2016-05-04',
|
|
|
- name: '王小虎',
|
|
|
- province: '上海',
|
|
|
- city: '普陀区',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄',
|
|
|
- zip: 200333
|
|
|
- }, {
|
|
|
- date: '2016-05-01',
|
|
|
- name: '王小虎',
|
|
|
- province: '上海',
|
|
|
- city: '普陀区',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄',
|
|
|
- zip: 200333
|
|
|
- }, {
|
|
|
- date: '2016-05-08',
|
|
|
- name: '王小虎',
|
|
|
- province: '上海',
|
|
|
- city: '普陀区',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄',
|
|
|
- zip: 200333
|
|
|
- }, {
|
|
|
- date: '2016-05-06',
|
|
|
- name: '王小虎',
|
|
|
- province: '上海',
|
|
|
- city: '普陀区',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄',
|
|
|
- zip: 200333
|
|
|
- }, {
|
|
|
- date: '2016-05-07',
|
|
|
- name: '王小虎',
|
|
|
- province: '上海',
|
|
|
- city: '普陀区',
|
|
|
- address: '上海市普陀区金沙江路 1518 弄',
|
|
|
- zip: 200333
|
|
|
- }]
|
|
|
+ tableData: [],
|
|
|
};
|
|
|
},
|
|
|
// 函数
|
|
@@ -199,6 +126,10 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
+/deep/.el-table thead.is-group th.el-table__cell {
|
|
|
+ background-color: rgba(96, 103, 105, 0.2);
|
|
|
+}
|
|
|
+
|
|
|
.status-panel {
|
|
|
position: relative;
|
|
|
height: 22.315vh;
|
|
@@ -308,9 +239,11 @@ export default {
|
|
|
color: @gray;
|
|
|
justify-content: flex-end;
|
|
|
}
|
|
|
- .f1{
|
|
|
- font-size: 1.6vh;
|
|
|
- }
|
|
|
+ .f1 {
|
|
|
+ font-size: 1.6vh;
|
|
|
+ font-weight: 695 !important;
|
|
|
+ color: #a5c3af!important;
|
|
|
+ }
|
|
|
|
|
|
.f3,
|
|
|
.f5 {
|
|
@@ -342,11 +275,12 @@ export default {
|
|
|
flex: 2;
|
|
|
margin-right: 0;
|
|
|
}
|
|
|
- .f3,.f5{
|
|
|
- color: #05bb4c!important;
|
|
|
- font-size: 1.34vh;
|
|
|
- margin-left: 30px!important;
|
|
|
- }
|
|
|
+ .f3,
|
|
|
+ .f5 {
|
|
|
+ color: #05bb4c !important;
|
|
|
+ font-size: 1.34vh;
|
|
|
+ margin-left: 18px !important;
|
|
|
+ }
|
|
|
|
|
|
&.light {
|
|
|
background-color: fade(@darkgray, 50%);
|