商品mark修改

文章修改上传bug 分类下拉框换成级联
文章分类增加二级分类

src/views/orders/components/ProductList.vue

@@ -57,15 +57,22 @@
 <script setup>
 import { ref } from 'vue';
 import { listApi as managelistApi } from '@/plugins/api/shopping/manage';
-import {Plus} from "@element-plus/icons-vue";
 
 let chunkedManagelist = ref([[]]);
 const currentPage = ref(1);
 const pageSize = ref(12);
 const total = ref(0);
+let mark = ref(["店内服务","店内商品"]);
 let searchForm = ref({});
 function initFun(type, row) {
   searchForm.value ={};
+  if ("second"==type){
+    mark.value = "店内商品";
+  }else if("third"==type){
+    mark.value = "店内服务";
+  }else{
+    mark.value = ["店内服务","店内商品"];
+  }
   getData();
 }
 
@@ -88,6 +95,7 @@ function getData() {
 
   let obj = Object.assign(
       {
+        mark:mark.value,
         page: currentPage.value,
         pageSize: pageSize.value,
       },

src/views/shoppingContent/ArticleClass.vue

@@ -43,6 +43,19 @@
             />
           </template>
         </el-table-column>
+        <el-table-column prop="pid" label="上级分类" width="180">
+          <template #default="{ row }">
+
+            <el-select v-model="row.pid" clearable placeholder="上级分类"  disabled>
+              <el-option
+                v-for="item in LevelClass"
+                :key="item.id"
+                :label="item.cate_name"
+                :value="item.id"
+              />
+            </el-select>
+          </template>
+        </el-table-column>
         <el-table-column prop="sort" label="排序" />
         <el-table-column prop="created_at" label="创建时间" width="180">
         </el-table-column>
@@ -91,6 +104,21 @@ function searchFun() {
   tableData.value = [];
   getData();
 }
+let LevelClass = ref([]);
+function getOneLevelClass() {
+  listApi({pid:0}).then(res => {
+
+    LevelClass.value = res;
+    if (!LevelClass.value ){
+      LevelClass.value=[]
+    }
+    LevelClass.value.unshift({
+      id:0,
+      cate_name:'一级分类'
+    })
+  })
+
+}
 function resetFun() {
   searchForm.value = {};
   tableData.value = [];
@@ -129,6 +157,7 @@ function getData() {
     .catch(() => {
       loading.value = false;
     });
+  getOneLevelClass()
 }
 let addDialogRef = ref(null);
 function addDeptFun(type) {

src/views/shoppingContent/components/DialogClass.vue

@@ -1,30 +1,65 @@
 <template>
   <el-dialog
-    v-model="dialogVisible"
-    :title="title"
-    width="30%"
-    :before-close="handleClose"
+      v-model="dialogVisible"
+      :title="title"
+      width="30%"
+      :before-close="handleClose"
   >
     <div class="class-dialog">
       <el-form
-        inline
-        ref="ruleFormRef"
-        :model="ruleForm"
-        :rules="rules"
-        label-width="100px"
+          inline
+          ref="ruleFormRef"
+          :model="ruleForm"
+          :rules="rules"
+          label-width="100px"
       >
         <el-form-item label="分类名称" prop="cate_name">
           <el-input
-            placeholder="输入分类名称"
-            style="width: 100%"
-            v-model="ruleForm.cate_name"
+              placeholder="输入分类名称"
+              style="width: 100%"
+              v-model="ruleForm.cate_name"
           />
         </el-form-item>
 
+        <el-form-item label="上级分类" prop="pid">
+          <el-select
+              style="width: 100%"
+              placeholder="不选为一级分类"
+              v-model="ruleForm.pid"
+              filterable
+              clearable
+          >
+            <el-option
+                v-for="ele in LevelClass"
+                :key="ele.id"
+                :label="ele.cate_name"
+                :value="ele.id"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="分类logo" style="width: 100%" prop="logo">
+          <el-upload
+              action=""
+              list-type="picture-card"
+              :on-preview="handlePictureCardPreview"
+              :on-remove="handleRemove"
+              :http-request="onChange"
+              :file-list="fileList"
+              limit="1"
+          >
+            <el-icon>
+              <IEpPlus />
+            </el-icon>
+          </el-upload>
+          <el-dialog :visible.sync="loading">
+            <img width="100%" :src="ruleForm.value.logo" alt="">
+          </el-dialog>
+        </el-form-item>
+<!--                  </div>-->
         <el-form-item label="状态" prop="status">
           <el-radio-group
-            v-model="ruleForm.status"
-            :disabled="ruleForm.id ? true : false"
+              v-model="ruleForm.status"
+              :disabled="ruleForm.id ? true : false"
           >
             <el-radio :label="1">使用</el-radio>
             <el-radio :label="0">禁用</el-radio>
@@ -33,20 +68,20 @@
 
         <el-form-item label="排序" prop="sort">
           <el-input
-            placeholder="排序"
-            style="width: 100%"
-            v-model="ruleForm.sort"
+              placeholder="排序"
+              style="width: 100%"
+              v-model="ruleForm.sort"
           />
         </el-form-item>
 
         <div>
           <el-form-item label="分类描述" prop="remark" style="width: 100%">
             <el-input
-              placeholder="描述"
-              style="width: 100%"
-              type="textarea"
-              :row="2"
-              v-model="ruleForm.remark"
+                placeholder="描述"
+                style="width: 100%"
+                type="textarea"
+                :row="2"
+                v-model="ruleForm.remark"
             />
           </el-form-item>
         </div>
@@ -61,44 +96,102 @@
   </el-dialog>
 </template>
 <script setup>
-import { addApi, saveApi } from "@/plugins/api/shoppingContent/articleClass";
+import {addApi, saveApi, listApi} from "@/plugins/api/shoppingContent/articleClass";
+import {uploadImgApi} from "@/plugins/api/upload";
 
 let ruleForm = ref({});
 let rules = {
-  cate_name: [{ required: true, message: "请输入分类名称", trigger: "blur" }],
-  status: [{ required: true, message: "请选择状态", trigger: "blur" }],
+  cate_name: [{required: true, message: "请输入分类名称", trigger: "blur"}],
+  status: [{required: true, message: "请选择状态", trigger: "blur"}],
 };
 let dialogVisible = ref(false);
+
 function handleClose(done) {
   // dialogVisible.value = false;
   ElMessageBox.confirm("是否确定关闭此对话框?")
-    .then(() => {
-      done();
-    })
-    .catch(() => {
-      // catch error
-    });
+      .then(() => {
+        done();
+      })
+      .catch(() => {
+        // catch error
+      });
 }
+
 let title = ref("");
 let ruleFormRef = ref(null);
+let fileList = ref([]);
 function initFun(type, row) {
   if (ruleFormRef.value) {
     ruleFormRef.value.resetFields();
   }
-
+  getOneLevelClass()
   if (type == "add") {
     ruleForm.value = {};
     ruleForm.value.status = 1;
     title.value = "新增";
+    fileList.value = [];
   } else {
     title.value = "编辑";
     ruleForm.value = Object.assign({}, row);
+    if (ruleForm.value.logo.length>0){
+      loading.value = true;
+      fileList.value = [{
+        name: 'logo',
+        url: ruleForm.value.logo,
+        uid: Date.now().toString() // 唯一标识符
+      }];
+    }else{
+      fileList.value = [];
+    }
   }
 
   dialogVisible.value = true;
 }
 
+let LevelClass = ref([]);
+
+function getOneLevelClass() {
+  listApi({pid: 0}).then(res => {
+
+    LevelClass.value = res;
+    if (!LevelClass.value) {
+      LevelClass.value = []
+    }
+    LevelClass.value.unshift({
+      id: 0,
+      cate_name: '一级分类'
+    })
+  })
+
+}
+
+let loading = ref(false);
+
+
+function handleRemove(file, fileList) {
+  ruleForm.value.logo = "";
+}
+function handlePictureCardPreview(file) {
+  ruleForm.value.logo =  file.url;
+  loading.value = true;
+}
+function onChange(options) {
+  const formData = new FormData();
+  formData.append('file', options.file);
+  uploadImgApi(formData)
+      .then((data) => {
+        let obj = {
+          url: import.meta.env.VITE_APP_BASE_API + data.file_url,
+        };
+        ruleForm.value.logo = data.file_url;
+      })
+      .catch(() => {
+      });
+}
+
+
 const emit = defineEmits(["refreshList"]);
+
 function submit() {
   if (!ruleFormRef.value) return;
   ruleFormRef.value.validate((valid, fields) => {
@@ -120,7 +213,8 @@ function submit() {
   });
 }
 
-onMounted(() => {});
+onMounted(() => {
+});
 defineExpose({
   initFun,
 });
@@ -132,6 +226,7 @@ defineExpose({
     margin-right: 0;
     padding-right: 10px;
     box-sizing: border-box;
+
     .el-input {
       width: 100%;
     }

src/views/shoppingContent/components/DialogContent.vue

@@ -21,44 +21,32 @@
           />
         </el-form-item>
         <el-form-item label="文章分类" prop="cate_id">
-          <el-select
-            style="width: 100%"
-            v-model="ruleForm.cate_id"
-            placeholder="选择文章分类"
-          >
-            <el-option
-              v-for="item in classList"
-              :key="item.id"
-              :label="item.cate_name"
-              :value="item.id"
-            />
-          </el-select>
+          <el-cascader
+              placeholder="选择文章分类"
+              v-model="ruleForm.cate_id"
+              :options="classList"
+              :props="{ expandTrigger: 'hover' }"
+              ></el-cascader>
         </el-form-item>
 
         <div v-loading="loading" element-loading-text="上传中...">
           <el-form-item label="文章封面" style="width: 100%" prop="pic">
-            <div class="img-box" v-for="(item, i) in coverImgList" :key="i">
-              <img :src="item.url" alt="" />
-
-              <div class="occlusion">
-                <el-icon class="del" @click="coverRemove(i)">
-                  <IEpDelete />
-                </el-icon>
-              </div>
-            </div>
             <el-upload
-              action="#"
-              list-type="picture-card"
-              :auto-upload="false"
-              :show-file-list="false"
-              :file-list="coverImgList"
-              :on-change="onChange"
-              :limit="1"
+                action=""
+                list-type="picture-card"
+                :on-preview="handlePictureCardPreview"
+                :on-remove="handleRemove"
+                :http-request="onChange"
+                :file-list="fileList"
+                limit="1"
             >
               <el-icon>
                 <IEpPlus />
               </el-icon>
             </el-upload>
+            <el-dialog :visible.sync="loading2">
+              <img width="100%" :src="ruleForm.value.cover" alt="">
+            </el-dialog>
           </el-form-item>
           <el-form-item label="内容摘要" style="width: 100%">
             <el-input
@@ -112,6 +100,7 @@ const props = defineProps({
   },
 });
 let ruleForm = ref({});
+let fileList = ref([]);
 let rules = {
   name: [{ required: true, message: "请输入文章标题", trigger: "blur" }],
   cate_id: [{ required: true, message: "请选择文章分类", trigger: "change" }],
@@ -134,63 +123,60 @@ function initFun(type, row) {
     ruleFormRef.value.resetFields();
   }
   ruleForm.value = {};
-  coverImgList.value = [];
   if (type == "add") {
     ruleForm.value.status = 1;
     title.value = "新增";
     nextTick(() => {
       richPageRef.value.valueHtml = "";
     });
+    fileList.value = [];
   } else {
     title.value = "编辑";
     ruleForm.value = Object.assign({}, row);
     nextTick(() => {
       richPageRef.value.valueHtml = row.content;
     });
-    if (row.cover) {
-      coverImgList.value = [
-        {
-          url: import.meta.env.VITE_APP_BASE_API + row.cover,
-        },
-      ];
+    if (ruleForm.value.cover.length>0){
+      loading2.value = true;
+      fileList.value = [{
+        name: 'cover',
+        url: ruleForm.value.cover,
+        uid: Date.now().toString() // 唯一标识符
+      }];
+    }else{
+      fileList.value = [];
     }
+
   }
 
   dialogVisible.value = true;
 }
-// 上传图片（大）
-let coverImgList = ref([]);
+
 let loading = ref(false);
-function onChange(file) {
-  let formData = new FormData();
-  formData.append("file", file.raw);
-  loading.value = true;
-  uploadImgApi(formData)
-    .then((data) => {
-      let obj = {
-        url: import.meta.env.VITE_APP_BASE_API + data.file_url,
-      };
+let loading2 = ref(false);
 
-      if (coverImgList.value.length > 0) {
-        coverImgList.value = [];
-        coverImgList.value.push(obj);
-      } else {
-        coverImgList.value.push(obj);
-      }
-      ruleForm.value.cover = data.file_url;
-      loading.value = false;
 
-      //
-    })
-    .catch(() => {
-      loading.value = false;
-    });
-}
-
-function coverRemove(index) {
-  coverImgList.value.splice(index, 1);
+function handleRemove(file, fileList) {
   ruleForm.value.cover = "";
 }
+function handlePictureCardPreview(file) {
+  ruleForm.value.cover =  file.url;
+  loading2.value = true;
+}
+function onChange(options) {
+  const formData = new FormData();
+  formData.append('file', options.file);
+  uploadImgApi(formData)
+      .then((data) => {
+        let obj = {
+          url: import.meta.env.VITE_APP_BASE_API + data.file_url,
+        };
+        ruleForm.value.cover = data.file_url;
+      })
+      .catch(() => {
+      });
+}
+
 
 const emit = defineEmits(["refreshList"]);
 function submit() {
@@ -222,7 +208,26 @@ let richPageRef = ref(null);
 let classList = ref([]);
 function getData() {
   listApi({}).then((data) => {
-    classList.value = data;
+    if (data ) {
+      for (let item of data) {
+       if ( item.pid==0){
+         let classArr =[]
+         for (let item2 of data) {
+           if (item2.pid==item.id){
+             classArr.push({
+               value: item2.id,
+               label: item2.cate_name,
+             })
+           }
+         }
+         classList.value.push({
+           value: item.id,
+           label: item.cate_name,
+           children:classArr
+         })
+       }
+      }
+    }
   });
 }
 onMounted(() => {

src/views/system/config/page/Shop.vue

@@ -54,8 +54,8 @@
         </el-upload>
       </el-form-item>
 
-      <el-form-item label="首页背景图" :rules="[
-        { required: true, message: '上传首页背景图', trigger: 'change' },
+      <el-form-item label="产品背景图" :rules="[
+        { required: true, message: '上传产品背景图', trigger: 'change' },
       ]">
         <div class="img-box" v-for="(item, i) in mainBgList" :key="i">
           <img :src="item.url" alt="" />
@@ -74,7 +74,7 @@
         </el-upload>
       </el-form-item>
       <el-form-item label="客服微信二维码" :rules="[
-        { required: true, message: '上传首页背景图', trigger: 'change' },
+        { required: true, message: '上传客服微信二维码', trigger: 'change' },
       ]">
         <div class="img-box" v-for="(item, i) in CSWeChatList" :key="i">
           <img :src="item.url" alt="" />
@@ -92,7 +92,25 @@
           </el-icon>
         </el-upload>
       </el-form-item>
+      <el-form-item label="优惠券背景图" :rules="[
+        { required: true, message: '上传优惠券背景图', trigger: 'change' },
+      ]">
+        <div class="img-box" v-for="(item, i) in couponBgList" :key="i">
+          <img :src="item.url" alt="" />
 
+          <div class="occlusion">
+            <el-icon class="del" @click="handleRemove(9, i)">
+              <IEpDelete />
+            </el-icon>
+          </div>
+        </div>
+        <el-upload action="#" list-type="picture-card" :auto-upload="false" :show-file-list="false"
+                   :file-list="couponBgList" :on-change="onChange(9)">
+          <el-icon>
+            <IEpPlus />
+          </el-icon>
+        </el-upload>
+      </el-form-item>
       <el-form-item label="个人中心背景图" :rules="[
         { required: true, message: '上传个人中心背景图', trigger: 'change' },
       ]">
@@ -216,6 +234,10 @@ let levelBgList = ref([]);
 // 客服微信
 let CSWeChatList = ref([]);
 
+// 优惠券
+let couponBgList = ref([]);
+
+
 // 加入会员广告图
 let joinVipAdList = ref([]);
 
@@ -229,7 +251,7 @@ const onChange = (type) => {
   return (file, fileList) => {
     // 在这里，你可以通过 type 来区分是哪个上传器触发了事件
     console.log(`Uploader ${type} file changed`, file, fileList);
-    // 执行其他逻辑...  
+    // 执行其他逻辑...
     let formData = new FormData();
     formData.append("file", file.raw);
     loading.value = true;
@@ -271,15 +293,7 @@ const onChange = (type) => {
               mainBgList.value.push(obj);
             }
             break;
-          case 8:
-            // 上传首页背景图
-            if (CSWeChatList.value.length > 0) {
-              CSWeChatList.value = [];
-              CSWeChatList.value.push(obj);
-            } else {
-              CSWeChatList.value.push(obj);
-            }
-            break;
+
           case 4:
             // 个人中心背景图
             if (mineBgList.value.length > 0) {
@@ -319,6 +333,24 @@ const onChange = (type) => {
           default:
             loading.value = false;
             break;
+          case 8:
+            // 上传微信客服
+            if (CSWeChatList.value.length > 0) {
+              CSWeChatList.value = [];
+              CSWeChatList.value.push(obj);
+            } else {
+              CSWeChatList.value.push(obj);
+            }
+            break;
+          case 9:
+            // 上传优惠券
+            if (couponBgList.value.length > 0) {
+              couponBgList.value = [];
+              couponBgList.value.push(obj);
+            } else {
+              couponBgList.value.push(obj);
+            }
+            break;
         }
         loading.value = false;
         //
@@ -358,6 +390,11 @@ const handleRemove = (type, index) => {
     case 8:
       CSWeChatList.value.splice(index, 1);
       break;
+
+    case 9:
+      couponBgList.value.splice(index, 1);
+      break;
+
     default:
       break;
   }
@@ -366,9 +403,10 @@ const handleRemove = (type, index) => {
 const submit = () => {
   if (!formRef.value) return;
   formRef.value.validate((valid, fields) => {
-    const shop_bgimg = mineBgList.value && mainBgList.value.length ? mainBgList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
+    const shop_bgimg = mainBgList.value && mainBgList.value.length ? mainBgList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
     const wx_bgimg = CSWeChatList.value && CSWeChatList.value.length ? CSWeChatList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
-    const ucenter_bg = mainBgList.value && mineBgList.value.length ? mineBgList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
+    const youhuiquan_bgimg= couponBgList.value && couponBgList.value.length ? couponBgList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
+    const ucenter_bg =mineBgList.value && mineBgList.value.length ? mineBgList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
     const user_grade_bg = levelBgList.value && levelBgList.value.length ? levelBgList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
     const user_in_bg = joinVipAdList.value && joinVipAdList.value.length ? joinVipAdList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
     const shop_adimg = sharePosterList.value && sharePosterList.value.length ? sharePosterList.value[0].url.replace(import.meta.env.VITE_APP_BASE_API, '') : null
@@ -386,6 +424,10 @@ const submit = () => {
           conf_name: "wechat.cs_wechat_img",
           conf_value: wx_bgimg,
         },
+        {
+          conf_name: "wechat.cs_youhuiquan_bgimg",
+          conf_value: youhuiquan_bgimg,
+        },
         {
           conf_name: "wechat.shop_logo",
           conf_value: siteLogo.value,
@@ -472,6 +514,13 @@ const getConfigApi = () => {
         url: import.meta.env.VITE_APP_BASE_API + data.wechat.cs_wechat_img,
       });
     }
+    // 优惠券
+    if (data?.wechat?.cs_youhuiquan_bgimg) {
+      couponBgList.value = [];
+      couponBgList.value.push({
+        url: import.meta.env.VITE_APP_BASE_API + data.wechat.cs_youhuiquan_bgimg,
+      });
+    }
     // 个人中心背景图
     if (data?.wechat?.ucenter_bg) {
       mineBgList.value = [];