瀏覽代碼

feat: 修改

linwenxin 1 年之前
父節點
當前提交
9f713a9dbc
共有 1 個文件被更改,包括 150 次插入128 次删除
  1. 150 128
      src/views/mallManagement/goods/newclassify_set/index.vue

+ 150 - 128
src/views/mallManagement/goods/newclassify_set/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="app-container" >
+  <div class="app-container">
     <el-page-header @back="goBack" content="分类配置" style="margin-bottom: 20px"></el-page-header>
     <el-divider></el-divider>
 
@@ -19,12 +19,12 @@
         </el-form-item>
       </el-form>
     </div>
-    
+
     <div class="btn-group">
       <el-button size="small" type="primary" @click="addClassify" v-if="mainForm.goodsType === 1">选择分类</el-button>
       <el-button size="small" type="primary" @click="addGoods">选择商品</el-button>
     </div>
-  
+
     <div class="diy-table" v-if="mainForm.goodsType === 1">
       <div class="table-head clearfix">
         <div class="item goods">商品名称</div>
@@ -42,25 +42,29 @@
         <div class="blank">操作</div>
       </div>
       <div class="goods-item" v-for="(item, index) in goodsList" :key="index">
-        <div class="goods-info" >
+        <div class="goods-info">
           <img :src="item.imgUrl" alt="" />
           {{ item.goodsName }}
         </div>
         <div class="spec-list">
           <div class="spec-item" v-for="(it, idx) in item.goodsSpecs" :key="idx">
-            <div class="col name">{{it.name}}-{{it.specValue}}</div>
+            <div class="col name">{{ it.name }}-{{ it.specValue }}</div>
             <div class="col input"><el-input disabled type="number" size="small" v-model="it.orgPrice"></el-input></div>
             <div class="col input"><el-input disabled type="number" size="small" v-model="it.price"></el-input></div>
-            <div class="col input"><el-input disabled type="number" size="small" v-model="it.shareAmount"></el-input></div>
-            <div class="col input"><el-input disabled type="number" size="small" v-model="it.innerSharePercent"></el-input></div>
-            <div class="col input"><el-input disabled type="number" size="small" v-model="it.innerShareAmount"></el-input></div>
-            <div class="col input"><el-input disabled type="number" size="small" v-model="it.innerSharePercent"></el-input></div>
+            <div class="col input"><el-input disabled type="number" size="small" v-model="it.shareAmount"></el-input>
+            </div>
+            <div class="col input"><el-input disabled type="number" size="small"
+                v-model="it.innerSharePercent"></el-input></div>
+            <div class="col input"><el-input disabled type="number" size="small" v-model="it.innerShareAmount"></el-input>
+            </div>
+            <div class="col input"><el-input disabled type="number" size="small"
+                v-model="it.innerSharePercent"></el-input></div>
             <div class="col input"><el-input disabled type="number" size="small" v-model="it.stockNum"></el-input></div>
             <div class="col input"><el-input disabled type="number" size="small" v-model="it.soldNum"></el-input></div>
           </div>
         </div>
         <div class="operation">
-          <el-button type="text" style="color: #f56c6c" @click="deleteGoods(item.goodsId,index)">删除</el-button>
+          <el-button type="text" style="color: #f56c6c" @click="deleteGoods(item.goodsId, index)">删除</el-button>
         </div>
       </div>
       <div class="empty-text" v-if="goodsList.length < 1">暂无数据</div>
@@ -68,33 +72,32 @@
 
     <div v-if="mainForm.goodsType === 2" style="margin-top: 20px">
       <el-table :data="goodsList" border fit highlight-current-row stripe>
