1

wesley88
1 parent d44c348c
Showing 3 changed files with 213 additions and 161 deletions
admin-web-master/src/components/fujianUpload/fujianList.vue
admin-web-master/src/views/detect/analyse.vue
admin-web-master/src/views/detect/examine/index.vue
@@ -16,7 +16,7 @@
         </div>
       </div>
       <div v-if="islist" v-for="(file, i) in localValue" :key="'upload-BaseImage' + i" style="display: flex;justify-content: space-between;width: 100%;">
-        <div>文件{{i+1}}</div>
+        <div>{{ file.address }}</div>
         <div title="删除" class="delete-box"
           @click="handleDeleteImg(file, i)">
           <i class="el-icon-close"></i>
 <template>
   <div style="background-color:#f7f7f7;padding:10px 10px;">
-    <div class="zhuti">
+    <div class="zhuti ">
       <div style="height:58px;line-height:58px;">
         <div style="color:#0006"> <span>招商资源监测</span> <span style="padding:0 5px;">></span> <span
             style="color:#000000e6">统计分析</span></div>
@@ -8,8 +8,8 @@
       <div style="width: 100%;margin-bottom:30px;">
         <div style="display:flex;justify-content: space-between">
           <div style="display:flex;">
-            <div style="margin-right: 10px;line-height:35px;">商铺/广告位资源统计</div>
-    <!--        <el-select v-model="formSel.createDate" placeholder="所属区域" style="width: 150px;margin-right: 10px">
+            <!-- <div style="margin-right: 10px;line-height:35px;">商铺/广告位资源统计</div> -->
+            <!--        <el-select v-model="formSel.createDate" placeholder="所属区域" style="width: 150px;margin-right: 10px">
               <el-option label="1" value="1" />
               <el-option label="2" value="2" />
             </el-select>
@@ -17,10 +17,11 @@
               <el-option label="1" value="1" />
               <el-option label="2" value="2" />
             </el-select> -->
-            <el-date-picker v-model="FormTime"  value-format="yyyy-MM-dd" type="daterange" range-separator="-" start-placeholder="开始日期"
-              end-placeholder="结束日期" style="width: 300px;margin-right: 10px;" prefix-icon="none">
+            <el-date-picker v-model="FormTime" value-format="yyyy-MM-dd" type="daterange" range-separator="-"
+              start-placeholder="开始日期" end-placeholder="结束日期" style="width: 300px;margin-right: 10px;"
+              prefix-icon="none">
             </el-date-picker>
-            <el-button @click="onSubmit" style="background-color: #3F9B6A;color: #fff;">检索
+            <el-button @click="onSubmit" style="background-color: #3F9B6A;color: #fff;">查询
             </el-button>
             <el-button @click="resetting" class="buttonHover"
               style="color: #000;border: 1px solid #DBDBDB;background-color: #fff;">重置
@@ -31,45 +32,49 @@
             </el-button>
           </div>
         </div>
-        <div style="display:flex;margin-top:10px;">
-          <div style="width:48%;height: 400px;marigin-right:20px;">
-            <div style="display: flex;justify-content: space-between;">
-              <div style="line-height:35px;">资源数量增长趋势</div>
-              <!-- <div>
-                <el-select v-model="formSel.createDate" placeholder="状态" style="width: 100px;margin-right: 10px">
-                  <el-option label="1" value="1" />
-                  <el-option label="2" value="2" />
-                </el-select>
-                <el-select v-model="formSel.createDate" placeholder="类型" style="width: 100px;margin-right: 10px">
-                  <el-option label="1" value="1" />
-                  <el-option label="2" value="2" />
-                </el-select>
-              </div> -->
-            </div>
-            <div ref="shop1ZX" style="width:100%;height: 400px;"></div>
+
+      </div>
+       <div ref="contentToConvert">
+      <TitleWithCircle title="商铺/广告位资源统计" style="margin: 20px 0;" />
+      <div style="display:flex;">
+        <div style="width:48%;height: 400px;">
+          <div style="display: flex;justify-content: space-between;">
+            <div style="line-height:35px;">资源数量增长趋势</div>
+            <!-- <div>
+              <el-select v-model="formSel.createDate" placeholder="状态" style="width: 100px;margin-right: 10px">
+                <el-option label="1" value="1" />
+                <el-option label="2" value="2" />
+              </el-select>
+              <el-select v-model="formSel.createDate" placeholder="类型" style="width: 100px;margin-right: 10px">
+                <el-option label="1" value="1" />
+                <el-option label="2" value="2" />
+              </el-select>
+            </div> -->
           </div>
