完成订单模块

src/views/cms/setting/components/website-field-edit.vue

@@ -22,6 +22,15 @@
       <a-form-item label="参数值" name="value">
         <a-input allow-clear placeholder="VALUE" v-model:value="form.value" />
       </a-form-item>
+      <a-form-item label="(选填)">
+        <SelectFile
+          :placeholder="`请选择图片`"
+          :limit="1"
+          :data="images"
+          @done="chooseImage"
+          @del="onDeleteItem"
+        />
+      </a-form-item>
       <a-form-item label="描述" name="comments">
         <a-textarea
           :rows="4"
@@ -36,13 +45,15 @@
 
 <script lang="ts" setup>
   import { ref, reactive, watch } from 'vue';
-  import { FormInstance, RuleObject } from 'ant-design-vue/es/form';
+  import { FormInstance } from 'ant-design-vue/es/form';
   import { WebsiteField } from '@/api/cms/website/field/model';
   import useFormData from '@/utils/use-form-data';
   import { addWebsiteField, updateWebsiteField } from '@/api/cms/website/field';
   import { message } from 'ant-design-vue/es';
-  import { isChinese } from 'ele-admin-pro';
   import { removeSiteInfoCache } from '@/api/cms/website';
+  import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
+  import { FileRecord } from '@/api/system/file/model';
+  import { uuid } from 'ele-admin-pro';
 
   // 是否是修改
   const isUpdate = ref(false);
@@ -62,7 +73,7 @@
 
   // 提交状态
   const loading = ref(false);
-
+  const images = ref<ItemType[]>([]);
   const formRef = ref<FormInstance | null>(null);
 
   const { form, resetFields, assignFields } = useFormData<WebsiteField>({
@@ -98,6 +109,20 @@
     emit('update:visible', value);
   };
 
+  const chooseImage = (data: FileRecord) => {
+    images.value.push({
+      uid: data.id,
+      url: data.path,
+      status: 'done'
+    });
+    form.value = data.downloadUrl;
+  };
+
+  const onDeleteItem = (index: number) => {
+    images.value.splice(index, 1);
+    form.value = '';
+  };
+
   /* 保存编辑 */
   const save = () => {
     if (!formRef.value) {
@@ -109,6 +134,7 @@
         loading.value = true;
         const data = {
           ...form,
+          name: form.name?.toUpperCase(),
           websiteId: props.websiteId
         };
         const saveOrUpdate = isUpdate.value
@@ -136,9 +162,15 @@
     () => props.visible,
     (visible) => {
       if (visible) {
+        images.value = [];
         if (props.data) {
           assignFields(props.data);
           form.comments = props.data.comments;
+          images.value.push({
+            uid: uuid(),
+            url: props.data.value,
+            status: 'done'
+          });
           isUpdate.value = true;
         } else {
           isUpdate.value = false;