feat: 添加团购页面

src/router/index.js

@@ -474,6 +474,18 @@ export const asyncRouterMap = [
           keepAlive: true
         }
       },
+      {
+        path: 'groupList',
+        component: () => import('@/views/sale/groupList'),
+        name: 'groupList',
+        meta: {
+          perms: [],
+          title: '团购商品',
+          icon: 'logininfor',
+          noCache: true,
+          keepAlive: true
+        }
+      },
       {
         path: 'auctionList',
         component: () => import('@/views/sale/auctionList'),

src/views/sale/groupList.vue

+<template>
+  <div class="page_consignList">
+    <div class="filter-container">
+      <div class="button_left">
+        <el-input v-model="listQuery.name" clearable class="filter-item" style="width: 200px;" placeholder="请输入商品标题"/>
+        <el-select v-model="listQuery.isAbleSale" placeholder="请选择商品状态" class="filter-item" style="width: 200px;">
+          <el-option
+            v-for="item in options"
+            :key="item.label"
+            :label="item.label"
+            :value="item.value"
+            size="mini"/>
+        </el-select>
+        <el-button class="filter-item" type="primary" icon="el-icon-search" style="margin-left: 12px" @click="handleFilter">查找</el-button>
+        <el-button class="filter-item" type="primary" style="margin-left: 12px" @click="handleReset">重置</el-button>
+      </div>
+    </div>
+    <el-table
+      v-loading="listLoading"
+      :data="list"
+      size="small"
+      element-loading-text="正在查询中..."
+      border
+      fit
+      highlight-current-row>
+      <!--      <el-table-column align="center" label="排行" width="100px" type="index" />-->
+      <el-table-column align="center" min-width="100px" prop="id" label="商品ID" />
+      <el-table-column align="center" label="封面图" prop="itemImg">
+        <template slot-scope="scope">
+          <div class="image_preview">
+            <el-image
+              :preview-src-list="scope.row.images.split(';')"
+              :src="scope.row.images.split(';')[0]"
+              class="table-td-thumb"
+            />
+          </div>
+        </template>
+      </el-table-column>
+
+      <el-table-column align="center" label="标题" min-width="150px" prop="name">
+        <template slot-scope="scope">
+          <Line2Hidden :text="scope.row.name" />
+        </template>
+      </el-table-column>
+
+      <el-table-column align="center" label="上架类型" prop="type" >
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `${scope.row.type === 1 ? '一口价' : scope.row.type === 3 ? '帖子' : '竞拍'}` }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="平台定价" prop="distributionPrice">
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `${scope.row.distributionPrice ? `¥ ${scope.row.distributionPrice}` : '-'}` }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="供货价" prop="distributionPrice">
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `${scope.row.distributionPrice ? `¥ ${scope.row.distributionPrice}` : '-'}` }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="定金" prop="supplyPrice">
+        <template slot-scope="scope">
+          <span class="tooltip-span">{{ `${scope.row.supplyPrice ? `¥ ${scope.row.supplyPrice}` : '-'}` }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="库存" prop="stock" />
+      <el-table-column align="center" label="销量" prop="selledNum" />
+      <el-table-column align="center" label="团购时间" prop="updateTime" />
+      <el-table-column align="center" label="发布者" prop="updateTime" />
+      <el-table-column align="center" label="更新时间" prop="updateTime" />
+      <el-table-column align="center" label="状态" prop="isOnSale" min-width="100px">
+        <template slot-scope="scope" style="height: 100px">
+          <el-switch
+            v-model="scope.row.isOnSale"
+            :active-text="scope.row.isOnSale ? '上架' : '下架'"
+            style="display: block"
+            @change="handleSaleSwitch($event, scope.row)" />
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="操作" width="150" fixed="right">
+        <template slot-scope="scope">
+          <el-button
+            :disabled="(!scope.row.editAble && scope.row.type === 2)"
+            type="primary"
+            size="mini"
+            @click="handleToDetail(scope.row)">编辑
+          </el-button>
+        </template>
+      </el-table-column>
+
+    </el-table>
+
+    <Pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="listQuery.page"
+      :limit.sync="listQuery.limit"
+      @pagination="getList" />
+
+  </div>
+</template>
+
+<script>
+import Line2Hidden from '@/components/line2Hidden'
+import Pagination from '@/components/Pagination'
+import { getSaleList, updateOnSale, deleteSaleItem } from '@/api/business/sale'
+import { MessageBox } from 'element-ui'
+
+export default {
+  name: 'GroupList',
+  components: {
+    Pagination,
+    Line2Hidden
+  },
+  data() {
+    return {
+      itemKey: 0,
+      options: [{
+        value: 1,
+        label: '上架'
+      }, {
+        value: 0,
+        label: '下架'
+      }],
+      listLoading: true,
+      listQuery: {
+        page: 1,
+        limit: 20
+      },
+      list: [],
+      total: 0,
+      // 图文估价
+      imageValueDialogShow: false,
+      // 建议寄售价
+      identifyValueDialogShow: false,
+      // 货品售出
+      finishDialogShow: false,
+      // 寄售凭证
+      finishSettlementDialogShow: false,
+      // 取消
+      cancelConsignDialogShow: false,
+      currentSaleId: ''
+    }
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    handleFilter() {
+      this.listQuery.page = 1
+      this.getList()
+    },
+    handleReset() {
+      this.listQuery = {
+        page: 1,
+        limit: 20
+      }
+      this.getList()
+    },
+    handleSaleSwitch(e, item) {
+      const params = { id: item.id, isOnSale: e }
+      updateOnSale(params)
+        .then(response => {
+          this.$notify.success({
+            message: e ? '上架成功' : '下架成功'
+          })
+        })
+        .catch(response => {
+          item.isOnSale = !e
+          MessageBox.alert('业务错误：' + response.data.errmsg, '警告', {
+            confirmButtonText: '确定',
+            type: 'error'
+          })
+        })
+    },
+    handlerGetList() {
+      this.listQuery.page = 1
+      this.getList()
+    },
+    handleClick(tab, event) {
+      this.listQuery.page = 1
+      this.getList()
+    },
+    getList() {
+      localStorage.setItem('systemState', '')
+      this.listLoading = true
+      getSaleList(this.listQuery).then(response => {
+        this.list = response.data.data.dataList
+        this.total = response.data.data.total
+        this.listLoading = false
+      }).catch((e) => {
+        this.list = []
+        this.total = 0
+        this.listLoading = false
+      })
+    },
+    /**
+     * 详情
+     */
+    handleToDetail(item) {
+      this.$router.push({ path: '/sale/saleAdd', query: { id: item.id }})
+    },
+    /**
+     * 删除
+     */
+    handleDelete(item) {
+      this.$confirm('你确定删除吗?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        const data = {
+          id: item.id
+        }
+        deleteSaleItem(data).then((res) => {
+          this.$notify.success({
+            title: '成功',
+            message: '删除成功'
+          })
+          this.getList()
+        }).catch(err => {
+          this.$notify.error({
+            title: '失败',
+            message: err.data.errmsg
+          })
+        })
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+/deep/ .el-switch {
+  height: 30px;
+}
+
+/deep/ .cell {
+  display: flex;
+  justify-content: center;
+}
+
+.page_consignList {
+  padding: 20px;
+  .filter-container {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+  }
+  .image_preview {
+    width: 60px;
+    height: 60px;
+    align-content: center;
+    justify-content: center;
+  }
+}
+
+</style>

src/views/sale/itemList.vue

@@ -29,7 +29,10 @@
         </el-button>
         <el-button class="filter-item" type="primary" style="margin-left: 12px" @click="handleReset">重置</el-button>
       </div>
-      <el-button size="mini" class="filter-item" type="primary" icon="el-icon-edit" @click="handleMultiAuction">转拍卖</el-button>
+      <div>
+        <el-button size="mini" class="filter-item" type="primary" @click="handleMultiGroup">开团</el-button>
+        <el-button size="mini" class="filter-item" type="primary" icon="el-icon-edit" @click="handleMultiAuction">转拍卖</el-button>
+      </div>
     </div>
     <el-table
       v-loading="listLoading"
@@ -97,7 +100,7 @@
           <span class="tooltip-span">{{ `${scope.row.isDeleted ? '是' : '否'}` }}</span>
         </template>
       </el-table-column>
-      <el-table-column align="center" label="操作" width="260">
+      <el-table-column align="center" label="操作" width="400" fixed="right">
         <template slot-scope="scope">
           <el-button
             type="primary"
@@ -111,6 +114,13 @@
             size="mini"
             @click="handleToAuction(scope.row)">转拍卖
           </el-button>
+          <el-button
+            v-if="scope.row.status === 0"
+            :disabled="scope.row.isTransformAuction"
+            type="primary"
+            size="mini"
+            @click="handleToGroup(scope.row)">开团
+          </el-button>
           <el-button
             v-if="scope.row.status === 0"
             type="danger"
@@ -233,6 +243,24 @@ export default {
         this.handleRequestToAuction('')
       })
     },
+    /**
+     * 批量开团
+     */
+    handleMultiGroup() {
+      if (!this.selectionIdList || this.selectionIdList.length === 0) {
+        this.$notify.warning({
+          message: '请选择藏品'
+        })
+        return
+      }
+      this.$confirm('确定将选中的藏品开启团购吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.handleRequestToAuction('')
+      })
+    },
     handleFilter() {
       this.listQuery.page = 1
       this.getList()
@@ -337,6 +365,50 @@ export default {
         this.handleRequestToAuction(row.id)
       })
     },