-          <div style="width:48%;height: 400px;marigin-right:20px;">
-            <div style="display: flex;justify-content: space-between;">
-              <div style="line-height:35px;">各资源数量统计</div>
-              <!-- <div>
-                <el-select v-model="formSel.createDate" placeholder="状态" style="width: 100px;margin-right: 10px">
-                  <el-option label="1" value="1" />
-                  <el-option label="2" value="2" />
-                </el-select>
-                <el-select v-model="formSel.createDate" placeholder="类型" style="width: 100px;margin-right: 10px">
-                  <el-option label="1" value="1" />
-                  <el-option label="2" value="2" />
-                </el-select>
-              </div> -->
-            </div>
-            <div ref="shop1TJ" style="width:100%;height: 400px;"></div>
+          <div ref="shop1ZX" style="width:100%;height: 400px;"></div>
+        </div>
+        <div style="width:48%;height: 400px;">
+          <div style="display: flex;justify-content: space-between;">
+            <div style="line-height:35px;">各资源数量统计</div>
+            <!-- <div>
+              <el-select v-model="formSel.createDate" placeholder="状态" style="width: 100px;margin-right: 10px">
+                <el-option label="1" value="1" />
+                <el-option label="2" value="2" />
+              </el-select>
+              <el-select v-model="formSel.createDate" placeholder="类型" style="width: 100px;margin-right: 10px">
+                <el-option label="1" value="1" />
+                <el-option label="2" value="2" />
+              </el-select>
+            </div> -->
           </div>
+          <div ref="shop1TJ" style="width:100%;height: 400px;"></div>
         </div>
       </div>
-      <div style="width: 100%;margin-bottom:20px;">
+      <TitleWithCircle title="商铺/广告位意向统计" style="margin: 20px 0;" />
+      <div style="width: 100%;">
         <div style="display:flex;justify-content: space-between">
           <div style="display:flex;">
-            <div style="margin-right: 10px;line-height:35px;">商铺/广告位意向统计</div>
+            <!-- <div style="margin-right: 10px;line-height:35px;">商铺/广告位意向统计</div> -->
             <!-- <el-date-picker v-model="value1" type="datetimerange" range-separator="-" start-placeholder="开始日期"
               end-placeholder="结束日期" style="width: 200px;margin-right: 10px;margin-top:0px;" prefix-icon="none">
             </el-date-picker>
@@ -130,7 +135,7 @@
           </div>
         </div>
         <div style="display:flex;margin-top:10px;">
-          <div style="width:48%;height: 400px;marigin-right:20px;">
+          <div style="width:48%;height: 400px;">
             <div style="display: flex;justify-content: space-between;">
               <div style="line-height:35px;">经营趋势统计</div>
               <div>
@@ -142,7 +147,7 @@
             </div>
             <div ref="shop3ZX" style="width:100%;height: 400px;"></div>
           </div>
-          <div style="width:48%;height: 400px;marigin-right:20px;">
+          <div style="width:48%;height: 400px;">
             <div style="display: flex;justify-content: space-between;">
               <div style="line-height:35px;">营业收入情况</div>
               <div>
@@ -238,7 +243,7 @@
           </div>
         </div>
         <div style="display:flex;margin-top:10px;">
-          <div style="width:48%;height: 400px;marigin-right:20px;">
+          <div style="width:48%;height: 400px;">
             <div style="display: flex;justify-content: space-between;">
               <div style="line-height:35px;">租赁趋势统计</div>
               <div>
