🚨 完善高德组件

kicc-ui/src/components/AMap/src/Amap.vue

@@ -54,7 +54,7 @@
 <script lang="ts" setup>
   import AMapLoader from '@amap/amap-jsapi-loader';
   import { reactive, getCurrentInstance, onBeforeMount, onUnmounted } from 'vue';
-  import { largeHospitalMapList, smallHospitalMapList, specimenMapList,  columns } from './data';
+  import { largeHospitalMapList, smallHospitalMapList, specimenMapList,  columns } from './map.data';
   import hospital from '/@/assets/images/hospital.svg';
   import medicalKit from '/@/assets/images/medical-kit.svg';
   import hospitalTwinkle from '/@/assets/images/hospital-twinkle.gif';
@@ -69,7 +69,7 @@
   let takeSpecimenCluster;
   let scanTakeSpecimenCircleRange;
   const instance = getCurrentInstance();
-  const mapState = reactive({
+  const mapState = reactive<any>({
     loading: false,
     toggleOperatePanelClass: {
       span: 'none',
@@ -292,7 +292,7 @@
 
       // 扫描收样员园形范围
       scanTakeSpecimenCircleRange = new AMap.Circle({
-        radius: 10000,
+        radius: 14000,
         borderWeight: 3,
         strokeColor: '#3600ff',
         strokeOpacity: 0.2,

kicc-ui/src/components/AMap/src/TaskModal.vue

@@ -0,0 +1,140 @@
+<template>
+  <BasicModal v-bind="$attrs"
+              :width="720"
+              :height="500"
+              @register="registerModal"
+              @ok="handleSubmit"
+  >
+    <AForm ref="formElRef"
+           :labelCol="{ style: { width: '120px' } }"
+           :wrapperCol="{ style: { width: '100%' } }"
+           :model="state.modelRef"
+           :rules="state.rulesRef"
+           :scrollToFirstError="true"
+           @keypress.enter="handleSubmit"
+    >
+      <AFormItem name="id">
+        <Input v-model:value="state.modelRef.id" :hidden="true"/>
+      </AFormItem>
+      <ARow justify="center">
+        <ACol :span="12">
+          <AFormItem label="下级医院" name="smallHospital">
+            <a-input v-model:value="state.modelRef.smallHospital"
+                     placeholder="请输入参数名称"
+                     allowClear
+            />
+          </AFormItem>
+        </ACol>
+        <ACol :span="12">
+          <AFormItem label="上级医院" name="largeHospital">
+            <a-input v-model:value="state.modelRef.largeHospital"
+                     placeholder="请输入参数键名"
+                     allowClear
+            />
+          </AFormItem>
+        </ACol>
+        <ACol :span="12">
+          <AFormItem label="上传文件" name="file">
+            <a-input v-model:value="state.modelRef.file"
+                     placeholder="请输入参数键值"
+                     allowClear
+            />
+          </AFormItem>
+        </ACol>
+      </ARow>
+    </AForm>
+  </BasicModal>
+</template>
+<script lang="ts" setup>
+  import { reactive, ref } from 'vue';
+  import { Form, Input, Radio, Row, Col } from 'ant-design-vue';
+  import { BasicModal, ModalProps, useModalInner } from '/@/components/Modal';
+
+  /** 类型规范统一声明定义区域 */
+  interface WindowState {
+    tag: string;
+    modelRef: {
+      id: string;
+      smallHospital: string;
+      largeHospital: string;
+      file: string;
+    };
+    rulesRef: Recordable;
+  }
+
+  /** 通用变量统一声明区域 */
+  const AForm = Form;
+  const AFormItem = Form.Item;
+  const ATextarea = Input.TextArea;
+  const ARadio = Radio;
+  const ARadioGroup = Radio.Group;
+  const ARow = Row;
+  const ACol = Col;
+
+  const formElRef = ref();
+  const state = reactive<WindowState>({
+    tag: '',
+    modelRef: {
+      id: undefined!,
+      smallHospital: undefined!,
+      largeHospital: undefined!,
+      file: undefined!
+    },
+    rulesRef: {
+      smallHospital: [
+        { required: true, whitespace: true, message: '下级医院不能为空', validateTrigger: 'blur' }
+      ],
+      largeHospital: [
+        { required: true, whitespace: true, message: '上级医院不能为空', validateTrigger: 'blur' }
+      ]
+    }
+  });
+  const emit = defineEmits(['success', 'register']);
+  const [registerModal, { setModalProps, closeModal }] = useModalInner(async (data: WindowInnerData = { _tag: '' }) => {
+    // 处理清除脏数据
+    formElRef.value.resetFields();
+    formElRef.value.clearValidate();
+    // 处理设置数据
+    state.tag = data._tag;
+    const taskId = data.record?.id;
+    const props: Partial<ModalProps> = { confirmLoading: false };
+    // 采用tag标签区分操作
+    switch (state.tag) {
+      case 'add':
+        props.title = '新增任务';
+        break;
+      case 'edit':
+        props.title = '编辑任务';
+        //const result = await getConfig(configId);
+        //state.modelRef = result;
+        break;
+    }
+    // 尾部:设置处理后的最终配置数据
+    setModalProps(props);
+  });
+
+  /** 处理弹出框提交 */
+  async function handleSubmit() {
+    try {
+      // 提取验证数据
+      const formData = await formElRef.value.validate();
+      console.log(formData);
+      // 处理提交之前逻辑
+      setModalProps({ confirmLoading: true });
+      // 采用tag标签区分操作
+      switch (state.tag) {
+        case 'add':
+          //await addConfig(formData);
+          break;
+        case 'edit':
+          //await editConfig(formData);
+          break;
+      }
+      // 处理提交完成之后逻辑
+      closeModal();
+      emit('success');
+    } finally {
+      setModalProps({ confirmLoading: false });
+    }
+  }
+</script>

kicc-ui/src/components/AMap/src/map.data.ts

@@ -1,4 +1,4 @@
-import {BasicColumn} from '/@/components/Table';
+import { BasicColumn } from '/@/components/Table';
 
 /**
  * @program: kicc-ui