|
@@ -17,12 +17,12 @@
|
|
|
</a-col>
|
|
|
<a-col :md="6" :sm="24">
|
|
|
<a-form-item label="品牌">
|
|
|
- <ProductBrand id="shoppingProductsList-productBrandSn" v-model="queryParam.productBrandSn"></ProductBrand>
|
|
|
+ <productBrand id="shoppingProductsList-productBrandSn" v-model="queryParam.productBrandSn"></productBrand>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :md="6" :sm="24">
|
|
|
<a-form-item label="产品分类">
|
|
|
- <ProductType id="shoppingProductsList-productType" placeholder="请选择产品分类" @change="changeProductType" v-model="productType"></ProductType>
|
|
|
+ <productType id="shoppingProductsList-productType" placeholder="请选择产品分类" @change="changeProductType" v-model="productType"></productType>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :md="6" :sm="24">
|
|
@@ -43,10 +43,10 @@
|
|
|
<div class="table-operator">
|
|
|
<a-button type="primary" id="shoppingProductsList-name" @click="handleAddProduct">产品导入</a-button>
|
|
|
<span>
|
|
|
- <a-button type="primary" id="shoppingProductsList-name" class="button-info" @click="handleAdd">批量上架</a-button>
|
|
|
- <a-button @click="handleAdd">批量下架</a-button>
|
|
|
- <a-button type="primary" class="button-error" id="shoppingProductsList-name" ghost @click="handleAdd">批量删除</a-button>
|
|
|
- <span>已选1项</span>
|
|
|
+ <a-button type="primary" id="shoppingProductsList-name" class="button-info" @click="changeStatus('1')">批量上架</a-button>
|
|
|
+ <a-button @click="changeStatus('0')">批量下架</a-button>
|
|
|
+ <a-button type="primary" class="button-error" id="shoppingProductsList-name" ghost @click="handleDel()">批量删除</a-button>
|
|
|
+ <span v-if="rowSelectionInfo&&rowSelectionInfo.selectedRowKeys.length>0">已选{{ rowSelectionInfo&&rowSelectionInfo.selectedRowKeys.length }}项</span>
|
|
|
</span>
|
|
|
</div>
|
|
|
<a-spin :spinning="spinning" tip="Loading...">
|
|
@@ -56,34 +56,39 @@
|
|
|
ref="table"
|
|
|
:style="{ height: tableHeight+70+'px' }"
|
|
|
size="small"
|
|
|
- :rowKey="(record) => record.no"
|
|
|
- rowKeyName="no"
|
|
|
+ :rowKey="(record) => record.shopProductSn"
|
|
|
+ rowKeyName="shopProductSn"
|
|
|
:columns="columns"
|
|
|
:data="loadData"
|
|
|
:pageSize="20"
|
|
|
+ :row-selection="{ columnWidth: 40}"
|
|
|
+ @rowSelection="rowSelectionFun"
|
|
|
:scroll="{ y: tableHeight }"
|
|
|
:defaultLoadData="false"
|
|
|
bordered>
|
|
|
<!-- 产品编码 -->
|
|
|
<template slot="productCode" slot-scope="text, record">
|
|
|
- <span style="padding-right: 15px;">{{ record.productCode }}</span>
|
|
|
- <a-badge count="热" :number-style="{ zoom:'80%' }"></a-badge>
|
|
|
+ <span style="padding-right: 6px;">{{ record.productCode }}</span>
|
|
|
+ <a-badge v-if="record.hotFlag==='1'" count="热" :number-style="{ zoom:'80%' }"></a-badge>
|
|
|
+ </template>
|
|
|
+ <!-- 产品分类 -->
|
|
|
+ <template slot="productType" slot-scope="text, record">
|
|
|
+ <span v-if="record.productTypeName2 || record.productTypeName3">{{ record.productTypeName2 }} {{ record.productTypeName3 ? '>' : '' }} {{ record.productTypeName3 }}</span>
|
|
|
+ <span v-else>--</span>
|
|
|
</template>
|
|
|
<!-- 操作 -->
|
|
|
+ <!-- v-if="$hasPermissions('B_chooseProductEdit_edit')" -->
|
|
|
<template slot="action" slot-scope="text, record">
|
|
|
<a-button
|
|
|
size="small"
|
|
|
type="link"
|
|
|
- v-if="$hasPermissions('B_chooseProductEdit_edit')"
|
|
|
- @click="handleAddEdit(record)"
|
|
|
+ @click="handleEdit(record)"
|
|
|
class="button-info"
|
|
|
:id="'chooseProductEdit-edit-btn'+record.id">编辑</a-button>
|
|
|
<a-button
|
|
|
size="small"
|
|
|
type="link"
|
|
|
- :loading="delLoading"
|
|
|
class="button-error"
|
|
|
- v-if="$hasPermissions('B_chooseProductEdit_del')"
|
|
|
@click="handleDel(record)"
|
|
|
:id="'chooseProductEdit-del-btn'+record.id">删除</a-button>
|
|
|
</template>
|
|
@@ -92,6 +97,8 @@
|
|
|
</a-card>
|
|
|
<!-- 导入产品 -->
|
|
|
<importGuideModal :openModal="openGuideModal" @close="openGuideModal=false" @ok="hanldeOk" />
|
|
|
+ <!-- 编辑 -->
|
|
|
+ <editProductModal :itemSn="itemProductSn" :openModal="openEditModal" @close="openEditModal=false" @ok="hanldeEditOk" ></editProductModal>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -100,15 +107,17 @@ import { commonMixin } from '@/utils/mixin'
|
|
|
// 组件
|
|
|
import { STable, VSelect } from '@/components'
|
|
|
import importGuideModal from './importGuideModal.vue'
|
|
|
+import editProductModal from './editProductModal.vue'
|
|
|
import productType from '@/views/common/productType.js'
|
|
|
import productBrand from '@/views/common/productBrand.js'
|
|
|
// 接口
|
|
|
-import { queryRebatePage } from '@/api/dealerRelation'
|
|
|
+import { shopProductList, saveBatchProduct, shopProductDel, shopProductUpdateStatus } from '@/api/shopProduct'
|
|
|
export default {
|
|
|
name: 'ShoppingProductsList',
|
|
|
mixins: [commonMixin],
|
|
|
- components: { STable, VSelect, importGuideModal, productType, productBrand },
|
|
|
+ components: { STable, VSelect, importGuideModal, editProductModal, productType, productBrand },
|
|
|
data () {
|
|
|
+ const _this = this
|
|
|
return {
|
|
|
spinning: false,
|
|
|
tableHeight: 0,
|
|
@@ -117,26 +126,36 @@ export default {
|
|
|
wrapperCol: { span: 16 }
|
|
|
},
|
|
|
queryParam: {
|
|
|
- dealerName: '',
|
|
|
- supDealerName: '',
|
|
|
- rebateDealerName: ''
|
|
|
+ name: '', // 产品名称
|
|
|
+ queryWord: '', // 产品编码/原厂编码
|
|
|
+ productBrandSn: undefined, // 产品品牌
|
|
|
+ productTypeSn1: '', // 产品一级分类
|
|
|
+ productTypeSn2: '', // 产品二级分类
|
|
|
+ productTypeSn3: '' // 产品三级分类
|
|
|
},
|
|
|
disabled: false, // 查询、重置按钮是否可操作
|
|
|
columns: [
|
|
|
- { title: '序号', dataIndex: 'no', width: '4%', align: 'center' },
|
|
|
- { title: '经销商名称', width: '15%', scopedSlots: { customRender: 'jxs' }, align: 'left', ellipsis: true },
|
|
|
- { title: '经销商级别', scopedSlots: { customRender: 'dealerLevel' }, align: 'left', width: '15%' },
|
|
|
- { title: '指定差价归属经销商', scopedSlots: { customRender: 'cjgs' }, align: 'left', width: '15%' },
|
|
|
- { title: '指定归属经销商级别', scopedSlots: { customRender: 'gsjxsjb' }, align: 'left', width: '15%' },
|
|
|
- { title: '上级经销商', scopedSlots: { customRender: 'sjcjgs' }, align: 'left', width: '15%' },
|
|
|
- { title: '上级经销商级别', scopedSlots: { customRender: 'sjgsjxsjb' }, align: 'left', width: '15%' },
|
|
|
- { title: '操作', scopedSlots: { customRender: 'action' }, width: '10%', align: 'center' }
|
|
|
+ { title: '序号', dataIndex: 'no', align: 'center', width: '60px' },
|
|
|
+ { title: '产品编码', dataIndex: 'productCode', width: '12%', align: 'center', scopedSlots: { customRender: 'productCode' } },
|
|
|
+ { title: '产品名称', dataIndex: 'productName', width: '16%', align: 'left', customRender: function (text) { return text || '--' }, ellipsis: true },
|
|
|
+ { title: '原厂编码', dataIndex: 'productOrigCode', align: 'center', width: '10%', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '品牌', dataIndex: 'productBrandName', align: 'center', width: '10%', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '产品分类', align: 'center', width: '15%', scopedSlots: { customRender: 'productType' } },
|
|
|
+ { title: '售价', dataIndex: 'price', width: '7%', align: 'right', customRender: function (text) { return text || text == 0 ? _this.toThousands(text, 2) : '--' } },
|
|
|
+ { title: '售价类型', dataIndex: 'priceTypeDictValue', align: 'center', width: '7%', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '终端价', dataIndex: 'terminalPrice', width: '7%', align: 'right', customRender: function (text) { return text || text == 0 ? _this.toThousands(text, 2) : '--' } },
|
|
|
+ { title: '车主价', dataIndex: 'carOwnersPrice', width: '7%', align: 'right', customRender: function (text) { return text || text == 0 ? _this.toThousands(text, 2) : '--' } },
|
|
|
+ { title: '优先级', dataIndex: 'hotSort', align: 'center', width: '7%', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '添加时间', dataIndex: 'createDate', align: 'center', width: '10%', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '产品商城状态', dataIndex: 'statusDictValue', align: 'center', width: '9%', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '操作', scopedSlots: { customRender: 'action' }, width: '15%', align: 'center' }
|
|
|
],
|
|
|
+ rowSelectionInfo: null, // 已选数据
|
|
|
// 加载数据方法 必须为 Promise 对象
|
|
|
loadData: parameter => {
|
|
|
this.disabled = true
|
|
|
this.spinning = true
|
|
|
- return queryRebatePage(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
+ return shopProductList(Object.assign(parameter, this.queryParam)).then(res => {
|
|
|
let data
|
|
|
if (res.status == 200) {
|
|
|
data = res.data
|
|
@@ -152,27 +171,139 @@ export default {
|
|
|
},
|
|
|
defaultExpandedRowKeys: [], // 树形数据默认展开项
|
|
|
openModal: false, // 新增编辑 弹框
|
|
|
- nowData: null // 当前记录数据
|
|
|
+ nowData: null, // 当前记录数据
|
|
|
+ openGuideModal: false, // 打开导入弹窗
|
|
|
+ openEditModal: false, // 打开编辑弹窗
|
|
|
+ itemProductSn: null
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
+ // 表格选中项
|
|
|
+ rowSelectionFun (obj) {
|
|
|
+ this.rowSelectionInfo = obj || null
|
|
|
+ },
|
|
|
+ // 导入产品
|
|
|
+ handleAddProduct () {
|
|
|
+ this.openGuideModal = true
|
|
|
+ },
|
|
|
+ // 批量审核
|
|
|
+ handleBatchAudit () {
|
|
|
+ const row = this.rowSelectionInfo && this.rowSelectionInfo.selectedRowKeys
|
|
|
+ if (!this.rowSelectionInfo || (row.length < 1)) {
|
|
|
+ this.$message.warning('请在列表中进行勾选!')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.handleAudit(row)
|
|
|
+ },
|
|
|
// 重置
|
|
|
resetSearchForm () {
|
|
|
- this.queryParam.dealerName = ''
|
|
|
- this.queryParam.supDealerName = ''
|
|
|
- this.queryParam.rebateDealerName = ''
|
|
|
+ this.queryParam.name = ''
|
|
|
+ this.queryParam.queryWord = ''
|
|
|
+ this.queryParam.productBrandSn = undefined
|
|
|
+ this.queryParam.productTypeSn1 = ''
|
|
|
+ this.queryParam.productTypeSn2 = ''
|
|
|
+ this.queryParam.productTypeSn3 = ''
|
|
|
this.$refs.table.refresh(true)
|
|
|
},
|
|
|
// 编辑
|
|
|
handleEdit (row) {
|
|
|
- this.nowData = row
|
|
|
- this.openModal = true
|
|
|
+ this.itemProductSn = row.shopProductSn
|
|
|
+ this.openEditModal = true
|
|
|
+ },
|
|
|
+ // 编辑成功
|
|
|
+ hanldeEditOk () {
|
|
|
+ this.itemProductSn = null
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
+ },
|
|
|
+ // 产品分类 change
|
|
|
+ changeProductType (val, opt) {
|
|
|
+ this.queryParam.productTypeSn1 = val[0] ? val[0] : ''
|
|
|
+ this.queryParam.productTypeSn2 = val[1] ? val[1] : ''
|
|
|
+ this.queryParam.productTypeSn3 = val[2] ? val[2] : ''
|
|
|
+ },
|
|
|
+ // 删除
|
|
|
+ handleDel (row) {
|
|
|
+ const _this = this
|
|
|
+ let shopProductSnList = []
|
|
|
+ if (row && Object.keys(row).length > 0) {
|
|
|
+ shopProductSnList.push(row.shopProductSn)
|
|
|
+ } else {
|
|
|
+ shopProductSnList = _this.rowSelectionInfo && _this.rowSelectionInfo.selectedRowKeys ? _this.rowSelectionInfo.selectedRowKeys : []
|
|
|
+ }
|
|
|
+ if (shopProductSnList && shopProductSnList.length == 0) {
|
|
|
+ this.$message.warning('请在列表中进行勾选!')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.confirmDel(shopProductSnList)
|
|
|
+ },
|
|
|
+ // 确认删除
|
|
|
+ confirmDel (shopProductSnList) {
|
|
|
+ const _this = this
|
|
|
+ this.$confirm({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认删除产品吗?',
|
|
|
+ centered: true,
|
|
|
+ onOk () {
|
|
|
+ _this.spinning = true
|
|
|
+ shopProductDel({ shopProductSnList }).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ _this.$message.success(res.message)
|
|
|
+ _this.$refs.table.clearSelected()
|
|
|
+ _this.$refs.table.refresh()
|
|
|
+ }
|
|
|
+ _this.spinning = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 批量上、下架
|
|
|
+ changeStatus (type) {
|
|
|
+ const row = this.rowSelectionInfo && this.rowSelectionInfo.selectedRowKeys
|
|
|
+ if (!this.rowSelectionInfo || (row.length < 1)) {
|
|
|
+ this.$message.warning('请在列表中进行勾选!')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ this.handleChangeStatus(type)
|
|
|
+ },
|
|
|
+ // 确定上、下架
|
|
|
+ handleChangeStatus (typeVal) {
|
|
|
+ const _this = this
|
|
|
+ this.$confirm({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认' + (typeVal === '0' ? '下架' : '上架') + '产品吗?',
|
|
|
+ centered: true,
|
|
|
+ onOk () {
|
|
|
+ _this.spinning = true
|
|
|
+ shopProductUpdateStatus({ shopProductSnList: _this.rowSelectionInfo.selectedRowKeys, status: typeVal }).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ _this.$message.success(res.message)
|
|
|
+ _this.$refs.table.clearSelected()
|
|
|
+ _this.$refs.table.refresh()
|
|
|
+ }
|
|
|
+ _this.spinning = false
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
// 关闭弹框
|
|
|
closeModal () {
|
|
|
this.nowData = null
|
|
|
this.openModal = false
|
|
|
},
|
|
|
+ // 导入产品成功
|
|
|
+ hanldeOk (list) {
|
|
|
+ const _this = this
|
|
|
+ _this.spinning = true
|
|
|
+ saveBatchProduct(list).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ _this.$message.success(res.message)
|
|
|
+ _this.$nextTick(() => {
|
|
|
+ _this.$refs.table.refresh(true)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ _this.spinning = false
|
|
|
+ })
|
|
|
+ },
|
|
|
pageInit () {
|
|
|
const _this = this
|
|
|
this.$nextTick(() => { // 页面渲染完成后的回调
|
|
@@ -181,7 +312,7 @@ export default {
|
|
|
},
|
|
|
setTableH () {
|
|
|
const tableSearchH = this.$refs.tableSearch.offsetHeight
|
|
|
- this.tableHeight = window.innerHeight - tableSearchH - 200
|
|
|
+ this.tableHeight = window.innerHeight - tableSearchH - 240
|
|
|
}
|
|
|
},
|
|
|
watch: {
|