-          <el-table-column align="center" label="商品图片" prop="imgUrl" width="85">
-            <template slot-scope="scope">
-              <el-image style="width: 60px; height: 60px; display: block;" :src="scope.row.imgUrl" :preview-src-list="[scope.row.imgUrl]" fit="cover"></el-image>
-            </template>
-          </el-table-column>
-          <el-table-column align="center" label="商品名称" prop="goodsName" min-width="200"></el-table-column>
-          <el-table-column align="center" label="最低销售价" prop="packageMinAmount" min-width="120" sortable></el-table-column>
-          <el-table-column align="center" label="最低分佣金额" prop="packageMinShareAmount" min-width="130" sortable></el-table-column>
-          <el-table-column align="center" label="库存" prop="stockNum" min-width="110"></el-table-column>
-          <el-table-column align="center" label="销量" prop="soldNum" min-width="110"></el-table-column>
-
-          <el-table-column align="center" label="操作" width="80" fixed="right">
-            <template slot-scope="scope">
-              <el-button type="text" style="color: #f56c6c" @click="deleteGoods(scope.row.goodsId, scope.$index)">删除</el-button>
-            </template>
-          </el-table-column>
-        </el-table>
+        <el-table-column align="center" label="商品图片" prop="imgUrl" width="85">
+          <template slot-scope="scope">
+            <el-image style="width: 60px; height: 60px; display: block;" :src="scope.row.imgUrl"
+              :preview-src-list="[scope.row.imgUrl]" fit="cover"></el-image>
+          </template>
+        </el-table-column>
+        <el-table-column align="center" label="商品名称" prop="goodsName" min-width="200"></el-table-column>
+        <el-table-column align="center" label="最低销售价" prop="packageMinAmount" min-width="120" sortable></el-table-column>
+        <el-table-column align="center" label="最低分佣金额" prop="packageMinShareAmount" min-width="130"
+          sortable></el-table-column>
+        <el-table-column align="center" label="库存" prop="stockNum" min-width="110"></el-table-column>
+        <el-table-column align="center" label="销量" prop="soldNum" min-width="110"></el-table-column>
+
+        <el-table-column align="center" label="操作" width="80" fixed="right">
+          <template slot-scope="scope">
+            <el-button type="text" style="color: #f56c6c"
+              @click="deleteGoods(scope.row.goodsId, scope.$index)">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
     </div>
-    
+
     <div class="page-footer">
       <div class="footer">
-        <el-button
-          type="primary"
-          @click="submitMainForm"
-          :loading="formLoading"
-          >{{ formLoading ? "提交中 ..." : "提 交" }}</el-button
-        >
+        <el-button type="primary" @click="submitMainForm" :loading="formLoading">{{ formLoading ? "提交中 ..." : "提 交"
+        }}</el-button>
         <el-button @click="goBack">关 闭</el-button>
       </div>
     </div>
@@ -106,44 +109,36 @@
           <div class="item" @click="changeClassify('')">全部分类</div>
           <div class="group" v-for="(item, index) in classifyList" :key="index">
             <div class="item" @click="toggleOpen(index)">
-              <i :class="item.isOpen ? 'el-icon-caret-bottom':'el-icon-caret-right'"></i> {{item.name}}
+              <i :class="item.isOpen ? 'el-icon-caret-bottom' : 'el-icon-caret-right'"></i> {{ item.name }}
             </div>
             <div class="child" v-if="item.isOpen">
-              <div class="item" v-for="(childItem, childIndex) in item.children" :key="childIndex" @click="changeClassify(childItem.categoryId)">{{childItem.name}}</div>
+              <div class="item" v-for="(childItem, childIndex) in item.children" :key="childIndex"
+                @click="changeClassify(childItem.categoryId)">{{ childItem.name }}</div>
             </div>
           </div>
         </div>
 
         <div class="right fl">
           <div class="search">
-            <el-input placeholder="请输入商品名称进行搜索" v-model="keyword" class="input-with-select" clearable size="small" style="width: 250px">
+            <el-input placeholder="请输入商品名称进行搜索" v-model="keyword" class="input-with-select" clearable size="small"
+              style="width: 250px">
               <el-button slot="append" icon="el-icon-search" size="small" @click="getGoodsListByScreen"></el-button>
             </el-input>
           </div>
           <div class="table" style="margin: 10px 0 20px;">
