商品列表加渠道筛选和列表加新的展示

src/api/goods/index.js

@@ -9,7 +9,8 @@ const api = {
   add: '/goods/add',
   edit: '/goods/edit',
   delete: '/goods/delete',
-  state: '/goods/state'
+  state: '/goods/state',
+  dataList:'store/platformList',
 }
 
 // 列表记录
@@ -95,3 +96,14 @@ export function deleted (data) {
     data: data
   })
 }
+/**
+ * 获取数据授权
+ * @param {*} data
+ */
+export function getDataList (data) {
+  return axios({
+    url: api.dataList,
+    method: 'post',
+    data: data
+  })
+}

src/views/goods/Index.vue

@@ -6,13 +6,14 @@
       <a-row class="row-item-search">
         <a-form class="search-form" :form="searchForm" layout="inline" @submit="handleSearch">
           <a-form-item label="商品名称">
-            <a-input v-decorator="['goodsName']" placeholder="请输入商品名称" />
+            <a-input v-decorator="['goodsName']" class="goodsWidth" placeholder="请输入商品名称" />
           </a-form-item>
           <a-form-item label="商品编码">
-            <a-input v-decorator="['goodsNo']" placeholder="请输入商品编码" />
+            <a-input v-decorator="['goodsNo']" class="goodsWidth" placeholder="请输入商品编码" />
           </a-form-item>
           <a-form-item label="商品分类">
             <a-tree-select
+              class="goodsWidth"
               :treeData="categoryListTree"
               :dropdownStyle="{ maxHeight: '500px', overflow: 'auto' }"
               allowClear
@@ -26,6 +27,13 @@
               </a-select-option>
             </a-select>
           </a-form-item>
+          <a-form-item label="渠道">
+            <a-select @change="getChannel" placeholder="请选择">
+              <a-select-option :value="item.id" v-for="item in checkList" :key="item.id">
+                {{ item.name }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
           <a-form-item class="search-btn">
             <a-button type="primary" icon="search" html-type="submit">搜索</a-button>
           </a-form-item>
@@ -111,14 +119,24 @@
 import * as GoodsApi from '@/api/goods'
 import { ContentHeader, STable } from '@/components'
 import CategoryModel from '@/common/model/Category'
-
 // 表格表头
 const columns = [
   {
     title: '商品ID',
     dataIndex: 'goods_id',
+    width: '100px',
     sorter: true,
   },
+  {
+    title: '渠道',
+    width: '60px',
+    dataIndex: 'channel_name',
+  },
+  {
+    title: '商品编号',
+    dataIndex: 'goods_no',
+    width: '120px',
+  },
   {
     title: '商品图片',
     dataIndex: 'goods_image',
@@ -192,6 +210,7 @@ export default {
       queryParam: {
         listType: 'all',
         spec_type: '',
+        channel: '',
       },
       // 正在加载
       isLoading: false,
@@ -225,6 +244,7 @@ export default {
         { name: '单规格', val: 10 },
         { name: '多规格', val: 20 },
       ],
+      checkList: [],
     }
   },
   created() {
@@ -234,6 +254,7 @@ export default {
     }
     // 获取商品分类列表
     this.getCategoryList()
+    this.getDataList() //渠道
   },
   computed: {
     rowSelection() {
@@ -244,6 +265,17 @@ export default {
     },
   },
   methods: {
+    getChannel(val) {
+      this.queryParam.channel = val
+    },
+    getDataList() {
+      return GoodsApi.getDataList().then((result) => {
+        const obj = result.data
+        Object.keys(obj).forEach((item) => {
+          this.checkList.push({ id: item, name: obj[item] })
+        })
+      })
+    },
     onchangeSpecs(val) {
       this.queryParam.spec_type = val
     },
@@ -347,4 +379,10 @@ export default {
 .tab-list {
   margin-right: 20px;
 }
+/deep/.search-form .ant-form-item-control-wrapper {
+  min-width: 120px !important;
+}
+.goodsWidth {
+  min-width: 220px;
+}
 </style>