@@ -250,7 +255,7 @@
             </div>
             <div ref="shop4ZX" style="width:100%;height: 400px;"></div>
           </div>
-          <div style="width:48%;height: 400px;marigin-right:20px;">
+          <div style="width:48%;height: 400px;">
             <div style="display: flex;justify-content: space-between;">
               <div style="line-height:35px;">租赁商户top5</div>
               <div>
@@ -264,11 +269,11 @@
           </div>
         </div>
       </div> -->
-
-      <div style="width: 100%;margin-bottom:20px;">
+      <TitleWithCircle title="合同情况统计" style="margin: 20px 0;" />
+      <div style="width: 100%;">
         <div style="display:flex;justify-content: space-between">
           <div style="display:flex;">
-            <div style="margin-right: 10px;line-height:35px;">合同情况统计</div>
+            <!-- <div style="margin-right: 10px;line-height:35px;">合同情况统计</div> -->
             <!-- <el-select v-model="formSel.createDate" placeholder="所属区域" style="width: 150px;margin-right: 10px">
               <el-option label="1" value="1" />
               <el-option label="2" value="2" />
@@ -292,7 +297,7 @@
           </div> -->
         </div>
         <div style="display:flex;margin-top:10px;">
-          <div style="width:48%;height: 400px;marigin-right:20px;">
+          <div style="width:48%;height: 400px;">
             <div style="display: flex;justify-content: space-between;">
               <div style="line-height:35px;">合同签约数量趋势</div>
               <!-- <div>
@@ -304,7 +309,7 @@
             </div>
             <div ref="shop5ZX" style="width:100%;height: 400px;"></div>
           </div>
-          <div style="width:48%;height: 400px;marigin-right:20px;">
+          <div style="width:48%;height: 400px;">
             <div style="display: flex;justify-content: space-between;">
               <div style="line-height:35px;">签约数量占比</div>
               <!-- <div>
@@ -318,18 +323,27 @@
           </div>
         </div>
       </div>
-
+    </div>
     </div>
  
   </div>
 </template>
  
 <script>
+  import html2canvas from 'html2canvas'
+  import jsPDF from 'jspdf'
+  import TitleWithCircle from '@/components/top/index';
   import {
     statistical,
   } from '@/api/information'
   import * as echarts from 'echarts'
+  import {
+    async
+  } from 'q';
   export default {
+    components: {
+      TitleWithCircle,
+    },
     name: 'atmosphereGl',
     data() {
       return {
@@ -339,10 +353,10 @@
         flag: false,
         pageSize: 10,
         tableData: [],
-        FormTime:[],
+        FormTime: [],
         pageindex: {
-           startTime: "1990-09-11",
-             endTime: "2024-11-09"
+          startTime: "1990-09-11",
+          endTime: "2024-11-09"
         },
         formSel: {
  
@@ -359,8 +373,8 @@
       this.pageindex.startTime = monthAgo.toISOString().slice(0, 10);
       this.pageindex.endTime = today.toISOString().slice(0, 10);
       this.FormTime = [
-      this.pageindex.startTime,
-      this.pageindex.endTime
+        this.pageindex.startTime,
+        this.pageindex.endTime
       ]
       console.error(this.pageindex)
       this.getAll()
@@ -391,7 +405,7 @@
           tooltip: {},
           xAxis: {
             type: 'category',
-              data:processedData.map(item => item.name),
+            data: processedData.map(item => item.name),
           },
           yAxis: {
             type: 'value',
@@ -407,8 +421,7 @@
             type: 'bar',
             color: '#3f9b6a',
             data: processedData.map(item => item.value),
-          }
-          ]
+          }]
         };
         option && myChart.setOption(option);
       },
@@ -420,11 +433,14 @@
           name: item.trendDate || '11',
           value: item.trendQuantity
         }))