-            <el-table 
-              v-loading="table_listLoading" 
-              :data="table_dataList" 
-              element-loading-text="Loading" 
-              tooltip-effect="dark" 
-              style="width: 100%" 
-              max-height="270"
-              @selection-change="handleChooseGoods">
+            <el-table v-loading="table_listLoading" :data="table_dataList" element-loading-text="Loading"
+              tooltip-effect="dark" style="width: 100%" max-height="270" @selection-change="handleChooseGoods">
               <el-table-column align="center" type="selection" :selectable='checkboxSelect' width="45"></el-table-column>
-              <el-table-column align="center" prop="goodsName" label="商品名称" min-width="200" show-overflow-tooltip></el-table-column>
+              <el-table-column align="center" prop="goodsName" label="商品名称" min-width="200"
+                show-overflow-tooltip></el-table-column>
               <el-table-column align="center" prop="goodsPrice" label="价格" width="80"></el-table-column>
               <el-table-column align="center" prop="stockNum" label="库存" width="80"></el-table-column>
             </el-table>
           </div>
           <div class="pagination clearfix">
             <div class="fr">
-              <el-pagination
-                @current-change="handleTableCurrentChange"
-                :current-page="table_currentPage"
-                :page-size="table_pageSize"
-                background
-                layout="prev, pager, next"
-                :total="table_listTotal">
+              <el-pagination @current-change="handleTableCurrentChange" :current-page="table_currentPage"
+                :page-size="table_pageSize" background layout="prev, pager, next" :total="table_listTotal">
               </el-pagination>
             </div>
           </div>
@@ -157,19 +152,14 @@
     </el-dialog>
 
     <!-- 选择分类 -->
-    <el-dialog title="选择分类" :visible.sync="addClassifyVisible" :show-close="false" width="40%" :close-on-click-modal="false">
+    <el-dialog title="选择分类" :visible.sync="addClassifyVisible" :show-close="false" width="40%"
+      :close-on-click-modal="false">
       <div class="classify-list">
-        <el-tree
-          :data="classifyList"
-          show-checkbox
-          default-expand-all
-          node-key="categoryId"
-          ref="tree"
-          highlight-current
+        <el-tree :data="classifyList" show-checkbox default-expand-all node-key="categoryId" ref="tree" highlight-current
           :props="defaultProps">
         </el-tree>
       </div>
-      
+
       <div slot="footer" class="dialog-footer">
         <el-button type="primary" @click="submitAddClassify">保 存</el-button>
         <el-button @click="cancelAddClassify">取 消</el-button>
@@ -179,7 +169,7 @@
 </template>
 
 <script>