+    /**
+     * 开团
+     */
+    handleToGroup(row) {
+      this.$confirm('确定将该藏品开启团购吗？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        this.handleRequestToAuction(row.id)
+      })
+    },
+    /**
+     * 开启团购
+     * @param this.userDetail
+     */
+    handleRequestToGroup(itemId) {
+      if (!itemId && this.selectionIdList.length === 0) {
+        return
+      }
+      const params = {
+        itemIdsStr: itemId ? String(itemId) : this.selectionIdList.join(',')
+      }
+      collectorItemConvertToAuction(params).then(response => {
+        if (itemId) {
+          this.list = this.list.filter((item) => {
+            if (item.id === itemId) {
+              item.isTransformAuction = true
+              return item
+            }
+            return item
+          })
+        } else {
+          this.getList()
+          this.selectionIdList = []
+        }
+        this.$notify.success({
+          message: '转拍品成功'
+        })
+      }).catch((e) => {
+        console.log('===报错=', e)
+        this.$message.error(e.data && e.data.errmsg || '请求失败， 请重试')
+      })
+    },
     /**
      * 转拍品
      * @param this.userDetail

src/views/sale/saleList.vue

@@ -3,7 +3,7 @@
     <div class="filter-container">
       <div class="button_left">
         <el-input v-model="listQuery.name" clearable class="filter-item" style="width: 200px;" placeholder="请输入标题"/>
-        <el-select v-model="listQuery.isAbleSale" placeholder="请选择" class="filter-item" style="width: 200px;">
+        <el-select v-model="listQuery.isAbleSale" placeholder="请选择商品状态" class="filter-item" style="width: 200px;">
           <el-option
             v-for="item in options"
             :key="item.label"