product：优化商品发布页

Author: YunaiV

src/router/modules/remaining.ts

@@ -346,7 +346,7 @@ const remainingRouter: AppRouteRecordRaw[] = [
           hidden: true,
           canTo: true,
           icon: 'ep:edit',
-          title: '添加商品',
+          title: '商品添加',
           activeMenu: '/mall/product/spu'
         }
       },
@@ -359,7 +359,7 @@ const remainingRouter: AppRouteRecordRaw[] = [
           hidden: true,
           canTo: true,
           icon: 'ep:edit',
-          title: '编辑商品',
+          title: '商品编辑',
           activeMenu: '/mall/product/spu'
         }
       },

src/views/mall/product/spu/form/BasicInfoForm.vue

@@ -15,15 +15,14 @@
       </el-col>
       <el-col :span="12">
         <el-form-item label="商品分类" prop="categoryId">
-          <el-tree-select
+          <el-cascader
             v-model="formData.categoryId"
-            :data="categoryList"
+            :options="categoryList"
             :props="defaultProps"
-            check-strictly
             class="w-1/1"
-            node-key="id"
+            clearable
             placeholder="请选择商品分类"
-            @change="categoryNodeClick"
+            filterable
           />
         </el-form-item>
       </el-col>
@@ -74,8 +73,6 @@
               :value="item.id"
             />
           </el-select>
-          <!-- TODO 可能情况：善品录入后选择运费发现下拉选择中没有对应的模版 这里需不需要做添加运费模版后选择的功能 -->
-          <!-- <el-button class="ml-20px">运费模板</el-button>-->
         </el-form-item>
       </el-col>
       <el-col :span="12">
@@ -102,7 +99,7 @@
         <el-form-item label="分销类型" props="subCommissionType">
           <el-radio-group v-model="formData.subCommissionType" @change="changeSubCommissionType">
             <el-radio :label="false">默认设置</el-radio>
-            <el-radio :label="true" class="radio">自行设置</el-radio>
+            <el-radio :label="true" class="radio">单独设置</el-radio>
           </el-radio-group>
         </el-form-item>
       </el-col>
@@ -117,7 +114,7 @@
           />
         </el-form-item>
         <el-form-item v-if="formData.specType" label="商品属性">
-          <el-button class="mb-10px mr-15px" @click="attributesAddFormRef.open">添加规格</el-button>
+          <el-button class="mb-10px mr-15px" @click="attributesAddFormRef.open">添加属性</el-button>
           <ProductAttributes :propertyList="propertyList" @success="generateSkus" />
         </el-form-item>
         <template v-if="formData.specType && propertyList.length > 0">
@@ -139,7 +136,7 @@
 
   <!-- 情况二：详情 -->
   <Descriptions v-if="isDetail" :data="formData" :schema="allSchemas.detailSchema">
-    <template #categoryId="{ row }"> {{ categoryString(row.categoryId) }}</template>
+    <template #categoryId="{ row }"> {{ formatCategoryName(row.categoryId) }}</template>
     <template #brandId="{ row }">
       {{ brandList.find((item) => item.id === row.brandId)?.name }}
     </template>
@@ -150,7 +147,7 @@
       {{ row.specType ? '多规格' : '单规格' }}
     </template>
     <template #subCommissionType="{ row }">
-      {{ row.subCommissionType ? '自行设置' : '默认设置' }}
+      {{ row.subCommissionType ? '单独设置' : '默认设置' }}
     </template>
     <template #picUrl="{ row }">
       <el-image :src="row.picUrl" class="h-60px w-60px" @click="imagePreview(row.picUrl)" />
@@ -206,17 +203,17 @@ const ruleConfig: RuleConfig[] = [
   {
     name: 'price',
     rule: (arg) => arg >= 0.01,
-    message: '商品销售价格必须大于等于 0.01 ！！！'
+    message: '商品销售价格必须大于等于 0.01 元！！！'
   },
   {
     name: 'marketPrice',
     rule: (arg) => arg >= 0.01,
-    message: '商品市场价格必须大于等于 0.01 ！！！'
+    message: '商品市场价格必须大于等于 0.01 元！！！'
   },
   {
     name: 'costPrice',
     rule: (arg) => arg >= 0.01,
-    message: '商品成本价格必须大于等于 0.01 ！！！'
+    message: '商品成本价格必须大于等于 0.01 元！！！'
   }
 ]
 
@@ -359,23 +356,11 @@ const onChangeSpec = () => {
 }
 
 const categoryList = ref([]) // 分类树
-/**
- * 选择分类时触发校验
- */
-const categoryNodeClick = () => {
-  if (!checkSelectedNode(categoryList.value, formData.categoryId)) {
-    formData.categoryId = null
-    message.warning('必须选择二级及以下节点！！')
-  }
-}
-/**
- * 获取分类的节点的完整结构
- *
- * @param categoryId 分类id
- */
-const categoryString = (categoryId) => {
+/** 获取分类的节点的完整结构 */
+const formatCategoryName = (categoryId) => {
   return treeToString(categoryList.value, categoryId)
 }
+
 const brandList = ref([]) // 精简商品品牌列表
 const deliveryTemplateList = ref([]) // 运费模版
 onMounted(async () => {

src/views/mall/product/spu/form/OtherSettingsForm.vue

@@ -41,7 +41,7 @@
         </el-form-item>
       </el-col>
       <el-col :span="24">
-        <!--   TODO tag展示暂时不考虑排序 -->
+        <!--   TODO @puhui999：tag展示暂时不考虑排序；支持拖动排序 -->
         <el-form-item label="活动优先级">
           <el-tag>默认</el-tag>
           <el-tag class="ml-2" type="success">秒杀</el-tag>