Merge branch 'main' into hc_zhufu

src/views/demo/form-design/components/VFormDesign/components/FormItemProps.vue

@@ -74,6 +74,8 @@
         </FormItem>
       </Form>
       <Form
+        label-align="left"
+        layout="vertical"
         v-else-if="
           formConfig.currentItem.component == 'Grid' && formConfig.currentItem.type == 'subTable'
         "
@@ -81,6 +83,9 @@
         <FormItem label="标签">
           <a-input v-model:value="formConfig.currentItem.label" placeholder="请输入" />
         </FormItem>
+        <FormItem label="字段标识">
+          <a-input v-model:value="formConfig.currentItem.field" placeholder="请输入" />
+        </FormItem>
       </Form>
       <Form v-else label-align="left" layout="vertical">
         <div v-for="item of baseFormItemProps" :key="item.name">

src/views/demo/onlineform/formModule/FormModal.vue

@@ -158,7 +158,7 @@
   function getForm() {
     const formData = modalFrom_formData.value.formData;
     const config = modalDesign_config.value.config;
-
+    console.log('config', config)
     // 基本配置信息
     let formModuleEntity: any = {};
     formModuleEntity = formData;

src/views/demo/onlineform/formModule/config/maps.vue

@@ -0,0 +1,150 @@
+<template>
+  <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
+    <Form label-align="left" layout="vertical" description="图斑控件" style="margin: 20px auto 0">
+      <FormItem label="图斑宽度">
+        <a-input-number
+          v-model:value="mapSetData.width"
+          placeholder="请输入图斑宽度"
+          :min="1"
+          :max="100"
+        >
+          <template #addonAfter><PercentageOutlined /></template>
+        </a-input-number>
+      </FormItem>
+      <FormItem label="选择图层">
+        <a-select
+          v-model:value="mapSetData.chooseLayer"
+          :options="shpLayerSourceOptions"
+          size="middle"
+          placeholder="请选择图层"
+          @change="handleChangeDataTable"
+        />
+      </FormItem>
+      <FormItem label="图层字段解析">
+        <FormItem label="图层数据表">
+          <a-input
+            v-model:value="mapSetData.layerFields.dataTable"
+            placeholder="请输入图层数据表"
+            disabled="false"
+          />
+        </FormItem>
+        <FormItem label="GID字段">
+          <a-select
+            v-model:value="mapSetData.layerFields.gidField"
+            :options="mapSetData.layerFields.labelFieldOptions"
+            size="middle"
+            placeholder="请选择GID字段"
+          />
+        </FormItem>
+        <FormItem label="名称字段标注">
+          <a-select
+            v-model:value="mapSetData.layerFields.labelField"
+            :options="mapSetData.layerFields.labelFieldOptions"
+            size="middle"
+            placeholder="请选择名称字段标注"
+          />
+        </FormItem>
+        <FormItem label="Geom字段">
+          <a-select
+            v-model:value="mapSetData.layerFields.geomField"
+            :options="mapSetData.layerFields.labelFieldOptions"
+            size="middle"
+            placeholder="请选择Geom字段"
+          />
+        </FormItem>
+      </FormItem>
+      <FormItem label="是否允许添加图斑">
+        <Switch v-model:checked="mapSetData.isAllowAddPolygon" />
+      </FormItem>
+      <FormItem label="是否允许编辑图斑">
+        <Switch v-model:checked="mapSetData.isAllowEditPolygon" />
+      </FormItem>
+      <FormItem label="是否开启位置跳转">
+        <Switch v-model:checked="mapSetData.isEnablePostionJump" />
+      </FormItem>
+    </Form>
+  </PageWrapper>
+</template>
+<script lang="ts" setup>
+  import { ref, inject, defineProps, PropType, watch, onMounted, unref, nextTick } from 'vue';
+  import { Empty, Input, Form, FormItem, Switch, Checkbox, Col } from 'ant-design-vue';
+  import { PageWrapper } from '@/components/Page';
+  import { ShpLayerSourceLoadPage, GetTableAndViewColumnList } from '@/api/demo/formScheme';
+  import { PercentageOutlined } from '@ant-design/icons-vue';
+  // 定义props,树目录
+  const props = defineProps({
+    mapsCheckedKeys: {
+      type: Array as PropType<string[]>,
+      default: () => [],
+    },
+  });
+  const config: any = inject('formConfig');
+
+  const mapSetData = ref(config.table.maps);
+  watch(
+    () => config.table.maps,
+    () => {
+      mapSetData.value = config.table.maps;
+    },
+  );
+  // const mapSetData: any = ref({
+  //   width: 100,
+  //   chooseLayer: '',
+  //   layerFields: {},
+  //   isAllowAddPolygon: false,
+  //   isAllowEditPolygon: false,
+  //   isEnablePostionJump: false,
+  // });
+  const shpLayerSourceOptions: any = ref([]);
+
+  // 选择图层
+  async function getShpLayerSourceOptions() {
+    let options: any = await ShpLayerSourceLoadPage();
+    shpLayerSourceOptions.value = [];
+    options.items.forEach((e) => {
+      shpLayerSourceOptions.value.push({ label: e.name, value: e.relationTable });
+    });
+  }
+
+  function handleChangeDataTable(table) {
+    mapSetData.value.layerFields.dataTable = table;
+    if (table) {
+      getShpLayerSource(table);
+    }
+  }
+  async function getShpLayerSource(table) {
+    let querys: any = {
+      dbCode: 'hcsystemdb',
+      tableName: table,
+    };
+    const obj: any = await GetTableAndViewColumnList(querys);
+    let labelFieldOptions: any = [];
+    if (obj.length > 0) {
+      obj.forEach((e) => {
+        labelFieldOptions.push({ label: e.column_name, value: e.column_name });
+      });
+      // GID字段/名称字段标注/Geom字段 下拉选项
+      mapSetData.value.layerFields.labelFieldOptions = labelFieldOptions;
+      // GID字段
+      mapSetData.value.layerFields.gidField = obj[0].column_name;
+      // Geom字段
+      mapSetData.value.layerFields.geomField = obj[1].column_name;
+      // 名称字段标注
+      mapSetData.value.layerFields.labelField = obj[2].column_name;
+    } else {
+      // GID字段/名称字段标注/Geom字段 下拉选项
+      mapSetData.value.layerFields.labelFieldOptions = [];
+      // GID字段
+      mapSetData.value.layerFields.gidField = '';
+      // Geom字段
+      mapSetData.value.layerFields.geomField = '';
+      // 名称字段标注
+      mapSetData.value.layerFields.labelField = '';
+
+      config.table.maps = mapSetData.value;
+    }
+  }
+  onMounted(() => {
+    getShpLayerSourceOptions();
+  });
+</script>

src/views/demo/onlineform/formModule/modalDesign.vue

@@ -16,6 +16,9 @@
       <el-tab-pane :label="$t('按钮设置')" name="tab04">
         <webcodeBtns :btnsTree="btnsTree" :btnsCheckedKeys="btnsCheckedKeys" />
       </el-tab-pane>
+      <!-- <el-tab-pane :label="$t('地图设置')" name="tab05">
+        <webcodeMaps :mapsCheckedKeys="mapsCheckedKeys" />
+      </el-tab-pane> -->
     </el-tabs>
   </div>
 </template>
@@ -28,6 +31,7 @@
   import webcodeColumns from './config/columns.vue';
   import webcodeQuery from './config/query.vue';
   import webcodeBtns from './config/btns.vue';
+  import webcodeMaps from './config/maps.vue';
   import { functionGetPreviewForm, functionGetSchemeInfoEntity } from '@/api/demo/formScheme';
 
   // 定义props
@@ -87,6 +91,8 @@
   const btnsTree: any = ref([]);
   // 按钮设置Checked
   const btnsCheckedKeys: any = ref([]);
+  // 地图设置Checked
+  const mapsCheckedKeys: any = ref([]);
 
   const notInColumns = [
     'Divider',
@@ -118,6 +124,14 @@
       columns: [],
       querys: [],
       btns: [],
+      maps: {
+        width: 100,
+        chooseLayer: '',
+        layerFields: {},
+        isAllowAddPolygon: false,
+        isAllowEditPolygon: false,
+        isEnablePostionJump: false,
+      },
       sidx: '',
       isDESC: false,
     },
@@ -188,12 +202,12 @@
     if (!formVerison) {
       return;
     }
+    console.log('subbbb', formVerison)
     // 选中的历史记录表单
     let keyValue = typeof formVerison === 'string' ? formVerison : formVerison.value;
     let query: any = { keyValue: keyValue };
     const scheme: any = await functionGetPreviewForm(query);
     formScheme.value = JSON.parse(scheme.scheme);
-
     const columns: any = [];
     formScheme.value.formInfo.schemas.forEach((tab: any) => {
       if (!notInColumns.includes(tab.component)) {
@@ -272,6 +286,8 @@
         config.value.table.querys = editDataScheme.table.querys;
         // 常用按钮-表
         config.value.table.btns = editDataScheme.table.btns;
+        // 地图设置-表
+        config.value.table.maps = editDataScheme.table.maps;
 
         setCheckedKeys();
       } else {
@@ -317,6 +333,7 @@
     config.value.table.btns.forEach((t: any) => {
       btnsCheckedKeys.value.push(t.id);
     });
+
   }
 
   provide('formConfig', config.value);

src/views/demo/onlineform/formdesign/FormModal.vue

@@ -141,6 +141,10 @@
           }
         });
       }
+      // 设计子表给里面的控件增加csType字段
+      if (item.type == 'subTable') {
+        item.columns = changeCloums(item.columns, tableData);
+      }
       tabArr.push(item.componentProps.fieldName);
       if (!item.componentProps.fieldName) {
         tabLabelArr.push(item.label);
@@ -151,6 +155,24 @@
     // 表结构配置
     tableCallBack(schems, tabArr, tabLabelArr);
   }
+  function changeCloums(columns, tableData) {
+    columns.forEach((item) => {
+      if (item.children && item.children.length > 0) {
+        item.children.forEach((childItem) => {
+          tableData.forEach((element) => {
+            if (element.name == childItem.componentProps.dataTable) {
+              var currentIndex = element.data.findIndex(
+                (dataChildItem) =>
+                  dataChildItem.dbColumnName === childItem.componentProps.fieldName,
+              );
+              childItem.csType = element.data[currentIndex].csType;
+            }
+          });
+        });
+      }
+    });
+    return columns;
+  }
   function tableCallBack(schems, tabArr, tabLabelArr) {
     if (saveFormDatas.value.info.formType == 2 && !isStageClick.value) {
       // 自动建表+保存