فهرست منبع

Merge branch 'feature/轮播图商品调整'

pengyh 1 سال پیش
والد
کامیت
3e54e4d3b0
1فایلهای تغییر یافته به همراه144 افزوده شده و 15 حذف شده
  1. 144 15
      src/views/mallManagement/configCenter/slideshowConfig/index.vue

+ 144 - 15
src/views/mallManagement/configCenter/slideshowConfig/index.vue

@@ -30,6 +30,56 @@
           <el-button size="mini" @click="formConfirm(data.removeTab)" type="primary">确 定</el-button>
         </div>
       </div>
+	  <el-dialog
+	      width="50%"
+	      title="商品列表"
+	      :visible.sync="innerVisible"
+	      append-to-body>
+	      <el-input v-model="search" placeholder="输入名称搜索">
+	        <el-button slot="append" icon="el-icon-search" @click="searchGoods()"></el-button>
+	      </el-input>
+	      <div class="table" style="margin-top: 10px">
+	        <el-table
+	          :data="goodsList"
+	          height="400px"
+	          style="width: 100%">
+	          <el-table-column align="center">
+	            <template slot="header"></template>
+	            <template slot-scope="scope">
+	              <el-button type="primary" size="small" @click="selGoods(scope.row)" :disabled="scope.row.promotionGroup" >选择</el-button>
+	            </template>
+	          </el-table-column>
+	          <el-table-column label="商品名称" prop="goodsName"></el-table-column>
+	          <el-table-column label="商品图片" prop="imgUrl" align="center">
+	            <template slot-scope="scope">
+	              <div class="demo-image__preview">
+	                <el-image style="width: 40px; height: 40px" :src="scope.row.imgUrl" :preview-src-list="[scope.row.imgUrl]">
+	                  <div slot="error" class="image-slot">
+	                    <i class="el-icon-picture-outline"></i>
+	                  </div>
+	                </el-image>
+	              </div>
+	            </template>
+	          </el-table-column>
+	        </el-table>
+	      </div>
+	      <div class="pagination clearfix">
+	        <div class="fr">
+	          <el-pagination
+	            @size-change="innerHandleSizeChange"
+	            @current-change="innerHandleCurrentChange"
+	            :current-page="innerCurrentPage"
+	            :page-sizes="[10, 20, 30, 50]"
+	            :page-size="10"
+	            layout="total, sizes, prev, pager, next, jumper"
+	            :total="innerListTotal">
+	          </el-pagination>
+	        </div>
+	      </div>
+		  <div slot="footer" class="dialog-footer">
+		    <el-button @click="innerVisible = false">取 消</el-button>
+		  </div>
+	    </el-dialog>
     </template>
   </zj-tab-page>
 </template>
@@ -76,15 +126,23 @@ export default {
         imgSrc: [],
         state: true,
         sortNum: '',
-		port: '',
+		port: 'SHOP',
         type: '',
         goodsId: '',
         appId: '',
-        linkUrl: ''
+        linkUrl: '',
+		selGoodsName: '',
+		goodsId: ''
       },
       goodsList: [],
       formType: 'add',
-      formVisible: false
+      formVisible: false,
+	  innerCurrentPage: 1, // 内联当前页码
+	  innerPageSize: 10, // 内联每页数量
+	  innerListTotal: 0, // 内联列表总数
+	  innerVisible: false,
+	  goodsList: [],
+	  search: '',
     }
   },
   computed: {
@@ -157,6 +215,7 @@ export default {
 		  },
 		   events: {
 			   change: e=>{
+				   this.clearGoodsId()
 				   if(e=='YJHX'){
 					   this.formData.type = 4
 				   }else{
@@ -166,7 +225,7 @@ export default {
 		   }
 		},
         {
-          md: 8,
+          md: 6,
           isShow: true,
           name: 'slot-component',
       //     options: [
@@ -197,15 +256,40 @@ export default {
               {
                 md: 6,
                 isShow: true,
-                name: 'el-select',
+                name: 'slot-component',
                 options: this.goodsList,
-                attributes: { filterable: true, placeholder: '请选择' },
+                attributes: {  },
                 formItemAttributes: {
-                  label: '选择活动',
+                  label: '链接商品',
                   prop: 'goodsId',
                   rules: []
-                }
-              }
+                },
+				render: (h, { props, onInput }) => {
+				  var { value } = props
+				  return (
+						<div>
+							<el-button type="primary" onClick={()=>{
+								console.log(11)
+								this.showGoods()
+							}} size="small">查找商品</el-button>
+							<el-button onClick={()=>{
+								this.clearGoodsId()
+							}} size="small">清除</el-button>
+						</div>
+					)
+				}
+              },
+				{
+				  md: 6,
+				  isShow: true,
+				  name: 'el-input',
+				  attributes: { placeholder: '请输入',disabled: true },
+				  formItemAttributes: {
+				    label: '链接商品名称',
+				    prop: 'goodsName',
+				    rules: []
+				  }
+				},
             ]
           } else if (this.formData.type == 2) {
             this.formData.goodsId = ''
@@ -364,12 +448,15 @@ export default {
                 })
                 getGoodsList({
                   pageNum: 1,
-                  pageSize: -1
+                  pageSize: -1,
+				  goodsId: res.data.goodsId,
                 }).then(res => {
-                  this.goodsList = res.data.records.map(item => ({
-                    value: item.goodsId,
-                    label: item.goodsName
-                  }))
+                  // this.goodsList = res.data.records.map(item => ({
+                  //   value: item.goodsId,
+                  //   label: item.goodsName
+                  // }))
+				  this.formData.goodsId = res.data.records[0].goodsId
+				  this.formData.goodsName = res.data.records[0].goodsName
                 })
               })
             }
@@ -418,7 +505,49 @@ export default {
       } else {
         this.$errorMsg('请选择要删除的轮播图')
       }
-    }
+    },
+		showGoods() {
+		  this.search = '';
+		  this.innerVisible = true
+		  this.showGoodsList()
+		},
+		clearGoodsId() {
+		  this.formData.goodsId = ''
+		  this.formData.goodsName = ''
+		},
+		searchGoods() {
+		  this.innerCurrentPage = 1;
+		  this.showGoodsList()
+		},
+		selGoods(row) {
+		  this.innerVisible = false
+		  this.search = ''
+		  this.formData.goodsId = row.goodsId
+		  this.formData.goodsName = row.goodsName
+		},
+		showGoodsList() {
+		  let params = {
+		    goodsName: this.search,
+		    pageNum: this.innerCurrentPage,
+		    pageSize: this.innerPageSize
+		  };
+		  getGoodsList(params).then(res => {
+		    this.goodsList = res.data.records;
+		    this.innerListTotal = res.data.total;
+		  })
+		},
+		// 更改内嵌每页数量
+		innerHandleSizeChange(val) {
+		  this.innerPageSize = val;
+		  this.innerCurrentPage = 1;
+		  this.showGoodsList();
+		},
+		
+		// 更改内嵌当前页
+		innerHandleCurrentChange(val) {
+		  this.innerCurrentPage = val;
+		  this.showGoodsList();
+		},
   }
 }
 </script>