Эх сурвалжийг харах

feat(product): 优化 SKU 输入提示和格式

- 在商品列表和商品监控的编辑抽屉中添加 SKU 输入提示
WanGxC 6 сар өмнө
parent
commit
aabfe190f8

+ 10 - 0
src/views/product-manage/product-list/component/EditDrawer.vue

@@ -110,6 +110,16 @@ function mappingShopId(val: any) {
           label-width="auto"
           status-icon>
         <el-form-item class="font-medium" label="SKU:" prop="sku">
+          <template #label>
+            SKU
+            <span class="ml-4" style="color: #909399">
+            <i class="bi bi-info-circle"></i>
+            多个SKU用逗号","连接 
+            <span class="italic ml-2">
+              e.g. sku1,sku2,sku3
+            </span>
+            </span>
+          </template>
           <el-input v-model="ruleForm.sku" />
         </el-form-item>
         <el-form-item class="font-medium" label="店 铺:" prop="shop_name">

+ 16 - 5
src/views/product-manage/product-monitor/component/EditDrawer.vue

@@ -11,6 +11,7 @@ import { DictionaryStore } from '/@/stores/dictionary';
 import { useResponse } from '/@/utils/useResponse';
 import * as api from '../api';
 
+
 const { data: staticData } = DictionaryStore();
 
 const btnLoading = ref(false);
@@ -46,16 +47,16 @@ const ruleForm = reactive<RuleForm>({
   shop_id: rowData?.shop_id,
   tag: rowData?.goods.tag,
   status: rowData?.status.toString(),
-  freq: rowData?.freq,
+  freq: rowData?.freq
 });
 
 const rules = reactive<FormRules<RuleForm>>({
   sku: [ { required: true, message: '请输入SKU', trigger: 'blur' } ],
   shop: [ { required: true, message: '请输入店铺', trigger: 'blur' } ],
-  tag: [ { required: true, message: '请输入分组', trigger: 'blur' } ],
+  tag: [ { required: true, message: '请输入分组', trigger: 'blur' } ]
 });
 
-ruleForm.sku = [rowData.goods.sku, rowData.goods.sku2, rowData.goods.sku3]
+ruleForm.sku = [ rowData.goods.sku, rowData.goods.sku2, rowData.goods.sku3 ]
     .filter(Boolean)
     .join(',');
 
@@ -68,7 +69,7 @@ const submitForm = async (formEl: FormInstance | undefined) => {
     ElMessage.warning('SKU 输入不能超过三个,请检查 SKU');
     return;
   }
-  
+
   await formEl.validate(async (valid, fields) => {
     if (valid) {
       try {
@@ -113,6 +114,16 @@ function closeDrawer() {
           <el-input v-model="ruleForm.asin" :disabled="true" />
         </el-form-item>
         <el-form-item class="font-medium" label="SKU" prop="sku">
+          <template #label>
+            SKU
+            <span class="ml-4" style="color: #909399">
+            <i class="bi bi-info-circle"></i>
+            多个sku用逗号","连接 
+            <span class="italic ml-2">
+              e.g. sku1,sku2,sku3
+            </span>
+            </span>
+          </template>
           <el-input v-model="ruleForm.sku" />
         </el-form-item>
         <el-form-item class="font-medium" label="店 铺" prop="shop">
@@ -128,7 +139,7 @@ function closeDrawer() {
           </el-select>
         </el-form-item>
         <el-form-item class="font-medium" label="国 家" prop="country_code">
-          <el-select v-model="ruleForm.country_code" placeholder="请选择国家" :disabled="true">
+          <el-select v-model="ruleForm.country_code" :disabled="true" placeholder="请选择国家">
             <el-option
                 v-for="item in staticData.country_code"
                 :key="item.value"