-        processedData.push({name:'',value:0})
+        processedData.push({
+          name: '',
+          value: 0
+        })
         let option = {
           xAxis: {
             type: 'category',
-            data: ['商铺','场地','广告位'],
+            data: ['商铺', '场地', '广告位'],
           },
           yAxis: {
             type: 'value',
@@ -489,7 +505,7 @@
               show: false
             },
             color: ['#3f9b6a', 'rgb(61,182,211)'],
-               data:processedData,
+            data: processedData,
           }]
         }
         option && myChart.setOption(option);
@@ -505,10 +521,10 @@
         let option = {
           legend: {},
           tooltip: {},
-       xAxis: {
-         type: 'category',
-         data: ['商铺','场地','广告位'],
-       },
+          xAxis: {
+            type: 'category',
+            data: ['商铺', '场地', '广告位'],
+          },
           yAxis: {
             type: 'value',
             max: 50
@@ -525,8 +541,7 @@
             color: '#3f9b6a',
             data: processedData.map(item => item.value),
             type: 'line'
-          },
-          ]
+          }, ]
         };
         option && myChart.setOption(option);
       },
@@ -607,7 +622,7 @@
         let option = {
           xAxis: {
             type: 'category',
-           data:processedData.map(item => item.name),
+            data: processedData.map(item => item.name),
           },
           yAxis: {
             type: 'value'
@@ -624,7 +639,7 @@
               color: '#3f9b6a', // 这里设置为红色
               width: 2, // 线条宽度
             },
-          data: processedData.map(item => item.value),
+            data: processedData.map(item => item.value),
             type: 'line'
           }]
         }
@@ -643,82 +658,80 @@
  
         // processedData.push({name:'签约数',value:0})
         let option = {
-  tooltip: {
-    trigger: 'item'
-  },
-  legend: {
-    top: '5%',
-    left: 'center'
-  },
-  series: [
-    {
-      type: 'pie',
-      radius: ['40%', '70%'],
-      avoidLabelOverlap: false,
-      itemStyle: {
-        borderRadius: 10,
-        borderColor: '#fff',
-        borderWidth: 2
-      },
-      label: {
-        show: false,
-        position: 'center'
-      },
-      emphasis: {
-        label: {
-          show: true,
-          fontSize: 40,
-          fontWeight: 'bold'
+          tooltip: {
+            trigger: 'item'
+          },
+          legend: {
+            top: '5%',
+            left: 'center'
+          },
+          series: [{
+            type: 'pie',
+            radius: ['40%', '70%'],
+            avoidLabelOverlap: false,
+            itemStyle: {
+              borderRadius: 10,
+              borderColor: '#fff',
+              borderWidth: 2
+            },
+            label: {
+              show: false,
+              position: 'center'
+            },
+            emphasis: {
+              label: {
+                show: true,
+                fontSize: 40,
+                fontWeight: 'bold'
+              }
+            },
+            labelLine: {
+              show: false
+            },
+            data: processedData
+          }]
         }
-      },
-      labelLine: {
-        show: false
-      },
-      data:processedData
-    }
-  ]
-}
         option && myChart.setOption(option);
       },
  
