code review：门店自提、快递运费

src/views/mall/trade/delivery/expressTemplate/ExpressTemplateForm.vue

@@ -89,7 +89,7 @@
         <el-table border style="width: 100%" :data="formData.templateFree">
           <el-table-column align="center" label="区域">
             <template #default="{ row }">
-              <!--   区域数据太多，用赖加载方式，要不然性能有问题 -->
+              <!-- 区域数据太多，用赖加载方式，要不然性能有问题 -->
               <el-tree-select
                 v-model="row.areaIds"
                 multiple
@@ -171,7 +171,10 @@ const formRules = reactive({
   sort: [{ required: true, message: '分类排序不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
-const areaCache = ref([]) //由于区域节点懒加载，已选区域节点需要缓存展示
+const areaCache = ref([]) // 由于区域节点懒加载，已选区域节点需要缓存展示
+// TODO @jason：配送的时候，只允许选择省市级别，不允许选择区；如果这样的话，是不是打开弹窗，直接把城市都请求过来；
+// TODO @jaosn：因为只有省市两级，感觉就不用特殊做全国逻辑；选择全国，就默认把子节点都选择上；另外，选择父节点，要把子节点选中哈；
+
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
@@ -204,9 +207,9 @@ const open = async (type: string, id?: number) => {
         }
         item.freePrice = fenToYuan(item.freePrice)
       })
-      //已选的区域节点
+      // 已选的区域节点
       const areaIds = chargeAreaIds.concat(freeAreaIds)
-      //区域节点，懒加载方式。 已选节点需要缓存展示
+      // 区域节点，懒加载方式。已选节点需要缓存展示
       areaCache.value = await getAreaListByIds(areaIds.join(','))
     }
   } finally {
@@ -226,8 +229,9 @@ const submitForm = async () => {
   formLoading.value = true
   try {
     const data = formData.value as DeliveryExpressTemplateApi.DeliveryExpressTemplateVO
+    // 前端价格以元展示，提交到后端。用分计算
+    // TODO @jason：不能直接这样改，要复制出来改。不然后端操作失败，数据已经被改了
     data.templateCharge.forEach((item) => {
-      //前端价格以元展示，提交到后端。用分计算
       item.startPrice = yuanToFen(item.startPrice)
       item.extraPrice = yuanToFen(item.extraPrice)
     })
@@ -248,6 +252,7 @@ const submitForm = async () => {
     formLoading.value = false
   }
 }
+
 /** 重置表单 */
 const resetForm = () => {
   formData.value = {
@@ -269,6 +274,7 @@ const resetForm = () => {
   columnTitle.value = columnTitleMap.get(1)
   formRef.value?.resetFields()
 }
+
 /** 配送计费方法改变 */
 const changeChargeMode = (chargeMode: number) => {
   columnTitle.value = columnTitleMap.get(chargeMode)
@@ -276,6 +282,24 @@ const changeChargeMode = (chargeMode: number) => {
 const defaultArea = [{ id: 1, name: '全国', disabled: false }]
 
 /** 初始化数据 */
+// TODO @jason：是不是不用写这样一个初始化方法，columnTitleMap 直接就可以了呀
+// const columnTitleMap = {
+//   '1': {
+//     startCountTitle: '首件',
+//     extraCountTitle: '续件',
+//     freeCountTitle: '包邮件数'
+//   },
+//   '2': {
+//     startCountTitle: '首件重量(kg)',
+//     extraCountTitle: '续件重量(kg)',
+//     freeCountTitle: '包邮重量(kg)'
+//   },
+//   '3': {
+//     startCountTitle: '首件体积(m³)',
+//     extraCountTitle: '续件体积(m³)',
+//     freeCountTitle: '包邮体积(m³)'
+//   }
+// }
 const initData = async () => {
   // TODO 从服务端全量加载数据， 后面看懒加载是不是可以从前端获取数据。 目前从后端获取数据
   // formLoading.value = true
@@ -286,7 +310,7 @@ const initData = async () => {
   // } finally {
   //   formLoading.value = false
   // }
-  //表头标题和计费方式的映射
+  // 表头标题和计费方式的映射
   columnTitleMap.set(1, {
     startCountTitle: '首件',
     extraCountTitle: '续件',
@@ -320,6 +344,7 @@ const loadChargeArea = async (node, resolve) => {
     const item = data[0]
     if (areaIds.includes(item.id)) {
       // TODO 禁止选中的区域有些问题， 导致修改时候不能重新选择 不知道如何处理。 暂时注释掉 @芋艿 有空瞅瞅
+      // TODO @jason：先不做这个功能哈。
       //item.disabled = true
     }
     resolve(data)
@@ -357,10 +382,11 @@ const loadFreeArea = async (node, resolve) => {
   } else {
     const id = node.data.id
     const data = await getChildrenArea(id)
-    //已选区域需要禁止再次选择
+    // 已选区域需要禁止再次选择
     data.forEach((item) => {
       if (areaIds.includes(item.id)) {
         // TODO 禁止选中的区域有些问题， 导致修改时候不能重新选择 不知道如何处理。 暂时注释掉 @芋艿 有空瞅瞅
+        // TODO @jason：先不做这个功能哈。
         //item.disabled = true
       }
     })
@@ -378,11 +404,13 @@ const addChargeArea = () => {
     extraPrice: 1
   })
 }
+
 /** 删除计费区域 */
 const deleteChargeArea = (index) => {
   const data = formData.value
   data.templateCharge.splice(index, 1)
 }
+
 /** 添加包邮区域 */
 const addFreeArea = () => {
   const data = formData.value
@@ -392,6 +420,7 @@ const addFreeArea = () => {
     freePrice: 1
   })
 }
+
 /** 删除包邮区域 */
 const deleteFreeArea = (index) => {
   const data = formData.value

src/views/mall/trade/delivery/expressTemplate/index.vue

@@ -110,6 +110,7 @@ const queryParams = reactive({
   chargeMode: undefined
 })
 const queryFormRef = ref() // 搜索的表单
+
 /** 查询列表 */
 const getList = async () => {
   loading.value = true

src/views/mall/trade/delivery/pickUpStore/PickUpStoreForm.vue

@@ -51,7 +51,7 @@
       <el-row>
         <el-col :span="12">
           <el-form-item label="门店所在地区" prop="areaId">
-            <el-cascader v-model="formData.areaId" :options="areaList" :props="cascaderProps" />
+            <el-cascader v-model="formData.areaId" :options="areaList" :props="areaTreeProps" />
           </el-form-item>
         </el-col>
         <el-col :span="12">
@@ -99,7 +99,7 @@
         </el-col>
       </el-row>
       <el-form-item label="获取经纬度">
-        <el-button type="primary" @click="searchLocation">获取</el-button>
+        <el-button type="primary" @click="mapDialogVisible.value = true">获取</el-button>
       </el-form-item>
     </el-form>
     <template #footer>
@@ -125,6 +125,7 @@ import { getAreaTree } from '@/api/system/area'
 import * as ConfigApi from '@/api/infra/config'
 const { t } = useI18n() // 国际化
 const message = useMessage() // 消息弹窗
+
 const dialogVisible = ref(false) // 弹窗的是否展示
 const mapDialogVisible = ref(false) // 地图弹窗的是否展示
 const dialogTitle = ref('') // 弹窗的标题
@@ -160,14 +161,15 @@ const formRules = reactive({
   status: [{ required: true, message: '开启状态不能为空', trigger: 'blur' }]
 })
 const formRef = ref() // 表单 Ref
-const cascaderProps = {
+const areaTreeProps = {
   children: 'children',
   label: 'name',
   value: 'id',
   emitPath: false
 }
 const areaList = ref() // 区域树
-const tencentLbsUrl = ref('') //腾讯位置服务 url
+const tencentLbsUrl = ref('') // 腾讯位置服务 url
+
 /** 打开弹窗 */
 const open = async (type: string, id?: number) => {
   dialogVisible.value = true
@@ -196,7 +198,6 @@ const submitForm = async () => {
   // 提交请求
   formLoading.value = true
   try {
-    console.log('formData.value', formData.value)
     const data = formData.value as DeliveryPickUpStoreApi.DeliveryPickUpStoreVO
     if (formType.value === 'create') {
       await DeliveryPickUpStoreApi.createDeliveryPickUpStore(data)
@@ -222,7 +223,7 @@ const resetForm = () => {
     logo: '',
     detailAddress: '',
     introduction: '',
-    areaId: 1,
+    areaId: undefined,
     openingTime: undefined,
     closingTime: undefined,
     latitude: undefined,
@@ -232,11 +233,7 @@ const resetForm = () => {
   formRef.value?.resetFields()
 }
 
-//查找位置
-const searchLocation = async () => {
-  mapDialogVisible.value = true
-}
-// 选择经纬度
+/** 选择经纬度 */
 const selectAddress = function (loc: any): void {
   if (loc.latlng && loc.latlng.lat) {
     formData.value.latitude = loc.latlng.lat
@@ -246,6 +243,7 @@ const selectAddress = function (loc: any): void {
   }
   mapDialogVisible.value = false
 }
+
 /** 初始化数据 */
 const initData = async () => {
   formLoading.value = true
@@ -255,6 +253,7 @@ const initData = async () => {
   } finally {
     formLoading.value = false
   }
+  // TODO @jason：要不创建一个 initTencentLbsMap
   window.selectAddress = selectAddress
   window.addEventListener(
     'message',
@@ -262,7 +261,7 @@ const initData = async () => {
       // 接收位置信息，用户选择确认位置点后选点组件会触发该事件，回传用户的位置信息
       let loc = event.data
       if (loc && loc.module === 'locationPicker') {
-        // 防止其他应用也会向该页面post信息，需判断module是否为'locationPicker'
+        // 防止其他应用也会向该页面 post 信息，需判断 module 是否为 'locationPicker'
         window.parent.selectAddress(loc)
       }
     },

src/views/mall/trade/delivery/pickUpStore/index.vue

@@ -121,6 +121,7 @@ import { dateFormatter } from '@/utils/formatTime'
 import download from '@/utils/download'
 const message = useMessage() // 消息弹窗
 const { t } = useI18n() // 国际化
+
 const total = ref(0) // 列表的总页数
 const loading = ref(true) // 列表的加载中
 const exportLoading = ref(false) // 导出的加载中
@@ -134,6 +135,7 @@ const queryParams = reactive({
   createTime: []
 })
 const queryFormRef = ref() // 搜索的表单
+
 /** 添加/修改操作 */
 const formRef = ref()
 const openForm = (type: string, id?: number) => {
@@ -153,7 +155,7 @@ const handleDelete = async (id: number) => {
   } catch {}
 }
 
-//** 查询列表 */
+/** 查询列表 */
 const getList = async () => {
   loading.value = true
   try {