增加字段

src/views/index.vue

@@ -2,7 +2,7 @@
   <div class="dashboard-container">
     <div class="chart-row">
       <div class="chart-container">
-        <h2>用户增长趋势</h2>
+        <h2>资源调查进度</h2>
         <div ref="lineChart" class="chart"></div>
       </div>
 
@@ -57,7 +57,7 @@
             trigger: 'axis'
           },
           legend: {
-            data: ['新增用户', '活跃用户', '付费用户']
+            data: ['已调查', '待调查']
           },
           grid: {
             left: '3%',
@@ -68,27 +68,14 @@
           xAxis: {
             type: 'category',
             boundaryGap: false,
-            data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月']
+            data: ['A市', 'B市', 'C市', 'D市', 'E市', 'F市', 'G市']
           },
           yAxis: {
             type: 'value'
           },
           series: [
             {
-              name: '新增用户',
-              type: 'line',
-              data: [120, 132, 101, 134, 90, 230, 210],
-              smooth: true,
-              lineStyle: {
-                width: 3,
-                color: '#5470C6'
-              },
-              itemStyle: {
-                color: '#5470C6'
-              }
-            },
-            {
-              name: '活跃用户',
+              name: '已调查',
               type: 'line',
               data: [220, 182, 191, 234, 290, 330, 310],
               smooth: true,
@@ -101,7 +88,7 @@
               }
             },
             {
-              name: '付费用户',
+              name: '待调查',
               type: 'line',
               data: [150, 232, 201, 154, 190, 330, 410],
               smooth: true,

src/views/index_v2.vue

@@ -0,0 +1,312 @@
+<template>
+  <div class="dashboard-container">
+    <div class="chart-row">
+      <div class="chart-container">
+        <h2>用户增长趋势</h2>
+        <div ref="lineChart" class="chart"></div>
+      </div>
+
+      <div class="chart-container">
+        <h2>产品销售统计</h2>
+        <div ref="barChart" class="chart"></div>
+      </div>
+    </div>
+
+    <div class="chart-row">
+      <div class="chart-container">
+        <h2>用户分布比例</h2>
+        <div ref="pieChart" class="chart"></div>
+      </div>
+
+      <div class="info-cards">
+        <div class="info-card">
+          <h3>总用户数</h3>
+          <p class="number">12,345</p>
+          <p class="trend up">↑ 12% 同比</p>
+        </div>
+        <div class="info-card">
+          <h3>本月销售额</h3>
+          <p class="number">¥ 456,789</p>
+          <p class="trend up">↑ 8% 环比</p>
+        </div>
+        <div class="info-card">
+          <h3>活跃用户</h3>
+          <p class="number">8,642</p>
+          <p class="trend down">↓ 3% 环比</p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  import * as echarts from 'echarts';
+
+  export default {
+    name: 'Dashboard',
+    mounted() {
+      this.initLineChart();
+      this.initBarChart();
+      this.initPieChart();
+    },
+    methods: {
+      initLineChart() {
+        const chart = echarts.init(this.$refs.lineChart);
+        const option = {
+          tooltip: {
+            trigger: 'axis'
+          },
+          legend: {
+            data: ['新增用户', '活跃用户', '付费用户']
+          },
+          grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            containLabel: true
+          },
+          xAxis: {
+            type: 'category',
+            boundaryGap: false,
+            data: ['1月', '2月', '3月', '4月', '5月', '6月', '7月']
+          },
+          yAxis: {
+            type: 'value'
+          },
+          series: [
+            {
+              name: '新增用户',
+              type: 'line',
+              data: [120, 132, 101, 134, 90, 230, 210],
+              smooth: true,
+              lineStyle: {
+                width: 3,
+                color: '#5470C6'
+              },
+              itemStyle: {
+                color: '#5470C6'
+              }
+            },
+            {
+              name: '活跃用户',
+              type: 'line',
+              data: [220, 182, 191, 234, 290, 330, 310],
+              smooth: true,
+              lineStyle: {
+                width: 3,
+                color: '#91CC75'
+              },
+              itemStyle: {
+                color: '#91CC75'
+              }
+            },
+            {
+              name: '付费用户',
+              type: 'line',
+              data: [150, 232, 201, 154, 190, 330, 410],
+              smooth: true,
+              lineStyle: {
+                width: 3,
+                color: '#EE6666'
+              },
+              itemStyle: {
+                color: '#EE6666'
+              }
+            }
+          ]
+        };
+        chart.setOption(option);
+        window.addEventListener('resize', function() {
+          chart.resize();
+        });
+      },
+      initBarChart() {
+        const chart = echarts.init(this.$refs.barChart);
+        const option = {
+          tooltip: {
+            trigger: 'axis',
+            axisPointer: {
+              type: 'shadow'
+            }
+          },
+          legend: {
+            data: ['2022', '2023']
+          },
+          grid: {
+            left: '3%',
+            right: '4%',
+            bottom: '3%',
+            containLabel: true
+          },
+          xAxis: {
+            type: 'value'
+          },
+          yAxis: {
+            type: 'category',
+            data: ['产品A', '产品B', '产品C', '产品D', '产品E']
+          },
+          series: [
+            {
+              name: '2022',
+              type: 'bar',
+              data: [320, 302, 341, 374, 390],
+              itemStyle: {
+                color: '#91CC75'
+              }
+            },
+            {
+              name: '2023',
+              type: 'bar',
+              data: [420, 432, 401, 454, 590],
+              itemStyle: {
+                color: '#5470C6'
+              }
+            }
+          ]
+        };
+        chart.setOption(option);
+        window.addEventListener('resize', function() {
+          chart.resize();
+        });
+      },
+      initPieChart() {
+        const chart = echarts.init(this.$refs.pieChart);
+        const option = {
+          tooltip: {
+            trigger: 'item'
+          },
+          legend: {
+            orient: 'vertical',
+            right: 10,
+            top: 'center'
+          },
+          series: [
+            {
+              name: '用户分布',
+              type: 'pie',
+              radius: ['40%', '70%'],
+              avoidLabelOverlap: false,
+              itemStyle: {
+                borderRadius: 10,
+                borderColor: '#fff',
+                borderWidth: 2
+              },
+              label: {
+                show: false,
+                position: 'center'
+              },
+              emphasis: {
+                label: {
+                  show: true,
+                  fontSize: '18',
+                  fontWeight: 'bold'
+                }
+              },
+              labelLine: {
+                show: false
+              },
+              data: [
+                { value: 1048, name: '华北地区' },
+                { value: 735, name: '华东地区' },
+                { value: 580, name: '华南地区' },
+                { value: 484, name: '西部地区' },
+                { value: 300, name: '东北地区' }
+              ],
+              color: ['#5470C6', '#91CC75', '#EE6666', '#FAC858', '#73C0DE']
+            }
+          ]
+        };
+        chart.setOption(option);
+        window.addEventListener('resize', function() {
+          chart.resize();
+        });
+      }
+    }
+  };
+</script>
+
+<style scoped>
+  .dashboard-container {
+    padding: 20px;
+    background-color: #f5f7fa;
+    min-height: 100vh;
+  }
+
+  h1 {
+    color: #333;
+    margin-bottom: 30px;
+  }
+
+  .chart-row {
+    display: flex;
+    margin-bottom: 20px;
+    gap: 20px;
+  }
+
+  .chart-container {
+    flex: 1;
+    background-color: white;
+    border-radius: 8px;
+    padding: 15px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  }
+
+  .chart {
+    height: 350px;
+  }
+
+  .info-cards {
+    flex: 0 0 300px;
+    display: flex;
+    flex-direction: column;
+    gap: 20px;
+  }
+
+  .info-card {
+    background-color: white;
+    border-radius: 8px;
+    padding: 20px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+  }
+
+  .info-card h3 {
+    color: #666;
+    margin-bottom: 10px;
+    font-size: 16px;
+  }
+
+  .info-card .number {
+    font-size: 24px;
+    font-weight: bold;
+    margin-bottom: 5px;
+    color: #333;
+  }
+
+  .info-card .trend {
+    font-size: 14px;
+  }
+
+  .trend.up {
+    color: #67C23A;
+  }
+
+  .trend.down {
+    color: #F56C6C;
+  }
+
+  @media (max-width: 1200px) {
+    .chart-row {
+      flex-direction: column;
+    }
+
+    .info-cards {
+      flex-direction: row;
+      flex-wrap: wrap;
+    }
+
+    .info-card {
+      flex: 1;
+      min-width: 200px;
+    }
+  }
+</style>

src/views/resource/land/index.vue

@@ -54,6 +54,11 @@
                   <el-option v-for="dict in dict.type.is_common" :key="dict.value" :label="dict.label" :value="dict.value"/>
                 </el-select>
               </el-form-item>-->
+              <el-form-item label="是账外地" prop="sfzwd">
+                <el-select v-model="queryParams.sfzwd" placeholder="请选择是否账外地" clearable>
+                  <el-option v-for="dict in dict.type.is_common" :key="dict.value" :label="dict.label" :value="dict.value"/>
+                </el-select>
+              </el-form-item>
               <el-form-item label="调查状态" prop="surveyStatus">
                 <el-select v-model="queryParams.surveyStatus" placeholder="请选择调查状态" clearable>
                   <el-option v-for="dict in dict.type.survey_status" :key="dict.value" :label="dict.label" :value="dict.value"/>
@@ -207,6 +212,7 @@
           <el-descriptions-item label="指界人姓名">{{ form.zjrxm }}</el-descriptions-item>
           <el-descriptions-item label="实测面积(㎡)">{{ form.scmj }}</el-descriptions-item>
           <el-descriptions-item label="实测面积(亩)">{{ form.scmjm }}</el-descriptions-item>
+          <el-descriptions-item label="是否账外地">{{ form.sfzwd }}</el-descriptions-item>
         </el-descriptions>
 
         <el-descriptions title="经营数据" border :column="2" class="margin-top">
@@ -301,6 +307,11 @@
         <el-form-item label="实测面积" prop="scmjm">
             <el-input-number v-model="form.scmjm" placeholder="请输入实测面积" controls-position="right"   :precision="3"/>
         </el-form-item>
+        <el-form-item label="是否账外地" prop="sfzwd">
+          <el-radio-group v-model="form.sfzwd">
+            <el-radio v-for="dict in dict.type.is_common" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>
+          </el-radio-group>
+        </el-form-item>
         <el-form-item label="调查状态" prop="surveyStatus">
           <el-radio-group v-model="form.surveyStatus">
             <el-radio v-for="dict in dict.type.survey_status" :key="dict.value" :label="dict.value">{{dict.label}}</el-radio>
@@ -390,6 +401,7 @@ export default {
         sfjbnt: null,
         surveyStatus: null,
         importCode: null,
+        sfzwd: null,
       },
       // 表单参数
       form: {},
@@ -474,6 +486,7 @@ export default {
         surveyStatus: '1',
         importCode: null,
         deptName: null,
+        sfzwd: '2'
       }
       this.resetForm("form")
     },