-import { getactivityGoodsDetail,addActiveGoods,getEnterpriseTemplate, getClassifyList, getGoodsList, getMoreGoodsList } from "@/api/special";
+import { getactivityGoodsDetail, addActiveGoods, getEnterpriseTemplate, getClassifyList, getGoodsList, getMoreGoodsList } from "@/api/special";
 export default {
   data() {
     return {
@@ -189,8 +179,8 @@ export default {
       useTemplate: "",
       formLoading: false,
       mainForm: {
-        mainTitle:"", // 主标题
-        subtitle:"", // 副标题
+        mainTitle: "", // 主标题
+        subtitle: "", // 副标题
         goodsType: 1,
       },
       mainFormRules: {
@@ -226,42 +216,42 @@ export default {
     };
   },
   computed: {
-    
+
   },
-  created(){
+  created() {
     const { item } = this.$route.query;
     this.mainForm.mainTitle = item.mainTitle;
     this.mainForm.subtitle = item.subTitle;
     this.mainForm.goodsType = item.type;
     this.objectId = item.goodsNewsCategoryId
-    
+
     this.getEnterpriseTemplate()
     this.getactivityGoodsDetail()
   },
 
   methods: {
     // 添加活动商品
-    addActiveGoods(params){
-      addActiveGoods(params).then(res=>{
-        if(res.code==200){
+    addActiveGoods(params) {
+      addActiveGoods(params).then(res => {
+        if (res.code == 200) {
           this.$router.go(-1)
         }
       })
     },
 
     //获取企业下模板
-    getEnterpriseTemplate(){
+    getEnterpriseTemplate() {
       this.companyWechatId = JSON.parse(
         localStorage.getItem("greemall_user")
       ).companyWechatId;
-      this.useTemplate=JSON.parse(
+      this.useTemplate = JSON.parse(
         localStorage.getItem("greemall_user")
       ).useTemplate;
-      const parmas={
+      const parmas = {
         companyId: this.companyWechatId
       }
-      getEnterpriseTemplate(parmas).then(res=>{
-        console.log('获取企业下模板',res)
+      getEnterpriseTemplate(parmas).then(res => {
+        console.log('获取企业下模板', res)
       })
     },
 
@@ -272,23 +262,23 @@ export default {
         type: 1, // 类型: 1=新维度分类,2=首页弹窗,3=活动专区1,4=活动专区2左侧,5=活动专区2右侧,6=专场专区1,7=专场专区2,8=专场专区3,9=专场专区4
       };
       getactivityGoodsDetail(params).then((res) => {
-        res.data.activeGoodsList.forEach(item=> {
-          item.imgUrl = item.goods.imgUrl
+        res.data.activeGoodsList.forEach(item => {
+          item.imgUrl = item?.goods?.imgUrl || ""
         });
-        
+
         this.goodsList = res.data.activeGoodsList;
 
-        if(this.mainForm.goodsType === 2) {
+        if (this.mainForm.goodsType === 2) {
           this.goodsList.forEach((item, index) => {
-            this.$set(this.goodsList, index, {...item, ...item.goods});
+            this.$set(this.goodsList, index, { ...item, ...(item?.goods || {}) });
           })
         }
       });
     },
 
     // 删除商品
-    deleteGoods(item,index){
-      this.goodsList.splice(index,1)
+    deleteGoods(item, index) {
+      this.goodsList.splice(index, 1)
     },
 
     // 返回
@@ -298,13 +288,13 @@ export default {
 
     // 获取分类列表
     getClassifyList(state) {
-      getClassifyList({categoryLevel: 1, status: true}).then(res => {
+      getClassifyList({ categoryLevel: 1, status: true }).then(res => {
         res.data.forEach(item => {
           item.isOpen = false;
         });
         this.classifyList = res.data;
         this.classifyCurrent = '';
-        if(!state) {
+        if (!state) {
           this.getGoodsList();
         }
       })
@@ -317,7 +307,7 @@ export default {
 
     // 切换分类
     changeClassify(cid) {
-      if(this.table_chooseGoods.length > 0) {
+      if (this.table_chooseGoods.length > 0) {
         return this.$errorMsg('当前已选择商品,不可切换分类');
       }
       this.classifyCurrent = cid;
@@ -327,7 +317,7 @@ export default {
 
     // 搜索
     getGoodsListByScreen() {
-      if(this.table_chooseGoods.length > 0) {
+      if (this.table_chooseGoods.length > 0) {
         return this.$errorMsg('当前已选择商品,不可搜索');
       }
       this.table_currentPage = 1;
@@ -345,19 +335,19 @@ export default {
       }).then(res => {
         let oldGoodsList = this.goodsList;
         let newGoodsList = res.data.records;
-        for(let i = 0; i < oldGoodsList.length; i++) {
+        for (let i = 0; i < oldGoodsList.length; i++) {
           let oldItem = oldGoodsList[i]
-          for(let j = 0; j < newGoodsList.length; j++) {
+          for (let j = 0; j < newGoodsList.length; j++) {
             let newItem = newGoodsList[j]
-            if(newItem.goodsId === oldItem.goodsId){
+            if (newItem.goodsId === oldItem.goodsId) {
               newGoodsList[j].selected = true;
               break;
             }
           }
         }
-        for(let j = 0; j < newGoodsList.length; j++) {
+        for (let j = 0; j < newGoodsList.length; j++) {
           let newItem = newGoodsList[j]
-          if(newItem.promotionGroup === true){
+          if (newItem.promotionGroup === true) {
             newGoodsList[j].selected = true;
           }
         }
@@ -368,17 +358,17 @@ export default {
     },
 
     // 查询重复值并禁选
-    checkboxSelect (row, rowIndex) {
+    checkboxSelect(row, rowIndex) {
       if (row.selected) {
         return false // 禁用
-      }else{
+      } else {
         return true // 不禁用
       }
     },
 
     // 更改列表当前页
     handleTableCurrentChange(val) {
-      if(this.table_chooseGoods.length > 0) {
+      if (this.table_chooseGoods.length > 0) {
         return this.$errorMsg('当前已选择商品,不可切换分页');
       }
       this.table_currentPage = val;
@@ -397,7 +387,7 @@ export default {
     },
 
     // 取消 选择商品
-    cancelAddGoods(){
+    cancelAddGoods() {
       this.addGoodsVisible = false;
     },
 
@@ -416,35 +406,35 @@ export default {
     },
 
     // 取消 选择分类
-    cancelAddClassify(){
+    cancelAddClassify() {
       this.addClassifyVisible = false;
     },
 
     // 提交 选择分类
     submitAddClassify() {
-      if(this.$refs.tree.getCheckedNodes().length <= 0) {
+      if (this.$refs.tree.getCheckedNodes().length <= 0) {
         return this.$errorMsg('请选择分类');
       }
       let checkeds = this.$refs.tree.getCheckedNodes();
       let ids = [];
       checkeds.forEach(item => {
-        if(item.level === 2) {
+        if (item.level === 2) {
           ids.push(item.categoryId);
         }
       })
-      getMoreGoodsList({ categoryIds: ids.join(',')}).then(res => {
+      getMoreGoodsList({ categoryIds: ids.join(',') }).then(res => {
         let oldGoodsList = this.goodsList;
         let newGoodsList = [];
         res.data.forEach(item => {
-          if(item.promotionGroup === false) {
+          if (item.promotionGroup === false) {
             newGoodsList.push(item);
           }
         })
         let allGoodsList = oldGoodsList.concat(newGoodsList);
         let showGoodsList = [];
         let obj = {};
-        for(var i =0; i<allGoodsList.length; i++){
-          if(!obj[allGoodsList[i].goodsId]){
+        for (var i = 0; i < allGoodsList.length; i++) {
+          if (!obj[allGoodsList[i].goodsId]) {
             showGoodsList.push(allGoodsList[i]);
             obj[allGoodsList[i].goodsId] = true;
           }
@@ -472,9 +462,9 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-
 .form-container {
   margin-top: 40px;
+
   // padding: 0 6%;
   .title {
     font-size: 16px;
@@ -482,8 +472,10 @@ export default {
     padding-left: 10px;
     font-weight: bold;
   }
+
   .tips {
     margin-top: 10px;
+
     span {
       display: inline-block;
       width: 300px;
@@ -494,16 +486,19 @@ export default {
       color: #f66460;
     }
   }
+
   .tips2 {
     font-size: 12px;
     color: #999999;
     line-height: 30px;
   }
+
   .container {
     padding: 10px 20px 0;
     background: #f5f5f5;
     border-radius: 10px;
   }
+
   .addBtn {
     padding: 10px 0;
   }
@@ -518,8 +513,10 @@ export default {
   // margin-left: 77px;
   // min-width: 1185px;
   max-width: 100%;
+
   .table-head {
     display: flex;
+
     .item {
       height: 40px;
       line-height: 40px;
@@ -529,6 +526,7 @@ export default {
       background: #f5f5f5;
       text-align: center;
     }
+
     .right {
       float: left;
       width: 94%;
@@ -536,23 +534,28 @@ export default {
       flex-shrink: 0;
       height: 40px;
     }
+
     .goods {
       width: 20%;
       min-width: 250px;
     }
+
     .name {
       width: 11.1111%;
       min-width: 100px;
     }
+
     .input {
       width: 11.1111%;
       min-width: 100px;
     }
+
     .opera {
       width: 11.1111%;
       min-width: 80px;
       // text-align: right;
     }
+
     .blank {
       width: 6%;
       min-width: 90px;
@@ -563,9 +566,11 @@ export default {
       line-height: 40px;
     }
   }
+
   .goods-item {
     display: flex;
     align-content: center;
+
     .goods-info {
       flex-shrink: 0;
       width: 20%;
@@ -576,9 +581,11 @@ export default {
       border-bottom: 1px solid #f5f5f5;
       border-right: 1px solid #f5f5f5;
       font-size: 14px;
+
       &:last-child {
         border-bottom: none;
       }
+
       img {
         width: 40px;
         height: 40px;
@@ -586,21 +593,26 @@ export default {
         flex-shrink: 0;
       }
     }
+
     .spec-list {
       width: 94%;
       min-width: 1150px;
       border-bottom: 1px solid #f5f5f5;
       border-right: 1px solid #f5f5f5;
+
       &:last-child {
         border-bottom: none;
       }
+
       .spec-item {
         display: flex;
         align-items: center;
         border-bottom: 1px solid #f5f5f5;
+
         &:last-child {
           border-bottom: none;
         }
+
         .col {
           flex-shrink: 0;
           height: 50px;
@@ -609,26 +621,31 @@ export default {
           justify-content: center;
           padding: 0 10px;
           border-right: 1px solid #f5f5f5;
+
           &:last-child {
             border-right: none;
           }
         }
+
         .name {
           width: 11.1111%;
           min-width: 100px;
           font-size: 14px;
           text-align: center;
         }
+
         .input {
           width: 11.1111%;
           min-width: 100px;
         }
+
         .btn {
           width: 11.1111%;
           min-width: 80px;
         }
       }
     }
+
     .operation {
       flex-shrink: 0;
       width: 6%;
@@ -641,6 +658,7 @@ export default {
       border-right: 1px solid #f5f5f5;
     }
   }
+
   .empty-text {
     line-height: 60px;
     text-align: center;
@@ -648,34 +666,38 @@ export default {
   }
 }
 
-  .dialog-container {
-    .left {
-      width: 140px;
-      height: 350px;
-      overflow-y: scroll;
-      .group {
-        margin-top: 10px;
-      }
-      .child {
-        margin-top: 5px;
-        .item {
-          padding-left: 18px;
-        }
-      }
+.dialog-container {
+  .left {
+    width: 140px;
+    height: 350px;
+    overflow-y: scroll;
+
+    .group {
+      margin-top: 10px;
+    }
+
+    .child {
+      margin-top: 5px;
+
       .item {
-        cursor: pointer;
-        line-height: 24px;
+        padding-left: 18px;
       }
     }
-    .right {
-      width: calc(100% - 140px);
-      height: 350px;
-      box-sizing: border-box;
-      padding-left: 20px;
+
+    .item {
+      cursor: pointer;
+      line-height: 24px;
     }
   }
 
-  ::v-deep .el-form-item__label{
-    margin-left: 0px !important;
+  .right {
+    width: calc(100% - 140px);
+    height: 350px;
+    box-sizing: border-box;
+    padding-left: 20px;
   }
-</style>
+}
+
+::v-deep .el-form-item__label {
+  margin-left: 0px !important;
+}</style>