【新增】打印
This commit is contained in:
@@ -11,8 +11,23 @@
|
||||
<ai-search-bar>
|
||||
<template #left>
|
||||
<el-button type="primary" size="small" @click="chooseSkuList = [], isShow = true">添加</el-button>
|
||||
<el-button type="warning" size="small" @click="toAdd(row.url)">导入</el-button>
|
||||
<el-button type="danger" size="small" @click="toAdd(row.url)">导出</el-button>
|
||||
<el-upload
|
||||
action
|
||||
:limit="1"
|
||||
:show-file-list="false"
|
||||
accept=".xls,.xlsx"
|
||||
:auto-upload="false"
|
||||
:file-list="fileList"
|
||||
:on-change="onExcelChange">
|
||||
<el-button size="small" type="danger">Excel导入</el-button>
|
||||
</el-upload>
|
||||
<json-excel
|
||||
:data="skuList"
|
||||
:fields="jsonFields"
|
||||
name="SKU列表.xls"
|
||||
worksheet="SKU列表">
|
||||
<el-button size="small" type="warning" :disabled="!skuList.length">Excel导出</el-button>
|
||||
</json-excel>
|
||||
</template>
|
||||
<template #right>
|
||||
</template>
|
||||
@@ -25,23 +40,24 @@
|
||||
:size.sync="search.size"
|
||||
style="margin-top: 8px;"
|
||||
@getList="getList"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column slot="productName" width="300px" :show-overflow-tooltip='true' label="商品名称" fixed="left">
|
||||
<template slot-scope="scope">
|
||||
<div>
|
||||
<el-image :src="scope.row.mainImageUrl" style="width: 40px; height: 40px" class="image" :preview-src-list="[scope.row.mainImageUrl]" />
|
||||
{{ scope.row.productName }}
|
||||
</div>
|
||||
</template>
|
||||
@selection-change="handleSelectionChange"
|
||||
v-loading="pageShow">
|
||||
<el-table-column
|
||||
v-for="(item, index) in relationList"
|
||||
:key="index"
|
||||
:prop="item.field"
|
||||
:show-overflow-tooltip="true"
|
||||
:label="item.name"
|
||||
align="center">
|
||||
</el-table-column>
|
||||
<el-table-column slot="options" label="操作" align="center" fixed="right" width="240px">
|
||||
<!-- <el-table-column slot="options" label="操作" align="center" fixed="right" width="240px">
|
||||
<template v-slot="{ row }">
|
||||
<div class="table-options">
|
||||
<el-button type="text" @click="toAdd(row.url)">编辑</el-button>
|
||||
<el-button type="text" @click="toDetail(row.url)">删除</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table-column> -->
|
||||
</ai-table>
|
||||
<ai-dialog
|
||||
:visible.sync="isShow"
|
||||
@@ -94,7 +110,6 @@
|
||||
v-model="skuReqParams.SKC"
|
||||
style="width: 250px"
|
||||
size="small"
|
||||
v-throttle="() => {getSkuList()}"
|
||||
placeholder="多个查询请用户逗号分割"
|
||||
clearable
|
||||
@clear="getSkuList()"
|
||||
@@ -109,7 +124,6 @@
|
||||
v-model="skuReqParams.SKU"
|
||||
style="width: 250px"
|
||||
size="small"
|
||||
v-throttle="() => {getSkuList()}"
|
||||
placeholder="多个查询请用户逗号分割"
|
||||
clearable
|
||||
@clear="getSkuList()"
|
||||
@@ -148,23 +162,17 @@
|
||||
|
||||
<script>
|
||||
import { sendChromeAPIMessage } from '@/api/chromeApi'
|
||||
import * as XLSX from 'xlsx'
|
||||
import JsonExcel from 'vue-json-excel'
|
||||
export default {
|
||||
name: 'SkuManage',
|
||||
|
||||
components: {
|
||||
JsonExcel
|
||||
},
|
||||
|
||||
data () {
|
||||
return {
|
||||
colConfigs: [
|
||||
{ type: 'selection' },
|
||||
// { slot: 'productName', label: '商品名称', width: '300px', align: 'left', fixed: 'left' },
|
||||
// { prop: 'category', label: '分类', width: '140px', align: 'left', fixed: 'left' },
|
||||
{ prop: 'mallName', label: '店铺名称', align: 'left' },
|
||||
{ prop: 'labelCode', label: '条码编码', align: 'center' },
|
||||
// { prop: 'productSkcId', label: 'SKC', align: 'left' },
|
||||
{ prop: 'productSkuId', label: 'SKU', align: 'center' },
|
||||
// { prop: 'extCode', label: 'SKC货号', align: 'left' },
|
||||
{ prop: 'skuExtCode', label: 'SKU货号', align: 'center' },
|
||||
{ prop: 'skuSpecName', label: '次销售属性', align: 'center' }
|
||||
],
|
||||
total: 0,
|
||||
search: {
|
||||
current: 1,
|
||||
@@ -213,7 +221,11 @@
|
||||
},
|
||||
targetCatId: [],
|
||||
skuList: [],
|
||||
chooseSkuList: []
|
||||
chooseSkuList: [],
|
||||
id: '',
|
||||
fileList: [],
|
||||
pageShow: false,
|
||||
relationList: []
|
||||
}
|
||||
},
|
||||
|
||||
@@ -224,10 +236,45 @@
|
||||
}
|
||||
|
||||
return this.$store.state.mallList.filter(v => v.mallId === this.lableSearch.mallId)[0]
|
||||
},
|
||||
|
||||
colConfigs () {
|
||||
const arr = this.isShow ? [] : this.relationList.map(v => {
|
||||
return {
|
||||
prop: v.field,
|
||||
label: v.name,
|
||||
align: 'center'
|
||||
}
|
||||
})
|
||||
|
||||
return [
|
||||
{ type: 'selection' },
|
||||
{ prop: 'mallName', label: '店铺名称', align: 'left' },
|
||||
{ prop: 'productName', label: '商品名称', align: 'center' },
|
||||
{ prop: 'labelCode', label: '条码编码', align: 'center' },
|
||||
{ prop: 'productSkcId', label: 'SKC', align: 'center' },
|
||||
{ prop: 'productSkuId', label: 'SKU', align: 'center' },
|
||||
{ prop: 'skuExtCode', label: 'SKU货号', align: 'center' },
|
||||
{ prop: 'skuSpecName', label: '次销售属性', align: 'center' },
|
||||
...arr
|
||||
]
|
||||
},
|
||||
|
||||
jsonFields () {
|
||||
const obj = {}
|
||||
this.colConfigs.filter(v => !!v.prop).forEach(v => {
|
||||
obj[v.label] = v.prop
|
||||
})
|
||||
|
||||
return {
|
||||
...obj
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
created () {
|
||||
this.id = this.$route.query.id || ''
|
||||
this.getRelation()
|
||||
this.getList()
|
||||
},
|
||||
|
||||
@@ -236,6 +283,58 @@
|
||||
this.$router.push('/addLabelsTemplate')
|
||||
},
|
||||
|
||||
getRelation () {
|
||||
this.$http.post(`/api/templateRelation/getRelation?templateId=${this.$route.query.id}`).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.relationList = res.data
|
||||
|
||||
console.log(this.relationList)
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
readXLSX(file) {
|
||||
return new Promise((resolve, reject) => {
|
||||
const reader = new FileReader()
|
||||
|
||||
reader.readAsBinaryString(file)
|
||||
reader.onload = evt => {
|
||||
const data = evt.target.result
|
||||
const workbook = XLSX.read(data, { type: 'binary' })
|
||||
const ws = workbook.Sheets[workbook.SheetNames[0]]
|
||||
const jsonData = XLSX.utils.sheet_to_json(ws)
|
||||
resolve(jsonData)
|
||||
|
||||
this.fileList = []
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
onExcelChange (file) {
|
||||
this.pageShow = true
|
||||
this.readXLSX(file.raw).then(res => {
|
||||
console.log(res)
|
||||
this.$http.post(`/api/templateSku/updateBatchSku`, res.map(v => {
|
||||
const result = {
|
||||
templateId: this.id
|
||||
}
|
||||
Object.keys(this.jsonFields).forEach(item => {
|
||||
result[this.jsonFields[item]] = v[item]
|
||||
})
|
||||
|
||||
console.log(result)
|
||||
return result
|
||||
})).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$message.success('导入成功')
|
||||
this.isShow = false
|
||||
this.getList()
|
||||
}
|
||||
this.pageShow = false
|
||||
})
|
||||
})
|
||||
},
|
||||
|
||||
onSearchRest() {
|
||||
this.skuReqParams.SKC = ''
|
||||
this.skuReqParams.SKU = ''
|
||||
@@ -324,6 +423,7 @@
|
||||
mallId: this.lableSearch.mallId,
|
||||
mallName: this.currMall.mallName,
|
||||
productName: v.productName,
|
||||
productSkcId: v.labelCodeVO.productSkcId,
|
||||
productSkuId: v.labelCodeVO.productSkuId,
|
||||
labelCode: v.labelCodeVO.labelCode,
|
||||
skuExtCode: v.labelCodeVO.skuExtCode,
|
||||
@@ -362,21 +462,31 @@
|
||||
},
|
||||
|
||||
getList () {
|
||||
this.$http.post('/api/learning/pluginPage', null, {
|
||||
params: {
|
||||
...this.search
|
||||
}
|
||||
}).then(res => {
|
||||
this.$http.post(`/api/templateSku/getPage?size=-1&templateId=${this.id}`).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.tableData = res.data.records
|
||||
this.total = res.data.total
|
||||
this.skuList = res.data.records
|
||||
// this.total = res.data.total
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
onConfirm () {
|
||||
this.skuList = this.chooseSkuList
|
||||
this.isShow = false
|
||||
if (!this.chooseSkuList.length) {
|
||||
return this.$message.error('请选择SKU')
|
||||
}
|
||||
|
||||
this.$http.post(`/api/templateSku/addBatchSku`, this.chooseSkuList.map(v => {
|
||||
return {
|
||||
...v,
|
||||
templateId: this.id
|
||||
}
|
||||
})).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$message.success('添加成功')
|
||||
this.isShow = false
|
||||
this.getList()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user