From 1be8bee32dcc6e55cb93ff1a9968e480ee6ef4c9 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Thu, 25 Aug 2022 11:30:30 +0800
Subject: [PATCH 01/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(CIM+?=
 =?UTF-8?q?)=EF=BC=9A=E5=AE=8C=E6=88=90=20BIM=20=E5=8D=8F=E5=90=8C?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/projectAdmin/zjsj/cim/index.vue   | 10 ++--
 src/views/projectAdmin/zjsj/cim/leftTop.vue | 55 +++++++++++++++++++--
 2 files changed, 57 insertions(+), 8 deletions(-)

diff --git a/src/views/projectAdmin/zjsj/cim/index.vue b/src/views/projectAdmin/zjsj/cim/index.vue
index cb58eb39..4fa17a12 100644
--- a/src/views/projectAdmin/zjsj/cim/index.vue
+++ b/src/views/projectAdmin/zjsj/cim/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="cim">
-    <!-- <div class="between">
+    <div class="between">
       <div class="top">
         <LeftTop />
       </div>
@@ -16,7 +16,7 @@
       <div class="bottom">
         <RightBottom />
       </div>
-    </div> -->
+    </div>
   </div>
 </template>
 
@@ -37,8 +37,8 @@ export default {
   color: #fff;
   display: flex;
   justify-content: space-between;
-  background: url(../assets/temp/2.png) no-repeat;
-  background-size: 100% 100%;
+  // background: url(../assets/temp/2.png) no-repeat;
+  // background-size: 100% 100%;
   .between {
     width: 20%;
     height: 100%;
@@ -52,7 +52,7 @@ export default {
   .center {
     width: calc(60% - 40px);
     height: 100%;
-    background: skyblue;
+    border: 1px solid skyblue;
   }
 }
 </style>
diff --git a/src/views/projectAdmin/zjsj/cim/leftTop.vue b/src/views/projectAdmin/zjsj/cim/leftTop.vue
index 7ef1bb86..e93d7934 100644
--- a/src/views/projectAdmin/zjsj/cim/leftTop.vue
+++ b/src/views/projectAdmin/zjsj/cim/leftTop.vue
@@ -1,14 +1,63 @@
 <template>
   <Card title="BIM协同">
-    BIM协同
+    <div class="table">
+      <div class="row">
+        <div class="td">规划报批</div>
+        <div class="td">施工图审查</div>
+        <div class="td">竣工验收</div>
+      </div>
+      <div class="row" :class="{ warning: !row[0] }" v-for="(row, i) in list" :key="i">
+        <div class="td">{{ row[0] ? '符合' : '不符合' }}</div>
+        <div class="td">{{ row[1] ? '符合' : '不符合' }}</div>
+        <div class="td">{{ row[2] ? '已验收' : '未验收' }}</div>
+      </div>
+    </div>
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
 export default {
-  components: { Card }
+  components: { Card },
+  data() {
+    const list = new Array(9).fill(0).map((item, index) => new Array(3).fill(0).map(() => (index === 3 ? 0 : 1)))
+    return {
+      list
+    }
+  },
+  methods: {}
 }
 </script>
 
-<style></style>
+<style lang="less" scoped>
+.table {
+  box-sizing: border-box;
+  padding: 20px 10px 0;
+  width: 100%;
+  height: 100%;
+  .row {
+    margin-bottom: 12px;
+    height: 22px;
+    line-height: 22px;
+    font-size: 12px;
+    display: flex;
+    .td {
+      flex: 1;
+      text-align: center;
+    }
+    &:nth-child(1) {
+      font-size: 14px;
+      color: #67d4d9;
+    }
+    &.warning {
+      background: linear-gradient(90deg, #a45133, #a4513338);
+      &::before {
+        content: '';
+        width: 4px;
+        height: 100%;
+        background-color: #e7622a;
+      }
+    }
+  }
+}
+</style>

From dac68308e83e30c65901fee68bf5d14feecbee57 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Thu, 25 Aug 2022 11:35:28 +0800
Subject: [PATCH 02/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(CIM+?=
 =?UTF-8?q?)=EF=BC=9A=E5=AE=8C=E6=88=90=E5=80=BE=E6=96=9C=E6=91=84?=
 =?UTF-8?q?=E5=BD=B1=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../projectAdmin/zjsj/cim/leftBottom.vue      | 21 +++++++++++++++++--
 1 file changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/views/projectAdmin/zjsj/cim/leftBottom.vue b/src/views/projectAdmin/zjsj/cim/leftBottom.vue
index 74ea4220..f89fe298 100644
--- a/src/views/projectAdmin/zjsj/cim/leftBottom.vue
+++ b/src/views/projectAdmin/zjsj/cim/leftBottom.vue
@@ -1,6 +1,8 @@
 <template>
   <Card title="倾斜摄影">
-    倾斜摄影
+    <div class="videos">
+      <div class="video" v-for="i in 6" :key="i"></div>
+    </div>
   </Card>
 </template>
 
@@ -11,4 +13,19 @@ export default {
 }
 </script>
 
-<style></style>
+<style lang="less" scoped>
+.videos {
+  box-sizing: border-box;
+  padding-top: 10px;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  .video {
+    width: 48%;
+    height: 30%;
+    border: 1px solid skyblue;
+  }
+}
+</style>

From 50e23bcf275f5e126af5eda85e6490d23e86e016 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Thu, 25 Aug 2022 14:17:31 +0800
Subject: [PATCH 03/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(CIM+?=
 =?UTF-8?q?)=EF=BC=9A=E5=AE=8C=E6=88=90=E6=A8=A1=E5=9E=8B=E5=86=85?=
 =?UTF-8?q?=E5=AE=A1=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/jChart/bar/JBarChart.vue           | 154 ++++++++++++++++
 .../common/jChart/bar/JProgressChart.vue      | 139 +++++++++++++++
 .../common/jChart/line/JLineChart.vue         | 165 ++++++++++++++++++
 .../common/jChart/pie/JNestedRingChart.vue    | 108 ++++++++++++
 .../common/jChart/pie/JProblemChart.vue       | 123 +++++++++++++
 .../common/jChart/pie/JRingChart.vue          | 114 ++++++++++++
 src/views/projectAdmin/zjsj/cim/rightTop.vue  |  66 ++++++-
 7 files changed, 866 insertions(+), 3 deletions(-)
 create mode 100644 src/views/projectAdmin/common/jChart/bar/JBarChart.vue
 create mode 100644 src/views/projectAdmin/common/jChart/bar/JProgressChart.vue
 create mode 100644 src/views/projectAdmin/common/jChart/line/JLineChart.vue
 create mode 100644 src/views/projectAdmin/common/jChart/pie/JNestedRingChart.vue
 create mode 100644 src/views/projectAdmin/common/jChart/pie/JProblemChart.vue
 create mode 100644 src/views/projectAdmin/common/jChart/pie/JRingChart.vue

diff --git a/src/views/projectAdmin/common/jChart/bar/JBarChart.vue b/src/views/projectAdmin/common/jChart/bar/JBarChart.vue
new file mode 100644
index 00000000..c0ed47b6
--- /dev/null
+++ b/src/views/projectAdmin/common/jChart/bar/JBarChart.vue
@@ -0,0 +1,154 @@
+<template>
+  <div class="j-bar-chart" ref="jBarChart"></div>
+</template>
+
+<script>
+import echarts from 'echarts4'
+export default {
+  props: {
+    title: {
+      type: Object,
+      default: () => ({
+        text: ''
+      })
+    },
+    tooltip: {
+      type: Object,
+      default: () => ({ show: false })
+    },
+    grid: {
+      type: Array,
+      default: () => ['15%', '2%', '2%', '2%']
+    },
+    color: {
+      type: Array,
+      default: () => ['#5EC2D0', '#61D2B9', '#F67F51', '#7851F6']
+    },
+    xData: {
+      required: true,
+      type: Array,
+      default: () => []
+    },
+    yData: {
+      type: Array,
+      default: () => []
+    },
+    series: {
+      type: Array,
+      default: () => []
+    }
+  },
+  mounted() {
+    this.jBarChart = echarts.init(this.$refs.jBarChart)
+    this.createChart()
+  },
+  data() {
+    return { jBarChart: null }
+  },
+  watch:{
+    xData:{
+      handler(newVal,oldVal){
+         if(newVal != oldVal){
+          this.createChart();
+         }
+       },
+       deep:true,
+    },
+    yData:{
+      handler(newVal,oldVal){
+         if(newVal != oldVal){
+          this.createChart();
+         }
+       },
+       deep:true,
+    }
+  },
+  methods: {
+    createChart() {
+      const { title, tooltip, grid, color, xData, yData, series } = this
+      const configSeries = (series => {
+        if (series.length) {
+          return series.map(item => ({ data: item.data, type: 'bar', barWidth: 15 }))
+        } else {
+          return [{ data: yData, type: 'bar', barWidth: 15 }]
+        }
+      })(series)
+
+      const option = {
+        title: {
+          text: title.text,
+          right: 20,
+          textStyle: {
+            fontSize: '14px',
+            color: '#5EC2D0',
+            fontWeight: 'normal'
+          }
+        },
+        tooltip,
+        grid: {
+          top: grid[0],
+          right: grid[1],
+          bottom: grid[2],
+          left: grid[3],
+          containLabel: true
+        },
+        color,
+        xAxis: {
+          type: 'category',
+          data: xData,
+          axisLine: {
+            show: true,
+            lineStyle: {
+              type: [5, 10]
+            }
+          },
+          axisLabel: {
+            show: true,
+            textStyle: {
+              color: '#fff'
+            }
+          },
+          axisTick: {
+            show: false
+          }
+        },
+        yAxis: {
+          type: 'value',
+          splitNumber: 4,
+          splitLine: {
+            show: true,
+            lineStyle: {
+              type: [5, 10],
+              color: '#323D50'
+            }
+          },
+          axisLine: {
+            show: true,
+            lineStyle: {
+              type: [5, 10]
+            }
+          },
+          axisLabel: {
+            show: true,
+            textStyle: {
+              color: '#fff'
+            }
+          },
+          axisTick: {
+            show: false
+          }
+        },
+        series: configSeries
+      }
+      this.jBarChart.setOption(option)
+    }
+  }
+}
+</script>
+
+<style>
+.j-bar-chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/views/projectAdmin/common/jChart/bar/JProgressChart.vue b/src/views/projectAdmin/common/jChart/bar/JProgressChart.vue
new file mode 100644
index 00000000..43e188a1
--- /dev/null
+++ b/src/views/projectAdmin/common/jChart/bar/JProgressChart.vue
@@ -0,0 +1,139 @@
+<template>
+  <div class="j-progress-chart" ref="JProgressChart"></div>
+</template>
+
+<script>
+import echarts from 'echarts4'
+export default {
+  props: {
+    grid: {
+      type: Array,
+      default: () => ['10', '8%', '10', '10']
+    },
+    seriesData: {
+      required: true,
+      type: Array,
+      default: () => []
+    },
+    yData: {
+      required: true,
+      type: Array,
+      default: () => []
+    }
+  },
+  mounted() {
+    this.JProgressChart = echarts.init(this.$refs.JProgressChart)
+    this.createChart()
+  },
+  data() {
+    return { JProgressChart: null }
+  },
+  watch:{
+    seriesData:{
+      handler(newVal,oldVal){
+         if(newVal != oldVal){
+          this.createChart();
+         }
+       },
+       deep:true,
+    }
+  },
+  methods: {
+    createChart() {
+      const { grid, seriesData, yData } = this
+      const max = Math.max(...seriesData)
+      const maxData = seriesData.map(item => max)
+      const option = {
+        grid: {
+          top: grid[0],
+          right: grid[1],
+          bottom: grid[2],
+          left: grid[3],
+          containLabel: true
+        },
+        xAxis: {
+          type: 'value',
+          axisLabel: {
+            formatter: () => ''
+          },
+          splitLine: {
+            show: false
+          },
+          axisLine: {
+            show: false
+          },
+          axisTick: {
+            show: false
+          }
+        },
+        yAxis: {
+          type: 'category',
+          axisLine: {
+            show: false
+          },
+          axisTick: {
+            show: false
+          },
+          data: yData,
+          axisLabel: {
+            textStyle: {
+              fontSize: 12,
+              color: '#fff'
+            }
+          }
+        },
+        series: [
+          {
+            type: 'bar',
+            itemStyle: {
+              color: new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+                { offset: 0, color: '#4A90E2' },
+                { offset: 1, color: '#4ADEE2' }
+              ]),
+              barBorderRadius: 3
+            },
+            label: {
+              show: true,
+              position: 'right',
+              color: 'white',
+              textStyle: {
+                fontSize: 15
+              }
+            },
+            data: seriesData,
+            barWidth: 13
+          },
+          {
+            type: 'bar',
+            itemStyle: {
+              color: 'rgba(255, 255, 255, 0.1)',
+              barBorderRadius: 3
+            },
+            // label: {
+            //   show: true,
+            //   position: 'right',
+            //   color: 'white',
+            //   textStyle: {
+            //     fontSize: 15
+            //   }
+            // },
+            barGap: '-100%',
+            barCategoryGap: '40%',
+            data: maxData,
+            barWidth: 13,
+            animation: false
+          }
+        ]
+      }
+      this.JProgressChart.setOption(option)
+    }
+  }
+}
+</script>
+
+<style>
+.j-progress-chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/views/projectAdmin/common/jChart/line/JLineChart.vue b/src/views/projectAdmin/common/jChart/line/JLineChart.vue
new file mode 100644
index 00000000..4762da1d
--- /dev/null
+++ b/src/views/projectAdmin/common/jChart/line/JLineChart.vue
@@ -0,0 +1,165 @@
+<template>
+  <div class="j-line-chart" ref="JLineChart"></div>
+</template>
+
+<script>
+import echarts from 'echarts4'
+export default {
+  props: {
+    title: {
+      type: Object,
+      default: () => ({ text: '' })
+    },
+    grid: {
+      type: Array,
+      default: () => ['12%', '2%', '6%', '1%']
+    },
+    color: {
+      type: Array,
+      default: () => ['#FAC915', '#ff6c7f', '#6ee4f0', '#F67F51', '#7851F6']
+    },
+    xData: {
+      required: true,
+      type: Array,
+      default: () => []
+    },
+    series: {
+      required: true,
+      type: Array,
+      default: () => [{}]
+    }
+  },
+  mounted() {
+    this.JLineChart = echarts.init(this.$refs.JLineChart)
+    this.createChart()
+  },
+  data() {
+    return { JLineChart: null }
+  },
+  watch: {
+    xData: {
+      handler(newVal, oldVal) {
+        if (newVal != oldVal) {
+          this.createChart()
+        }
+      },
+      deep: true,
+      immediate: true
+    },
+    series: {
+      handler(newVal, oldVal) {
+        if (newVal != oldVal) {
+          this.createChart()
+        }
+      },
+      deep: true,
+      immediate: true
+    }
+  },
+  methods: {
+    createChart() {
+      const { title, grid, color, xData, series } = this
+
+      const fmtSeries = (series => {
+        return series.map(item => ({
+          name: item.name,
+          type: 'line',
+          smooth: true,
+          data: item.data,
+          areaStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              { offset: 0, color: item.areaColor[0] },
+              { offset: 1, color: item.areaColor[1] }
+            ])
+          },
+          showSymbol: item.showSymbol,
+          itemStyle: {
+            emphasis: item.emphasis
+          }
+        }))
+      })(series)
+
+      const option = {
+        title: {
+          text: title.text,
+          right: 20,
+          textStyle: {
+            fontSize: '14px',
+            color: '#5EC2D0',
+            fontWeight: 'normal'
+          }
+        },
+        legend: {
+          left: 20,
+          textStyle: {
+            color: '#fff'
+          }
+        },
+        grid: {
+          top: grid[0],
+          right: grid[1],
+          bottom: grid[2],
+          left: grid[3],
+          containLabel: true
+        },
+        tooltip: {
+          trigger: 'axis'
+        },
+        color,
+        xAxis: {
+          type: 'category',
+          boundaryGap: false,
+          data: xData,
+          axisTick: {
+            show: false
+          },
+          axisLabel: {
+            textStyle: {
+              color: 'rgba(255, 255, 255, .8)'
+            }
+          },
+          axisLine: {
+            lineStyle: {
+              type: [5, 10],
+              color: '#364252'
+            }
+          }
+        },
+        yAxis: {
+          type: 'value',
+          axisTick: {
+            show: false
+          },
+          axisLabel: {
+            textStyle: {
+              color: 'rgba(255, 255, 255, .8)'
+            }
+          },
+          axisLine: {
+            show: true,
+            lineStyle: {
+              type: [5, 10],
+              color: '#787E8A'
+            }
+          },
+          splitLine: {
+            lineStyle: {
+              type: [5, 10],
+              color: '#364252'
+            }
+          }
+        },
+        series: fmtSeries
+      }
+      this.JLineChart.setOption(option)
+    }
+  }
+}
+</script>
+
+<style>
+.j-line-chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/views/projectAdmin/common/jChart/pie/JNestedRingChart.vue b/src/views/projectAdmin/common/jChart/pie/JNestedRingChart.vue
new file mode 100644
index 00000000..103a9656
--- /dev/null
+++ b/src/views/projectAdmin/common/jChart/pie/JNestedRingChart.vue
@@ -0,0 +1,108 @@
+<template>
+  <div class="j-nested-ring-chart" ref="jNestedRingChart"></div>
+</template>
+
+<script>
+import echarts from 'echarts4'
+export default {
+  props: {
+    title: {
+      type: Object,
+      default: () => ({
+        text: '',
+        subTitle: '',
+        x: '48%',
+        y: '36%'
+      })
+    },
+    legend: {
+      type: Object,
+      default: () => ({})
+    },
+    series: {
+      required: true,
+      type: Array,
+      default: () => []
+    }
+  },
+  mounted() {
+    this.jNestedRingChart = echarts.init(this.$refs.jNestedRingChart)
+    this.createChart()
+  },
+  data() {
+    return {
+      jNestedRingChart: null
+    }
+  },
+  methods: {
+    createChart() {
+      const { title, legend, series } = this
+      const setSeries = (series => {
+        return series.map(item => ({
+          type: 'pie',
+          label: false,
+          center: ['50%', '50%'],
+          radius: item.radius || ['65%', '80%'],
+          roseType: item.roseType,
+          color: item.color,
+          data: item.data
+        }))
+      })(series)
+
+      const option = {
+        title: {
+          text: title.text,
+          subtext: title.subTitle,
+          x: title.x || '49%',
+          y: title.y || '40%',
+          show: true,
+          textAlign: 'center',
+          textStyle: {
+            fontSize: 20,
+            fontWeight: 'normal',
+            color: '#fff'
+          },
+          subtextStyle: {
+            fontSize: 16,
+            fontWeight: 'normal',
+            color: '#fff'
+          }
+        },
+        tooltip: {
+          trigger: 'item'
+        },
+        legend: {
+          show: legend.show === false ? false : true,
+          type: 'scroll',
+          orient: 'vertical',
+          right: 50,
+          top: 'center',
+          itemWidth: 10,
+          itemHeight: 10,
+          selectedMode: false,
+          icon: 'circle',
+          textStyle: {
+            color: '#ffffff',
+            fontSize: 14
+          },
+          formatter: legend.formatter
+        },
+        series: setSeries
+      }
+      this.jNestedRingChart.setOption(option)
+    }
+  },
+  watch: {
+    series() {
+      this.createChart()
+    }
+  }
+}
+</script>
+
+<style>
+.j-nested-ring-chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/views/projectAdmin/common/jChart/pie/JProblemChart.vue b/src/views/projectAdmin/common/jChart/pie/JProblemChart.vue
new file mode 100644
index 00000000..0ac1a408
--- /dev/null
+++ b/src/views/projectAdmin/common/jChart/pie/JProblemChart.vue
@@ -0,0 +1,123 @@
+<template>
+  <!-- 质量问题 -->
+  <div class="myChart" ref="myChart" />
+</template>
+
+<script>
+import echarts from "echarts4";
+export default {
+  props: {
+    title: {
+      type: Object,
+      default: () => ({
+        text: "",
+        subTitle: "",
+        x: "48%",
+        y: "36%"
+      })
+    },
+    data: {
+      type: Array,
+      default: () => [{ value: 1, name: "" }]
+    },
+    color: {
+      type: Array,
+      default: () => ["#3cabfd", "#57ec72", "#f294c6", "#f43a8d", "#6ee4f0"]
+    }
+  },
+  data() {
+    return {};
+  },
+  mounted() {
+    this.initMyChart();
+  },
+  methods: {
+    initMyChart() {
+      const myChart = echarts.init(this.$refs.myChart);
+      const option = {
+        title: {
+          x: this.title.x || "29%",
+          y: this.title.y || "43%",
+          show: true,
+          text: this.title.text,
+          subtext: this.title.subTitle,
+          textAlign: "center",
+          textStyle: {
+            fontSize: 20,
+            fontWeight: "normal",
+            color: "#fff"
+          },
+          subtextStyle: {
+            fontSize: 16,
+            fontWeight: "normal",
+            color: "#fff"
+          }
+        },
+        tooltip: {
+          trigger: "item"
+        },
+        legend: {
+          type: "scroll",
+          orient: "vertical",
+          right: 50,
+          top: "center",
+          itemWidth: 10, // 设置宽度
+          itemHeight: 10, // 设置高度
+          selectedMode: true,
+          icon: "circle",
+          textStyle: {
+            color: "#ffffff",
+            fontSize: 14
+          }
+        },
+        color: this.color,
+        series: [
+          {
+            type: "pie",
+            radius: ["30%", "25%"],
+            center: ["30%", "50%"],
+            labelLine: {
+              show: false
+            },
+            // x:'-20%',
+            color: ["#07162b", "#244e92", "#07162b", "#244e92"],
+            data: [{ value: 25 }, { value: 25 }, { value: 25 }, { value: 25 }]
+          },
+          {
+            type: "pie",
+            radius: ["50%", "65%"],
+            center: ["30%", "50%"],
+            avoidLabelOverlap: true,
+            label: {
+              show: false,
+              position: "center"
+            },
+            emphasis: {
+              label: {
+                show: false,
+                fontSize: "20",
+                color: "#fff",
+                fontWeight: "bold"
+              },
+              scaleSize: 12
+            },
+            labelLine: {
+              show: false
+            },
+            data: this.data
+          }
+        ]
+      };
+
+      myChart.setOption(option);
+    }
+  }
+};
+</script>
+
+<style lang="less" scoped>
+.myChart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/views/projectAdmin/common/jChart/pie/JRingChart.vue b/src/views/projectAdmin/common/jChart/pie/JRingChart.vue
new file mode 100644
index 00000000..35432e35
--- /dev/null
+++ b/src/views/projectAdmin/common/jChart/pie/JRingChart.vue
@@ -0,0 +1,114 @@
+<template>
+  <div class="j-ring-chart" ref="jRingChart"></div>
+</template>
+
+<script>
+import echarts from 'echarts4'
+export default {
+  props: {
+    data: {
+      type: Array,
+      default: () => [{ value: 1, name: '' }]
+    },
+    color: {
+      type: Array,
+      default: () => ['#5181F6', '#61D2B9', '#F67F51', '#7851F6']
+    },
+    title: {
+      type: Object,
+      default: () => ({
+        text: '',
+        subTitle: '',
+        x: '48%',
+        y: '36%'
+      })
+    },
+    radius: {
+      type: Array,
+      default: () => ['65%', '80%']
+    }
+  },
+  mounted() {
+    this.createRingChart()
+  },
+  watch:{
+    data:{
+      handler(newVal,oldVal){
+         if(newVal != oldVal){
+          this.createRingChart();
+         }
+       },
+       deep:true,
+       immediate:true,
+    },
+    title:{
+      handler(newVal,oldVal){
+         if(newVal != oldVal){
+          this.createRingChart();
+         }
+       },
+       deep:true,
+       immediate:true,
+    }
+  },
+  methods: {
+    createRingChart() {
+      const jRingChart = echarts.init(this.$refs.jRingChart)
+      const { title } = this
+      const option = {
+        color: this.color,
+        title: {
+          show: true,
+          text: title.text,
+          x: title.x || '48%',
+          y: title.y || '36%',
+          z: 5,
+          textAlign: 'center',
+          textStyle: {
+            color: 'rgba(255, 255, 255, 1)',
+            fontSize: 20
+          },
+          subtext: title.subTitle,
+          subtextStyle: {
+            color: 'rgba(255, 255, 255, 0.8)',
+            fontSize: 13
+          }
+        },
+        grid: {
+          right: 0
+        },
+        legend: {
+          show: false
+        },
+        series: [
+          {
+            name: '',
+            type: 'pie',
+            radius: this.radius,
+            avoidLabelOverlap: false,
+            hoverAnimation: false,
+            label: {
+              show: false,
+              position: 'center'
+            },
+            labelLine: {
+              show: false
+            },
+            data: this.data
+          }
+        ]
+      }
+
+      console.log(option, '草')
+      jRingChart.setOption(option)
+    }
+  }
+}
+</script>
+
+<style>
+.j-ring-chart {
+  width: 100%;
+  height: 100%;
+}
+</style>
diff --git a/src/views/projectAdmin/zjsj/cim/rightTop.vue b/src/views/projectAdmin/zjsj/cim/rightTop.vue
index 81d33233..9ff8e77f 100644
--- a/src/views/projectAdmin/zjsj/cim/rightTop.vue
+++ b/src/views/projectAdmin/zjsj/cim/rightTop.vue
@@ -1,14 +1,74 @@
 <template>
   <Card title="模型内审">
-    模型内审
+    <div class="chart">
+      <JNestedRingChart :title="{ text: '33', subTitle: '问题总数' }" :series="series" :legend="{ show: false }" />
+    </div>
+    <div class="legend">
+      <div class="legend-item">未查看</div>
+      <div class="legend-item">未解决</div>
+      <div class="legend-item">已解决</div>
+    </div>
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
+import JNestedRingChart from '../../common/jChart/pie/JNestedRingChart.vue'
 export default {
-  components: { Card }
+  components: { Card, JNestedRingChart },
+  data() {
+    return {
+      series: [
+        {
+          roseType: 'area',
+          radius: ['58%', '52%'],
+          color: ['#0B1B35', '#4A8C9C'],
+          data: [30, 40, 30, 40]
+        },
+        {
+          radius: ['65%', '82%'],
+          color: ['#E86129', '#FFC303', '#6EE4F0'],
+          data: [
+            { value: 11, name: '未查看' },
+            { value: 11, name: '未解决' },
+            { value: 11, name: '已解决' }
+          ]
+        }
+      ]
+    }
+  }
 }
 </script>
 
-<style></style>
+<style lang="less" scoped>
+.chart {
+  box-sizing: border-box;
+  padding-top: 20px;
+  height: 70%;
+}
+.legend {
+  margin-top: 30px;
+  display: flex;
+  justify-content: space-around;
+  .legend-item {
+    display: flex;
+    align-items: center;
+    &::before {
+      content: '';
+      margin-right: 8px;
+      width: 8px;
+      height: 8px;
+      border-radius: 50%;
+    }
+    &:nth-child(1)::before {
+      background-color: #e86129;
+    }
+    &:nth-child(2)::before {
+      background-color: #ffc303;
+    }
+    &:nth-child(3)::before {
+      background-color: #6ee4f0;
+    }
+  }
+}
+</style>

From 64eb43c1513354c8613f84361e38d8313fbc4908 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Thu, 25 Aug 2022 14:25:33 +0800
Subject: [PATCH 04/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(CIM+?=
 =?UTF-8?q?)=EF=BC=9A=E5=AE=8C=E6=88=90=E6=A8=A1=E5=9E=8B=E5=A4=96?=
 =?UTF-8?q?=E5=AE=A1=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../projectAdmin/zjsj/cim/rightBottom.vue     | 74 ++++++++++++++++++-
 1 file changed, 71 insertions(+), 3 deletions(-)

diff --git a/src/views/projectAdmin/zjsj/cim/rightBottom.vue b/src/views/projectAdmin/zjsj/cim/rightBottom.vue
index 40296e6d..4a48ecd8 100644
--- a/src/views/projectAdmin/zjsj/cim/rightBottom.vue
+++ b/src/views/projectAdmin/zjsj/cim/rightBottom.vue
@@ -1,14 +1,82 @@
 <template>
   <Card title="模型外审">
-    模型外审
+    <div class="chart">
+      <JNestedRingChart :title="{ text: '73', subTitle: '问题总数' }" :series="series" :legend="{ show: false }" />
+    </div>
+    <div class="legend">
+      <div class="legend-item">未查看</div>
+      <div class="legend-item">已查看</div>
+      <div class="legend-item">已解决</div>
+      <div class="legend-item">已回复</div>
+    </div>
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
+import JNestedRingChart from '../../common/jChart/pie/JNestedRingChart.vue'
 export default {
-  components: { Card }
+  components: { Card, JNestedRingChart },
+  data() {
+    return {
+      series: [
+        {
+          roseType: 'area',
+          radius: ['58%', '52%'],
+          color: ['#0B1B35', '#4A8C9C'],
+          data: [30, 40, 30, 40]
+        },
+        {
+          radius: ['65%', '82%'],
+          color: ['#FFFFFF', '#E86129', '#FFC303', '#6EE4F0'],
+          data: [
+            { value: 11, name: '未查看' },
+            { value: 11, name: '已查看' },
+            { value: 11, name: '已解决' },
+            { value: 11, name: '已回复' }
+          ]
+        }
+      ]
+    }
+  }
 }
 </script>
 
-<style></style>
+<style lang="less" scoped>
+.chart {
+  box-sizing: border-box;
+  padding-top: 20px;
+  height: 70%;
+}
+.legend {
+  margin-top: 30px;
+  display: flex;
+  justify-content: space-around;
+  flex-wrap: wrap;
+  .legend-item {
+    width: 45%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    &::before {
+      content: '';
+      margin-right: 8px;
+      width: 8px;
+      height: 8px;
+      border-radius: 50%;
+    }
+    &:nth-child(1)::before {
+      background-color: #ffffff;
+    }
+    &:nth-child(2)::before {
+      background-color: #e86129;
+    }
+    &:nth-child(3)::before {
+      background-color: #ffc303;
+    }
+    &:nth-child(4)::before {
+      background-color: #6ee4f0;
+    }
+  }
+}
+</style>

From 82b573ea7aae8181516453dc353f2cd93c5ba48c Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Thu, 25 Aug 2022 15:03:45 +0800
Subject: [PATCH 05/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(?=
 =?UTF-8?q?=E8=B5=84=E6=BA=90=E7=AE=A1=E7=90=86)=EF=BC=9A=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90=E8=BD=A6=E8=BE=86=E7=AE=A1=E7=90=86=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../assets/images/sourse/bg-car-count.png     | Bin 0 -> 6170 bytes
 src/views/projectAdmin/zjsj/sourse/index.vue  |   8 +--
 .../projectAdmin/zjsj/sourse/leftTop.vue      |  67 +++++++++++++++++-
 3 files changed, 69 insertions(+), 6 deletions(-)
 create mode 100644 src/views/projectAdmin/zjsj/assets/images/sourse/bg-car-count.png

diff --git a/src/views/projectAdmin/zjsj/assets/images/sourse/bg-car-count.png b/src/views/projectAdmin/zjsj/assets/images/sourse/bg-car-count.png
new file mode 100644
index 0000000000000000000000000000000000000000..6181af168305cd41c25fc524489ffed7a6fed242
GIT binary patch
literal 6170
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
H^RWK`$H$1g

literal 0
HcmV?d00001

diff --git a/src/views/projectAdmin/zjsj/sourse/index.vue b/src/views/projectAdmin/zjsj/sourse/index.vue
index 027573bd..250e8699 100644
--- a/src/views/projectAdmin/zjsj/sourse/index.vue
+++ b/src/views/projectAdmin/zjsj/sourse/index.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="sourse">
-    <!-- <div class="left">
+    <div class="left">
       <div class="top">
         <LeftTop />
       </div>
@@ -15,7 +15,7 @@
       <div class="bottom">
         <RightBottom />
       </div>
-    </div> -->
+    </div>
   </div>
 </template>
 
@@ -36,8 +36,8 @@ export default {
   color: #fff;
   display: flex;
   justify-content: space-between;
-  background: url(../assets/temp/3.png) no-repeat;
-  background-size: 100% 100%;
+  // background: url(../assets/temp/3.png) no-repeat;
+  // background-size: 100% 100%;
   .left {
     width: 22%;
     height: 100%;
diff --git a/src/views/projectAdmin/zjsj/sourse/leftTop.vue b/src/views/projectAdmin/zjsj/sourse/leftTop.vue
index b27a1d69..6ed1f872 100644
--- a/src/views/projectAdmin/zjsj/sourse/leftTop.vue
+++ b/src/views/projectAdmin/zjsj/sourse/leftTop.vue
@@ -1,6 +1,23 @@
 <template>
   <Card title="车辆管理">
-    车辆管理
+    <div class="car-count">
+      今日入场<span>234</span>辆
+    </div>
+    <div class="car-count">
+      今日出场<span>126</span>辆
+    </div>
+    <div class="list">
+      <div class="row">
+        <div>抓拍照片</div>
+        <div>车辆信息</div>
+        <div>抓拍时间</div>
+      </div>
+      <div class="row" v-for="i in 3" :key="i">
+        <div><img src="" /></div>
+        <div class="carNum">粤A455632</div>
+        <div class="datetime">2011-02-03 15:30</div>
+      </div>
+    </div>
   </Card>
 </template>
 
@@ -11,4 +28,50 @@ export default {
 }
 </script>
 
-<style></style>
+<style lang="less" scoped>
+.car-count {
+  padding-top: 10px;
+  padding-left: 30px;
+  font-size: 18px;
+  color: #59b2c0;
+  display: flex;
+  align-items: center;
+  span {
+    margin-left: 40px;
+    margin-right: 20px;
+    width: 140px;
+    height: 50px;
+    line-height: 60px;
+    text-align: center;
+    font-size: 28px;
+    font-weight: bold;
+    color: #fff;
+    background: url(../assets/images/sourse/bg-car-count.png) no-repeat;
+    background-size: 100% 100%;
+  }
+}
+.list {
+  box-sizing: border-box;
+  padding-top: 20px;
+  height: calc(100% - 120px);
+  .row {
+    display: flex;
+    align-items: center;
+    &:not(:last-child) {
+      margin-bottom: 12px;
+    }
+    &:first-child {
+      color: #59b2c0;
+    }
+    div {
+      flex: 1;
+      text-align: center;
+      img {
+        width: 80px;
+        height: 50px;
+        background: skyblue;
+      }
+    }
+  }
+}
+</style>

From de98168865b0bbbebe16771f14cc9306d9258325 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Thu, 25 Aug 2022 15:37:47 +0800
Subject: [PATCH 06/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(?=
 =?UTF-8?q?=E8=B5=84=E6=BA=90=E7=AE=A1=E7=90=86)=EF=BC=9A=E6=96=B0?=
 =?UTF-8?q?=E5=A2=9E=20CarTable=20=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../zjsj/sourse/components/CarTable.vue       | 59 +++++++++++++++++++
 .../projectAdmin/zjsj/sourse/leftTop.vue      | 33 +----------
 2 files changed, 62 insertions(+), 30 deletions(-)
 create mode 100644 src/views/projectAdmin/zjsj/sourse/components/CarTable.vue

diff --git a/src/views/projectAdmin/zjsj/sourse/components/CarTable.vue b/src/views/projectAdmin/zjsj/sourse/components/CarTable.vue
new file mode 100644
index 00000000..e345a124
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/sourse/components/CarTable.vue
@@ -0,0 +1,59 @@
+<template>
+  <div class="table">
+    <div class="thead">
+      <div class="row">
+        <div>抓拍照片</div>
+        <div>车辆信息</div>
+        <div>抓拍时间</div>
+      </div>
+    </div>
+    <div class="tbody">
+      <vue-scroll>
+        <div class="row" v-for="i in 9" :key="i">
+          <div><img src="" /></div>
+          <div class="carNum">粤A455632</div>
+          <div class="datetime">2011-02-03 15:30</div>
+        </div>
+      </vue-scroll>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style lang="less" scoped>
+.table {
+  width: 100%;
+  height: 100%;
+  .thead {
+    padding-bottom: 12px;
+    color: #59b2c0;
+  }
+  .tbody {
+    height: calc(100% - 30px);
+  }
+  .row {
+    display: flex;
+    align-items: center;
+    &:not(:last-child) {
+      margin-bottom: 12px;
+    }
+    div {
+      text-align: center;
+      &:last-child {
+        width: 140px;
+      }
+      &:not(:last-child) {
+        flex: 1;
+      }
+      img {
+        width: 80px;
+        height: 50px;
+        background: skyblue;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/projectAdmin/zjsj/sourse/leftTop.vue b/src/views/projectAdmin/zjsj/sourse/leftTop.vue
index 6ed1f872..a0bcea67 100644
--- a/src/views/projectAdmin/zjsj/sourse/leftTop.vue
+++ b/src/views/projectAdmin/zjsj/sourse/leftTop.vue
@@ -7,24 +7,16 @@
       今日出场<span>126</span>辆
     </div>
     <div class="list">
-      <div class="row">
-        <div>抓拍照片</div>
-        <div>车辆信息</div>
-        <div>抓拍时间</div>
-      </div>
-      <div class="row" v-for="i in 3" :key="i">
-        <div><img src="" /></div>
-        <div class="carNum">粤A455632</div>
-        <div class="datetime">2011-02-03 15:30</div>
-      </div>
+      <CarTable />
     </div>
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
+import CarTable from './components/CarTable.vue'
 export default {
-  components: { Card }
+  components: { Card, CarTable }
 }
 </script>
 
@@ -54,24 +46,5 @@ export default {
   box-sizing: border-box;
   padding-top: 20px;
   height: calc(100% - 120px);
-  .row {
-    display: flex;
-    align-items: center;
-    &:not(:last-child) {
-      margin-bottom: 12px;
-    }
-    &:first-child {
-      color: #59b2c0;
-    }
-    div {
-      flex: 1;
-      text-align: center;
-      img {
-        width: 80px;
-        height: 50px;
-        background: skyblue;
-      }
-    }
-  }
 }
 </style>

From 1b41a0ab6fdf43a93b9fedb85a3506ef89056f40 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Thu, 25 Aug 2022 17:17:32 +0800
Subject: [PATCH 07/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(?=
 =?UTF-8?q?=E8=B5=84=E6=BA=90=E7=AE=A1=E7=90=86)=EF=BC=9A=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90=E8=BD=A6=E8=BE=86=E5=86=B2=E6=B4=97=E6=8A=93=E6=8B=8D?=
 =?UTF-8?q?=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/projectAdmin/zjsj/sourse/leftBottom.vue | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/src/views/projectAdmin/zjsj/sourse/leftBottom.vue b/src/views/projectAdmin/zjsj/sourse/leftBottom.vue
index e438dabb..c6804fae 100644
--- a/src/views/projectAdmin/zjsj/sourse/leftBottom.vue
+++ b/src/views/projectAdmin/zjsj/sourse/leftBottom.vue
@@ -1,14 +1,23 @@
 <template>
   <Card title="车辆冲洗抓拍">
-    车辆冲洗抓拍
+    <div class="list">
+      <CarTable />
+    </div>
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
+import CarTable from './components/CarTable.vue'
 export default {
-  components: { Card }
+  components: { Card, CarTable }
 }
 </script>
 
-<style></style>
+<style lang="less" scoped>
+.list {
+  box-sizing: border-box;
+  padding-top: 20px;
+  height: 100%;
+}
+</style>

From 1ed0d2b6ecc9a4e4b8d1dad3a3ef9aa20e0eef73 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Thu, 25 Aug 2022 18:09:49 +0800
Subject: [PATCH 08/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(?=
 =?UTF-8?q?=E6=A3=80=E6=9F=A5=E7=BB=9F=E8=AE=A1)=EF=BC=9A=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../zjsj/sourse/components/CarTable.vue       |  2 +-
 .../zjsj/sourse/components/MaterialTable.vue  | 73 +++++++++++++++++++
 .../projectAdmin/zjsj/sourse/rightBottom.vue  | 20 ++++-
 3 files changed, 91 insertions(+), 4 deletions(-)
 create mode 100644 src/views/projectAdmin/zjsj/sourse/components/MaterialTable.vue

diff --git a/src/views/projectAdmin/zjsj/sourse/components/CarTable.vue b/src/views/projectAdmin/zjsj/sourse/components/CarTable.vue
index e345a124..0aaa89fe 100644
--- a/src/views/projectAdmin/zjsj/sourse/components/CarTable.vue
+++ b/src/views/projectAdmin/zjsj/sourse/components/CarTable.vue
@@ -43,7 +43,7 @@ export default {}
     div {
       text-align: center;
       &:last-child {
-        width: 140px;
+        width: 160px;
       }
       &:not(:last-child) {
         flex: 1;
diff --git a/src/views/projectAdmin/zjsj/sourse/components/MaterialTable.vue b/src/views/projectAdmin/zjsj/sourse/components/MaterialTable.vue
new file mode 100644
index 00000000..d9c3fb5a
--- /dev/null
+++ b/src/views/projectAdmin/zjsj/sourse/components/MaterialTable.vue
@@ -0,0 +1,73 @@
+<template>
+  <div class="material-table">
+    <div class="title">物料进场</div>
+    <div class="table">
+      <div class="thead">
+        <div class="row">
+          <div>物料类型</div>
+          <div>重量(KG)</div>
+          <div>时间</div>
+        </div>
+      </div>
+      <div class="tbody">
+        <vue-scroll>
+          <div class="row" v-for="i in 9" :key="i">
+            <div>水泥</div>
+            <div>35</div>
+            <div>2011-02-03 15:30</div>
+          </div>
+        </vue-scroll>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style lang="less" scoped>
+.material-table {
+  width: 100%;
+  height: 100%;
+  .title {
+    height: 50px;
+    line-height: 40px;
+    font-size: 20px;
+    color: #6de3ef;
+    text-align: center;
+  }
+  .table {
+    width: 100%;
+    height: calc(100% - 50px);
+    .thead {
+      padding-bottom: 12px;
+      color: #59b2c0;
+    }
+    .tbody {
+      height: calc(100% - 30px);
+    }
+    .row {
+      display: flex;
+      align-items: center;
+      &:not(:last-child) {
+        margin-bottom: 12px;
+      }
+      div {
+        text-align: center;
+        &:last-child {
+          width: 160px;
+        }
+        &:not(:last-child) {
+          flex: 1;
+        }
+        img {
+          width: 80px;
+          height: 50px;
+          background: skyblue;
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/projectAdmin/zjsj/sourse/rightBottom.vue b/src/views/projectAdmin/zjsj/sourse/rightBottom.vue
index f6f393d9..52dc8fd0 100644
--- a/src/views/projectAdmin/zjsj/sourse/rightBottom.vue
+++ b/src/views/projectAdmin/zjsj/sourse/rightBottom.vue
@@ -1,14 +1,28 @@
 <template>
   <Card title="检查统计">
-    检查统计
+    <div class="list-group">
+      <div class="list"><MaterialTable title="物料进场" /></div>
+      <div class="list"><MaterialTable title="物料出场" /></div>
+      <div class="list"><MaterialTable title="材料检验" /></div>
+    </div>
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
+import MaterialTable from './components/MaterialTable.vue'
 export default {
-  components: { Card }
+  components: { Card, MaterialTable }
 }
 </script>
 
-<style></style>
+<style lang="less" scoped>
+.list-group {
+  height: 100%;
+  display: flex;
+  justify-content: space-around;
+  .list {
+    width: 28%;
+  }
+}
+</style>

From 07e2f1acfe292982dd10a042383049d0cf9bf963 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Fri, 26 Aug 2022 14:45:11 +0800
Subject: [PATCH 09/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(?=
 =?UTF-8?q?=E8=B5=84=E6=BA=90=E7=AE=A1=E7=90=86)=EF=BC=9A=E9=9A=90?=
 =?UTF-8?q?=E6=82=A3=E8=B6=8B=E5=8A=BF=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../common/jChart/bar/JBarChart.vue           | 40 +++++++++++--------
 .../projectAdmin/zjsj/sourse/rightTop.vue     | 33 ++++++++++++++-
 2 files changed, 55 insertions(+), 18 deletions(-)

diff --git a/src/views/projectAdmin/common/jChart/bar/JBarChart.vue b/src/views/projectAdmin/common/jChart/bar/JBarChart.vue
index c0ed47b6..71c60199 100644
--- a/src/views/projectAdmin/common/jChart/bar/JBarChart.vue
+++ b/src/views/projectAdmin/common/jChart/bar/JBarChart.vue
@@ -45,22 +45,22 @@ export default {
   data() {
     return { jBarChart: null }
   },
-  watch:{
-    xData:{
-      handler(newVal,oldVal){
-         if(newVal != oldVal){
-          this.createChart();
-         }
-       },
-       deep:true,
+  watch: {
+    xData: {
+      handler(newVal, oldVal) {
+        if (newVal != oldVal) {
+          this.createChart()
+        }
+      },
+      deep: true
     },
-    yData:{
-      handler(newVal,oldVal){
-         if(newVal != oldVal){
-          this.createChart();
-         }
-       },
-       deep:true,
+    yData: {
+      handler(newVal, oldVal) {
+        if (newVal != oldVal) {
+          this.createChart()
+        }
+      },
+      deep: true
     }
   },
   methods: {
@@ -68,7 +68,7 @@ export default {
       const { title, tooltip, grid, color, xData, yData, series } = this
       const configSeries = (series => {
         if (series.length) {
-          return series.map(item => ({ data: item.data, type: 'bar', barWidth: 15 }))
+          return series.map(item => ({ name: item.name, type: 'bar', data: item.data, barWidth: 20, itemStyle: item.itemStyle }))
         } else {
           return [{ data: yData, type: 'bar', barWidth: 15 }]
         }
@@ -84,6 +84,14 @@ export default {
             fontWeight: 'normal'
           }
         },
+        legend: {
+          icon: 'circle',
+          top: 15,
+          left: 20,
+          itemWidth: 8,
+          textStyle: { color: '#fff' },
+          data: [{ name: '计划用料' }, { name: '实际用料' }]
+        },
         tooltip,
         grid: {
           top: grid[0],
diff --git a/src/views/projectAdmin/zjsj/sourse/rightTop.vue b/src/views/projectAdmin/zjsj/sourse/rightTop.vue
index 30c1c9b0..c894b927 100644
--- a/src/views/projectAdmin/zjsj/sourse/rightTop.vue
+++ b/src/views/projectAdmin/zjsj/sourse/rightTop.vue
@@ -1,13 +1,42 @@
 <template>
   <Card title="隐患趋势">
-    隐患趋势
+    <JBarChart :tooltip="{}" :xData="xData" :series="series" />
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
+import JBarChart from '../../common/jChart/bar/JBarChart.vue'
+import echarts from 'echarts4'
 export default {
-  components: { Card }
+  components: { Card, JBarChart },
+  data() {
+    return {
+      xData: new Array(12).fill('破产倒闭').map((v, i) => i + 1 + '月'),
+      series: [
+        {
+          name: '计划用料',
+          data: [23, 44, 63, 12, 45, 78, 34, 67, 32, 44, 13, 75],
+          itemStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              { offset: 0, color: '#6de1ee' },
+              { offset: 1, color: '#6de1ee24' }
+            ])
+          }
+        },
+        {
+          name: '实际用料',
+          data: [44, 13, 86, 24, 43, 78, 12, 32, 45, 82, 21, 76],
+          itemStyle: {
+            color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              { offset: 0, color: '#DE5F2A' },
+              { offset: 1, color: '#DE5F2A24' }
+            ])
+          }
+        }
+      ]
+    }
+  }
 }
 </script>
 

From 57c3b9335c80079992ec605dd0739f7de4dfa86d Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Fri, 26 Aug 2022 15:47:17 +0800
Subject: [PATCH 10/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(?=
 =?UTF-8?q?=E8=BF=9B=E5=BA=A6=E7=AE=A1=E7=90=86)=EF=BC=9A=E5=AE=8C?=
 =?UTF-8?q?=E6=88=90=E8=BF=9B=E5=BA=A6=E6=9D=A1=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../projectAdmin/zjsj/progress/index.vue      | 60 ++++++++++++++++++-
 1 file changed, 57 insertions(+), 3 deletions(-)

diff --git a/src/views/projectAdmin/zjsj/progress/index.vue b/src/views/projectAdmin/zjsj/progress/index.vue
index 1f8188f4..1ba20a3b 100644
--- a/src/views/projectAdmin/zjsj/progress/index.vue
+++ b/src/views/projectAdmin/zjsj/progress/index.vue
@@ -6,14 +6,34 @@
         <TopRight />
       </div>
     </div>
-    <div class="bottom"></div>
+    <div class="bottom">
+      <div class="progress-item" :class="{ success: i < 6 }" v-for="(v, i) in progress" :key="i">
+        <div class="date">{{ v.date }}</div>
+        <div class="name">{{ v.name }}</div>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
 import TopRight from './topRight.vue'
 export default {
-  components: { TopRight }
+  components: { TopRight },
+  data() {
+    return {
+      progress: [
+        { name: '基础工程', date: '2022-02-02' },
+        { name: '主体结构施工', date: '2022-02-02' },
+        { name: '屋面工程', date: '2022-02-02' },
+        { name: '机械设备安拆工程', date: '2022-02-02' },
+        { name: '室内装饰装修工程', date: '2022-02-02' },
+        { name: '室内装饰装修工程', date: '2022-02-02' },
+        { name: '室内装饰装修工程', date: '2022-02-02' },
+        { name: '室内装饰装修工程', date: '2022-02-02' },
+        { name: '室内装饰装修工程', date: '2022-02-02' }
+      ]
+    }
+  }
 }
 </script>
 
@@ -39,7 +59,41 @@ export default {
   }
   .bottom {
     height: 26%;
-    border: 1px solid skyblue;
+    color: #fff;
+    display: flex;
+    align-items: center;
+    .progress-item {
+      position: relative;
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      &::before {
+        content: '';
+        width: 8px;
+        height: 8px;
+        background-color: #fff;
+        border: 1px solid #2de1fa;
+        border-radius: 50%;
+      }
+      &:not(:last-child)::after {
+        content: '';
+        position: absolute;
+        left: 50%;
+        bottom: calc(100% - 5px);
+        width: 100%;
+        height: 1px;
+        background-color: #ccc;
+      }
+      &.success::after {
+        background-color: #2de1fa;
+      }
+      .date {
+        margin: 4px 0;
+        font-size: 12px;
+        color: #ddd;
+      }
+    }
   }
 }
 </style>

From a32ac62b67cc8536912e0d35d6620b2fdb04b2e5 Mon Sep 17 00:00:00 2001
From: Jack <1638169491@qq.com>
Date: Fri, 26 Aug 2022 16:15:29 +0800
Subject: [PATCH 11/11] =?UTF-8?q?=E4=B8=AD=E5=BB=BA=E5=9B=9B=E5=B1=80(?=
 =?UTF-8?q?=E8=BF=9B=E5=BA=A6=E7=AE=A1=E7=90=86)=EF=BC=9A=E8=BF=9B?=
 =?UTF-8?q?=E5=85=A5=E4=BB=BB=E5=8A=A1=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../projectAdmin/zjsj/progress/topRight.vue   | 75 ++++++++++++++++++-
 1 file changed, 72 insertions(+), 3 deletions(-)

diff --git a/src/views/projectAdmin/zjsj/progress/topRight.vue b/src/views/projectAdmin/zjsj/progress/topRight.vue
index 0a41b0bc..fbba0f01 100644
--- a/src/views/projectAdmin/zjsj/progress/topRight.vue
+++ b/src/views/projectAdmin/zjsj/progress/topRight.vue
@@ -1,14 +1,83 @@
 <template>
   <Card title="进度任务">
-    进度任务
+    <div class="tabs">
+      <div class="tab checked">待办事项</div>
+      <div class="tab">未来提醒</div>
+    </div>
+    <div class="list">
+      <vue-scroll>
+        <div class="list-item" v-for="(v, i) in todos" :key="i">
+          <div class="todo">{{ v.todo }}</div>
+          <div class="startTime">
+            <span class="grey">计划开始时间：</span><span class="blue">{{ v.startTime }}</span>
+          </div>
+          <div class="endTime">
+            <span class="grey">计划结束时间：</span><span class="blue">{{ v.endTime }}</span>
+          </div>
+          <div class="delay orange">已延期{{ v.delay }}天</div>
+        </div>
+      </vue-scroll>
+    </div>
   </Card>
 </template>
 
 <script>
 import Card from '../components/Card.vue'
 export default {
-  components: { Card }
+  components: { Card },
+  data() {
+    return {
+      todos: [
+        { todo: '大罗勒密河', startTime: '2022-02-01', endTime: '2022-02-01', delay: 2 },
+        { todo: '大罗勒密河', startTime: '2022-02-01', endTime: '2022-02-01', delay: 2 },
+        { todo: '大罗勒密河', startTime: '2022-02-01', endTime: '2022-02-01', delay: 2 },
+        { todo: '大罗勒密河', startTime: '2022-02-01', endTime: '2022-02-01', delay: 2 },
+        { todo: '大罗勒密河', startTime: '2022-02-01', endTime: '2022-02-01', delay: 2 }
+      ]
+    }
+  }
 }
 </script>
 
-<style></style>
+<style lang="less" scoped>
+.tabs {
+  display: flex;
+  color: #fff;
+  .tab {
+    width: 100px;
+    height: 40px;
+    line-height: 40px;
+    text-align: center;
+    cursor: pointer;
+    &.checked {
+      color: #2de1fa;
+    }
+  }
+}
+.list {
+  padding-left: 20px;
+  height: calc(100% - 40px);
+  color: #fff;
+  .list-item {
+    &:not(:last-child) {
+      margin-bottom: 30px;
+    }
+    div {
+      &:not(:first-child) {
+        font-size: 12px;
+        margin-top: 6px;
+      }
+    }
+  }
+}
+
+.grey {
+  color: #ccc;
+}
+.blue {
+  color: #2de1fa;
+}
+.orange {
+  color: #f56c36;
+}
+</style>