优化订单转换字段设置

src/views/order/orderChange/OrderChange.vue

@@ -6,7 +6,7 @@
         <el-input v-model="queryParams.excelOrderId" placeholder="" clearable />
       </el-form-item> -->
       <el-form-item label="订单状态">
-        <el-select v-model="queryParams.status" placeholder="" clearable >
+        <el-select v-model="queryParams.status" placeholder="" clearable>
           <template v-for="item in statusOptions">
             <el-option :value="item.value" :label="item.label"></el-option>
           </template>
@@ -35,8 +35,10 @@
       >
         <vxe-column type="checkbox" width="50"></vxe-column>
         <vxe-column field="fileId_dictText" title="文件名称">
-          <template #default="{row}">
-            <el-link target="_blank" :href="'/api/sys/static/'+ row.fileId_dictText">{{ row.fileId_dictText }}</el-link>
+          <template #default="{ row }">
+            <el-link target="_blank" :href="'/api/sys/static/' + row.fileId_dictText">{{
+              row.fileId_dictText
+            }}</el-link>
           </template>
         </vxe-column>
         <vxe-column field="status_dictText" title="订单状态" width="200"></vxe-column>
@@ -134,29 +136,34 @@
         <el-row>
           <el-col :span="24">
             <el-form-item label="对应字段" prop="mapField">
-              <el-select v-model="currentConfigColumn.mapField" placeholder="Select" :teleported="false">
+              <el-select
+                v-model="currentConfigColumn.mapField"
+                style="width: 220px"
+                filterable
+                placeholder="请选择"
+                :teleported="false"
+                clearable
+              >
                 <el-option-group v-for="group in allFields" :key="group.label" :label="group.label">
                   <el-option
                     v-for="item in group.options"
                     :key="item.filedName"
                     :label="item.fliedTitle"
                     :value="item.filedName"
+                    :disabled="!!item.disabled"
                   />
                 </el-option-group>
               </el-select>
-              <!-- <el-select v-model="currentConfigColumn.mapField" :teleported="false" clearable>
-                <el-option
-                  v-for="item in orderFieldList"
-                  :key="item.filedName"
-                  :value="item.filedName"
-                  :label="item.fliedTitle"
-                ></el-option>
-              </el-select> -->
             </el-form-item>
           </el-col>
           <el-col :span="24" v-if="currentConfigColumn.mapField">
             <el-form-item label="脚本">
-              <el-select v-model="currentConfigColumn.scriptName" :teleported="false" clearable>
+              <el-select
+                style="width: 220px"
+                v-model="currentConfigColumn.scriptName"
+                :teleported="false"
+                clearable
+              >
                 <el-option
                   v-for="item in scriptList"
                   :key="item.srciptName"
@@ -170,13 +177,14 @@
           <template v-for="params in currentScriptParamsList" :key="params.fliedTitle">
             <el-col :span="24">
               <el-form-item :label="params.fliedTitle">
-                <el-input v-model="scriptPs[params.filedName]" />
+                <el-input v-model="scriptPs[params.filedName]" style="width: 220px" />
               </el-form-item>
             </el-col>
           </template>
           <el-col :span="24" v-if="currentConfigColumn.scriptName">
             <el-form-item label="脚本语句">
               <el-input
+                style="width: 220px"
                 rows="3"
                 type="textarea"
                 v-model.trim="currentConfigColumn.content"
@@ -234,6 +242,9 @@ const queryParams = reactive({
 
 /**所有列映射配置 */
 const allMapConfigs = ref<Recordable>({})
+const effectConfigs = computed(() => {
+  return Object.values(allMapConfigs.value).filter((item) => item.title != '')
+})
 /**当前表单映射字段配置 */
 const currentConfigColumn = reactive({
   title: '',
@@ -274,7 +285,6 @@ const queryDict = async (code: string) => {
   statusOptions.value = data.result[code]
 }
 
-
 const popoverRef = ref()
 const buttonRef = ref()
 const popoverVisible = ref(false)
@@ -324,13 +334,26 @@ watch(
 
 const variableField = ref([])
 const allFields = computed(() => {
-  return [{
+  return [
+    {
       label: '普通字段',
-    options: orderFieldList.value,
-  }, {
+      options: orderFieldList.value.map((item) => {
+        return {
+          ...item,
+          disabled: effectConfigs.value.some((v) => v.mapField == item.filedName)
+        }
+      })
+    },
+    {
       label: '变量字段',
-    options: variableField.value,
-  }]
+      options: variableField.value.map((item) => {
+        return {
+          ...item,
+          disabled: effectConfigs.value.some((v) => v.mapField == item.filedName)
+        }
+      })
+    }
+  ]
 })
 
 /**重置popover配置表单 */