基础代码组件

package.json

@@ -21,7 +21,8 @@
     "@vueuse/core": "10.11.0",
     "axios": "0.28.1",
     "clipboard": "2.0.11",
-    "echarts": "5.5.1",
+    "echarts": "^5.5.1",
+    "echarts-gl": "^2.0.9",
     "element-plus": "2.7.6",
     "file-saver": "2.0.5",
     "fuse.js": "6.6.2",

src/components/custom-form.vue

@@ -0,0 +1,65 @@
+<template>
+  <el-form
+    ref="formRef"
+    class="custom-form"
+    :model="model"
+    inline
+    :rules="rules"
+    v-bind="$attrs"
+  >
+    <div v-for="(row, index) in config" :key="index" class="line">
+      <template v-if="Array.isArray(row)">
+        <el-row :gutter="20">
+          <el-col
+            v-for="(rowItem, ind) in row"
+            :key="rowItem.label || ind"
+            :span="rowItem.span || 24"
+          >
+            <el-form-item
+              :label="rowItem.label"
+              :prop="rowItem.prop"
+              v-if="rowItem.componentIf ? rowItem.componentIf : true"
+            >
+              <slot :name="rowItem.prop" />
+              <component
+                ref="componentRef"
+                :style="{ width: '100%' }"
+                :is="rowItem.component"
+                v-bind="rowItem['componentProps']"
+                v-model="model[rowItem.prop]"
+                :propName="rowItem.prop"
+                @handleChange="handleChange"
+              />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </template>
+    </div>
+  </el-form>
+</template>
+
+<script>
+export default {
+  props: {
+    model: Object,
+    rules: Object,
+    config: Array,
+  },
+  data() {
+    return {
+      map: null,
+    };
+  },
+  mounted() {},
+  methods: {
+    handleChange({ propName, value }) {
+      this.model[propName] = value;
+      this.$emit("update:model", this.model);
+      // this.$emit('handleChange', value)
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+</style>

src/components/numCard.vue

@@ -0,0 +1,97 @@
+<template>
+  <div class="numCard">
+    <div
+      class="cardItem"
+      v-for="(item, i) in sdlist"
+      :key="i"
+      :class="`card${i}`"
+    >
+      <span>{{ item.name }}</span>
+      <span>{{ sddata[""] || 0 }}个</span>
+      <span>{{ sddata[""] || 0 }}亩</span>
+      <div class="cardItem acard" :class="`card${i}`" v-if="item.show">
+        <span>{{ item.name }}1</span>
+        <span>{{ sddata[""] || 0 }}个</span>
+        <span>{{ sddata[""] || 0 }}亩</span>
+      </div>
+      <div class="cardItem acard" :class="`card${i}`" v-if="item.show">
+        <span>{{ item.name }}2</span>
+        <span>{{ sddata[""] || 0 }}个</span>
+        <span>{{ sddata[""] || 0 }}亩</span>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+defineProps({
+  sddata: {
+    type: Object,
+    default: {},
+  },
+  sdlist: {
+    type: Array,
+    default: () => [],
+  },
+});
+</script>
+<style  lang="scss" scoped>
+.numCard {
+  width: 100%;
+  height: 120px;
+  display: flex;
+  // background-color: rgba(255, 192, 203, 0.272);
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+
+  .cardItem {
+    position: relative;
+    // width: 230px;
+    width: 200px;
+    height: 85px;
+    background: linear-gradient(
+      180deg,
+      rgba(30, 198, 149, 1) 0%,
+      rgba(30, 198, 149, 1) 0%,
+      rgba(51, 204, 204, 1) 100%,
+      rgba(51, 204, 204, 1) 100%
+    );
+    border: none;
+    border-radius: 4px;
+    -moz-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.349019607843137);
+    -webkit-box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.349019607843137);
+    box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.349019607843137);
+    font-family: "Arial Negreta", "Arial Normal", "Arial";
+    font-weight: 700;
+    font-style: normal;
+    font-size: 14px;
+    color: #ffffff;
+    // display: flex;
+    flex-direction: column;
+    justify-content: center;
+
+    span {
+      display: inline-block;
+      width: 100%;
+      height: calc(100% / 3);
+      // background: #faebd78c;
+      text-align: center;
+      line-height: 28px;
+    }
+  }
+  .acard {
+    margin-top: 20px;
+    z-index: 10;
+  }
+
+  .card1 {
+    background: linear-gradient(
+      90deg,
+      rgba(244, 174, 149, 1) 0%,
+      rgba(244, 174, 149, 1) 0%,
+      rgba(226, 113, 140, 1) 100%,
+      rgba(226, 113, 140, 1) 100%
+    );
+  }
+}
+</style>

src/views/pageCode/dataEntry/config.js