-// charDam9(){
-
-//     let Dom = this.$refs.shop3TJ
-//     let myChart = echarts.init(Dom);
-//     let option = {
-//       tooltip: {
-//         trigger: 'axis',
-//         axisPointer: {
-//           type: 'shadow'
-//         }
-//       },
-//       grid: {
-//         left: '3%',
-//         right: '4%',
-//         bottom: '3%',
-//         containLabel: true
-//       },
-//       xAxis: {
-//         type: 'value',
-//         boundaryGap: [0, 0.01]
-//       },
-//       yAxis: {
-//         type: 'category',
-//         data: ['商户A', '商户B', '商户C', '商户D', '商户E', ]
-//       },
-//       series: [{
-//         lineStyle: {
-//           color: '#3f9b6a', // 这里设置为红色
-//           width: 2, // 线条宽度
-//         },
-//         name: '2011',
-//         type: 'bar',
-//         data: [1, 2, 3, 4, 5, 10]
-//       }]
-//     };
-//     option && myChart.setOption(option);
-
-// },
+      // charDam9(){
+
+      //     let Dom = this.$refs.shop3TJ
+      //     let myChart = echarts.init(Dom);
+      //     let option = {
+      //       tooltip: {
+      //         trigger: 'axis',
+      //         axisPointer: {
+      //           type: 'shadow'
+      //         }
+      //       },
+      //       grid: {
+      //         left: '3%',
+      //         right: '4%',
+      //         bottom: '3%',
+      //         containLabel: true
+      //       },
+      //       xAxis: {
+      //         type: 'value',
+      //         boundaryGap: [0, 0.01]
+      //       },
+      //       yAxis: {
+      //         type: 'category',
+      //         data: ['商户A', '商户B', '商户C', '商户D', '商户E', ]
+      //       },
+      //       series: [{
+      //         lineStyle: {
+      //           color: '#3f9b6a', // 这里设置为红色
+      //           width: 2, // 线条宽度
+      //         },
+      //         name: '2011',
+      //         type: 'bar',
+      //         data: [1, 2, 3, 4, 5, 10]
+      //       }]
+      //     };
+      //     option && myChart.setOption(option);
+
+      // },
  
       async getAll() {
         const res = await statistical(this.pageindex)
@@ -728,10 +741,10 @@
         this.charDam6(res.data.contractTrend)
  
         this.charDam7(res.data.basicQueryTrends)
-   let trends=[...res.data.shopTrend,...res.data.venueTrend,...res.data.advertisingTrend]
+        let trends = [...res.data.shopTrend, ...res.data.venueTrend, ...res.data.advertisingTrend]
  
         this.charDam1(trends)
-         this.charDam3(trends)
+        this.charDam3(trends)
       },
       handleSizeChange() {
  
@@ -739,29 +752,56 @@
       handleCurrentChange() {
  
       },
-      resetting(){
-      this.FormTime = []
-    this.getAll()
+      resetting() {
+        let today = new Date();
+        let monthAgo = new Date();
+        monthAgo.setMonth(monthAgo.getMonth() - 1);
+        monthAgo.setDate(monthAgo.getDate() + 1);
+        this.pageindex.startTime = monthAgo.toISOString().slice(0, 10);
+        this.pageindex.endTime = today.toISOString().slice(0, 10);
+        this.FormTime = [
+          this.pageindex.startTime,
+          this.pageindex.endTime
+        ]
+        this.getAll()
       },
-      async onSubmit(){
+      async onSubmit() {
  
-        let  Msg ={
+        let Msg = {
           startTime: this.FormTime[0],
-              endTime:this.FormTime[1]
+          endTime: this.FormTime[1]
         }
         const res = await statistical(Msg)
         this.charDam(res.data.seekingIntentionStatistics)
         this.charDam2(res.data.seekingIntentionStatistics)
         this.charDam6(res.data.contractTrend)
-this.charDam7(res.data.basicQueryTrends)
-   let trends=[...res.data.shopTrend,...res.data.venueTrend,...res.data.advertisingTrend]
+        this.charDam7(res.data.basicQueryTrends)
+        let trends = [...res.data.shopTrend, ...res.data.venueTrend, ...res.data.advertisingTrend]
  
         this.charDam1(trends)
-         this.charDam3(trends)
+        this.charDam3(trends)
  
       },
-      gitOut(){
+      async gitOut() {
+        const content = this.$refs.contentToConvert;
+
+        // 使用 html2canvas 将 div 渲染为画布
+        const canvas = await html2canvas(content);
  
+        // 获取画布的图像数据
+        const imgData = canvas.toDataURL('image/png');
+
+        // 创建一个新的 PDF 文档
+        const pdf = new jsPDF('p', 'mm', 'a4');
+
+        // 添加图像到 PDF，第二个参数是图像格式，第三个参数是缩放比例
+        const imgWidth = 190; // 图像的宽度（mm）
+        const imgHeight = (canvas.height * imgWidth) / canvas.width; // 保持图像的宽高比
+
+        pdf.addImage(imgData, 'PNG', 10, 10, imgWidth, imgHeight); // 10, 10 是图像在 PDF 中的位置（mm）
+
+        // 保存 PDF 文件
+        pdf.save('downloaded.pdf');
       },
     }
   }
@@ -779,7 +819,7 @@ this.charDam7(res.data.basicQueryTrends)
     line-height: 0;
   }
  
-  
+
  
   .formSearch {
     position: relative;
 <template>
-  <div style="background-color:#f7f7f7;padding:10px 10px;">
-    <div class="zhuti" v-if="onaction == '1'">
+  <div style="background-color:#f7f7f7;padding:10px 10px;" >
+    <div class="zhuti boxqw" v-if="onaction == '1'">
       <div style="height:58px;line-height:58px;">
         <div style="color:#0006"> <span>招商资源监测</span> <span style="padding:0 5px;">></span> <span
             style="color:#000000e6">资源发布审核</span></div>
@@ -42,7 +42,7 @@
           </div>
         </div>
         <!-- 表格 -->
-        <el-table v-if="ontype=='1'" :span-method="tableSpanMethod" :data="tableData"
+        <el-table v-if="ontype=='1' && ishow" :span-method="tableSpanMethod" :data="tableData"
           :header-cell-style="{fontSize: '14px',color:'#0009',fontWeight: 'normal',backgroundColor:'#F2F3F5'}">
           <el-table-column label="商铺名称" prop="shopName" show-overflow-tooltip>
             <template slot-scope="scope">
@@ -89,7 +89,7 @@
             </template>
           </el-table-column>
         </el-table>
-        <el-table v-if="ontype=='2'" :span-method="tableSpanMethod" :data="tableData"
+        <el-table v-if="ontype=='2' && ishow" :span-method="tableSpanMethod" :data="tableData"
           :header-cell-style="{fontSize: '14px',color:'#0009',fontWeight: 'normal',backgroundColor:'#F2F3F5'}">
           <el-table-column label="广告位名称" prop="advertisingName" show-overflow-tooltip>
             <template slot-scope="scope">
@@ -134,7 +134,7 @@
             </template>
           </el-table-column>
         </el-table>
-        <el-table v-if="ontype=='3'" :span-method="tableSpanMethod" :data="tableData"
+        <el-table v-if="ontype=='3' && ishow" :span-method="tableSpanMethod" :data="tableData"
           :header-cell-style="{fontSize: '14px',color:'#0009',fontWeight: 'normal',backgroundColor:'#F2F3F5'}">
           <el-table-column label="场地名称" prop="venueName" show-overflow-tooltip>
             <template slot-scope="scope">
@@ -297,6 +297,7 @@
   export default {
     data() {
       return {
+        ishow:true,
         issp: '1',
         publishStatus: '',
         clName: '',
@@ -536,6 +537,12 @@
         this.onaction = '4'
       },
       async getAll() {
+        this.ishow = false
+        const loading = this.$loading({
+          target: document.querySelector('.boxqw'),
+          fullscreen: true
+        })
+   
         this.tableData = []
         let list = []
         if (this.ontype == '1') {
@@ -556,7 +563,7 @@
                   cereBasicInformationShop: element.cereBasicInformationShop,
                   num: element.cereRentalPolicies.length,
                   shopinfo: element1,
-                  typeid:'sp'+element.cereBasicInformationShop.id
+                  typeid:'sp'+element.cereBasicInformationShop.id,
                 };
                 c1.push(obj);
               }
@@ -694,9 +701,14 @@
           // }
           list = [...list, ...c2]
           this.tableData = list
+
           console.log(this.tableData);
         }
-
+        setTimeout(() => {
+          this.ishow = true
+          loading.close();
+          this.$forceUpdate();
+        }, 100)
       },
       removeonaction(e) {
         console.error(e)