@@ -0,0 +1,154 @@
+
+
+export const FormConfig = [
+  [
+
+    // {
+    //   label: '申请状态：',
+    //   prop: 'state',
+    //   span: 5
+    // },
+    {
+      label: '实体名称：',
+      prop: 'entityname',
+      span: 5,
+      component: 'ElInput',
+      componentProps: {
+        placeholder: '实体名称'
+      }
+    },
+    {
+      label: '实体ID',
+      prop: 'entityid',
+      span: 5,
+      component: 'ElInput',
+      componentProps: {
+        placeholder: '实体ID'
+      }
+    },
+    {
+      prop: 'action',
+      span: 5
+    }
+  ]
+]
+
+export const TableHeader = [
+  // 序号
+  { label: "实体名称", prop: "entityname", width: 150 },
+  { label: "实体ID", prop: "entityid" },
+  { label: "图元标识码", prop: "elementid" },
+  { label: "图元编码", prop: "elementcode" },
+  { label: "位置码", prop: "locationid" },
+  { label: "操作", slot: "action", width: 120 },
+]
+
+
+// 详情字段
+export const detailInfos = [
+  [
+    [
+      { flag: 'label', value: '申请时间', span: 8 },
+      { flag: 'value', value: 'sqTime', span: 16 }
+    ],
+    [
+      { flag: 'label', value: '申请部门', span: 8 },
+      { flag: 'value', value: 'sqDepartmentBy', span: 16 }
+    ]
+  ],
+  [
+    [
+      { flag: 'label', value: '数据服务', span: 8 },
+      { flag: 'value', value: 'systemName', span: 16 }
+    ],
+    [
+      { flag: 'label', value: '数据类型', span: 8 },
+      { flag: 'value', value: 'zymlTypeName', span: 16 }
+    ]
+  ],
+  [
+    [
+      { flag: 'label', value: '申请范围', span: 4 },
+      { flag: 'value', value: 'sqFw', span: 20 }
+    ],
+  ],
+  [[
+    { flag: 'label', value: '申请理由', span: 4 },
+    { flag: 'value', value: 'sqReason', span: 20 }
+  ]],
+  [[
+    { flag: 'label', value: '系统名称', span: 4 },
+    { flag: 'value', value: 'systemName', span: 20 }
+  ]],
+  [[
+    { flag: 'label', value: '调用IP', span: 4 },
+    { flag: 'value', value: 'callIp', span: 20 }
+  ]],
+  [[
+    { flag: 'label', value: '预期使用时间', span: 4 },
+    { flag: 'value', value: 'sqDeadline', span: 20 }
+  ]],
+  [[
+    { flag: 'label', value: '附件', span: 4 },
+    { flag: 'value', value: 'attachment', span: 20, isslot: true }
+  ]]
+]
+export const shjlInfos = [
+  [[
+    { flag: 'label', value: '审核结果', span: 4 },
+    { flag: 'value', value: 'jg', span: 20, isslot: true }
+  ]],
+  [[
+    { flag: 'label', value: '审核意见', span: 4 },
+    { flag: 'value', value: 'spReason', span: 20 }
+  ]],
+  [[
+    { flag: 'label', value: '有效截止日期', span: 4 },
+    { flag: 'value', value: 'deadline', span: 20 }
+  ]],
+  [[
+    { flag: 'label', value: '审核人', span: 4 },
+    { flag: 'value', value: 'sqUserBy', span: 20 }
+  ]],
+  [[
+    { flag: 'label', value: '审核时间', span: 4 },
+    { flag: 'value', value: 'spTime', span: 20 }
+  ]],
+]
+export const chInfos = [
+  [[
+    { flag: 'label', value: '撤回时间', span: 4 },
+    { flag: 'value', value: 'sqRevokeTime', span: 20 }
+  ]],
+  [[
+    { flag: 'label', value: '撤回原因', span: 4 },
+    { flag: 'value', value: 'sqRevokeReason', span: 20 }
+  ]],
+]
+
+
+
+
+export const gxConfig = [
+  [
+    {
+      label: '',
+      prop: 'query_data',
+      span: 8,
+      component: 'ElInput',
+      componentProps: {
+        placeholder: '请输入查询名称或Id'
+      }
+    },
+    {
+      label: '',
+      prop: 'link',
+      span: 8
+    },
+    {
+      prop: 'action',
+      span: 5
+    }
+  ]
+]
+

src/views/remote/farmland/index.vue

@@ -64,16 +64,7 @@
           <el-button @click.prevent="removeDomain(ditem)">删除</el-button>
         </div>
       </div>
-      <div class="numCard">
-        <div class="cardItem">
-          <span>监测图斑个数(个):</span>
-          <span>{{ newObj.spotsnumber }}</span>
-        </div>
-        <div class="cardItem jc">
-          <span>监测面积(亩):</span>
-          <span>{{ newObj.spotsarea }}</span>
-        </div>
-      </div>
+      
       <el-table
         :data="tableData"
         border