【新增】打印组件

This commit is contained in:
yanran200830
2024-10-25 15:31:01 +08:00
parent 4d0cc14001
commit a51a0d49bc
6 changed files with 288 additions and 253 deletions

View File

@@ -356,7 +356,7 @@ table.hiprint-printElement-tableTarget {
width: 100%;
height: 100%;
padding: 10pt 10pt;
border: 1pt solid #000;
border: 2pt solid #000;
}
.temuBarCode-code {
@@ -364,19 +364,19 @@ table.hiprint-printElement-tableTarget {
height: 100%;
}
.temuBarCode-code svg {
width: 100%;
}
.temuBarCode-top,
.temuBarCode-bottom {
display: flex;
align-items: center;
justify-content: space-between;
width: 90%;
width: 93%;
}
.temuBarCode-middle {
width: 80%;
width: 85%;
height: 60%;
}
.temuBarCode-code svg {
width: 100%;
}

View File

@@ -1,6 +1,6 @@
<template>
<div class="print">
<div class="print-wrapper">
<div class="print-wrapper" v-if="!isPrint">
<div class="left">
<div class="left-wrapper">
<div class="title">基础元素</div>
@@ -126,7 +126,6 @@
<script>
import { hiprint, defaultElementTypeProvider, disAutoConnect } from 'vue-plugin-hiprint'
import { newHiprintPrintTemplate } from '@/utils/template-helper'
import printData from './printData'
import { customProvider } from './customProvider'
disAutoConnect()
@@ -138,6 +137,41 @@
default: () => {
return []
}
},
printData: {
type: Object,
default: () => {
return {
}
}
},
template: {
type: Object,
default: () => {
return {
"index": 0,
"name": 1,
"height": 200,
"width": 200,
"paperHeader": 0,
"paperFooter": 547,
"printElements": [],
"paperNumberLeft": 500,
"paperNumberTop": 530,
"paperNumberDisabled": true,
"paperNumberContinue": true,
"fontFamily": "Microsoft YaHei",
"scale": 1,
"watermarkOptions": {}
}
}
},
isPrint: {
type: Boolean,
default: false
}
},
@@ -209,8 +243,14 @@
providers: [defaultElementTypeProvider(), customProvider({})]
})
this.buildLeftElement()
this.buildDesigner()
if (this.isPrint) {
this.hiprintTemplate = newHiprintPrintTemplate('temulables', {
template: this.template
})
} else {
this.buildLeftElement()
this.buildDesigner()
}
},
methods: {
@@ -280,7 +320,7 @@
// eslint-disable-next-line no-undef
$('#hiprint-printTemplate').empty()
this.hiprintTemplate = newHiprintPrintTemplate('temulables', {
template: {},
template: this.template,
settingContainer: '#PrintElementOptionSetting',
onImageChooseClick: (target) => {
let input = document.createElement('input')
@@ -302,26 +342,11 @@
this.$nextTick(() => {
this.hiprintTemplate.design('#hiprint-printTemplate', {
!this.isPrint && this.hiprintTemplate.design('#hiprint-printTemplate', {
grid: true
})
this.panel = this.hiprintTemplate.printPanels[0]
console.log(this.hiprintTemplate.printPanels[0])
// this.hiprintTemplate.printPanels[0].addPrintText({
// type: 'text',
// data: 'XS888888888',
// options: {
// field: 'barcode',
// testData: 'XS888888888',
// height: 32,
// fontSize: 12,
// lineHeight: 18,
// textAlign: 'left',
// textType: 'barcode',
// hideTitle: true
// }
// })
// this.panel = this.hiprintTemplate.printPanels[0]
})
},
@@ -348,16 +373,12 @@
},
print() {
let options = { leftOffset: 0, topOffset: 0 }
let ext = {
callback: () => {
console.log('浏览器打印窗口已打开')
},
this.hiprintTemplate.print(this.printData)
},
styleHandler: () => {
return '<style></style>'
}
}
// js打印不显示设计界面
toPrint (template, printData) {
this.hiprintTemplate.update(template)
this.hiprintTemplate.print(printData)
},
@@ -373,13 +394,13 @@
},
savePdf() {
this.hiprintTemplate.toPdf(printData, '测试导出pdf').then(v => {
this.hiprintTemplate.toPdf(this.printData, '测试导出pdf',{scale:2 }).then(v => {
console.log(v)
})
},
getHtml() {
this.html = this.elementToString(this.hiprintTemplate.getHtml(printData))
this.html = this.elementToString(this.hiprintTemplate.getHtml(this.printData))
this.isShowPreview = true
},

View File

@@ -6,26 +6,8 @@ export default {
"height": 200,
"width": 200,
"paperHeader": 0,
"paperFooter": 566.9291338582677,
"paperFooter": 547,
"printElements": [
{
"options": {
"left": 188,
"top": 36,
"height": 40,
"width": 9,
"right": 219,
"bottom": 144.75,
"vCenter": 214.5,
"hCenter": 99.75,
"coordinateSync": false,
"widthHeightSync": false
},
"printElementType": {
"title": "竖线",
"type": "vline"
}
},
{
"options": {
"left": 253.5,
@@ -44,6 +26,24 @@ export default {
"type": "vline"
}
},
{
"options": {
"left": 188,
"top": 36,
"height": 40,
"width": 9,
"right": 219,
"bottom": 144.75,
"vCenter": 214.5,
"hCenter": 99.75,
"coordinateSync": false,
"widthHeightSync": false
},
"printElementType": {
"title": "竖线",
"type": "vline"
}
},
{
"options": {
"left": 370.5,
@@ -143,11 +143,11 @@ export default {
},
{
"options": {
"left": 187.5,
"left": 253.5,
"top": 37,
"height": 18,
"width": 66,
"title": "Date:",
"width": 117,
"title": "Dec1,2023",
"coordinateSync": false,
"widthHeightSync": false,
"fontFamily": "Microsoft YaHei",
@@ -167,11 +167,11 @@ export default {
},
{
"options": {
"left": 253.5,
"left": 187.5,
"top": 37,
"height": 18,
"width": 117,
"title": "Dec1,2023",
"width": 66,
"title": "Date:",
"coordinateSync": false,
"widthHeightSync": false,
"fontFamily": "Microsoft YaHei",
@@ -527,6 +527,30 @@ export default {
"type": "text"
}
},
{
"options": {
"left": 13.5,
"top": 74.5,
"height": 20,
"width": 103.5,
"title": "Manufacturer",
"right": 116.25,
"bottom": 112.5,
"vCenter": 64.5,
"hCenter": 103.5,
"coordinateSync": false,
"widthHeightSync": false,
"fontFamily": "Microsoft YaHei",
"fontWeight": "700",
"textContentVerticalAlign": "middle",
"contentPaddingLeft": 3.75,
"qrCodeLevel": 0
},
"printElementType": {
"title": "文本",
"type": "text"
}
},
{
"options": {
"left": 279,
@@ -545,6 +569,24 @@ export default {
"type": "vline"
}
},
{
"options": {
"left": 370.5,
"top": 74.5,
"height": 21,
"width": 9,
"right": 379.9921875,
"bottom": 114.75,
"vCenter": 375.4921875,
"hCenter": 104.25,
"coordinateSync": false,
"widthHeightSync": false
},
"printElementType": {
"title": "竖线",
"type": "vline"
}
},
{
"options": {
"left": 13.5,
@@ -564,48 +606,6 @@ export default {
"type": "hline"
}
},
{
"options": {
"left": 370.5,
"top": 74.5,
"height": 21,
"width": 9,
"right": 379.9921875,
"bottom": 114.75,
"vCenter": 375.4921875,
"hCenter": 104.25,
"coordinateSync": false,
"widthHeightSync": false
},
"printElementType": {
"title": "竖线",
"type": "vline"
}
},
{
"options": {
"left": 13.5,
"top": 74.5,
"height": 20,
"width": 103.5,
"title": "Manufacturer",
"right": 116.25,
"bottom": 112.5,
"vCenter": 64.5,
"hCenter": 103.5,
"coordinateSync": false,
"widthHeightSync": false,
"fontFamily": "Microsoft YaHei",
"fontWeight": "700",
"textContentVerticalAlign": "middle",
"contentPaddingLeft": 3.75,
"qrCodeLevel": 0
},
"printElementType": {
"title": "文本",
"type": "text"
}
},
{
"options": {
"left": 117,
@@ -1050,16 +1050,12 @@ export default {
},
{
"options": {
"left": 24,
"top": 384,
"left": 21,
"top": 387,
"height": 120,
"width": 292.5,
"elId": "barCode-1729657391988",
"formatter": "function (data, options, templateData) {\n console.log(data, options, templateData);\n const elId = options.elId || 'barCode-' + new Date().getTime();\n const codeWidth = parseInt((options.width - 22) * 0.85);\n options.elId = `${elId}`;\n\n // eslint-disable-next-line no-undef\n $('body').append(`<div id=\"codewrapper-${elId}\" style=\"width: ${codeWidth}pt\">\n <svg id=\"${elId}\" width=\"100%\" display=\"block\" height=\"100%\" class=\"hibarcode_imgcode\" preserveAspectRatio=\"none slice\"></svg>\n </div>`);\n // eslint-disable-next-line no-undef\n JsBarcode('#' + elId, '96778555251', {\n format: \"CODE128B\",\n width: 2,\n height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,\n margin: 0,\n displayValue: false\n });\n\n // eslint-disable-next-line no-undef\n const codeHtml = $(`#codewrapper-${elId}`).html();\n // eslint-disable-next-line no-undef\n $(`body>#codewrapper-${elId}`).remove();\n // eslint-disable-next-line no-undef\n const resizeObserver = new ResizeObserver(() => {\n JsBarcode('#' + elId, '96778555251', {\n format: \"CODE128B\",\n width: 2,\n height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,\n margin: 0,\n displayValue: false\n });\n });\n setTimeout(() => {\n const node = document.getElementById(`temuBarCode-${elId}`);\n if (node) {\n resizeObserver.observe(node);\n }\n }, 0);\n var html = `\n <div class=\"temuBarCode\" id=\"temuBarCode-${elId}\">\n <div class=\"temuBarCode-top\">\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">(AA+AAA)*20PCS</div>\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">AA 20PCS+AAA 20PCS</div>\n </div>\n <div class=\"temuBarCode-middle\">\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content temuBarCode-code\" style=\"width: 100%\">\n ${codeHtml}\n </div>\n </div>\n <div class=\"temuBarCode-bottom\">\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">1034130097</div>\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">Made in China</div>\n </div>\n </div>\n `;\n return html;\n }",
"right": 289.5,
"bottom": 504,
"vCenter": 156.75,
"hCenter": 444
"width": 316,
"elId": "barCode-1729837262980",
"formatter": "function (data, options, templateData) {\n console.log(data, options, templateData);\n const elId = options.elId || 'barCode-' + new Date().getTime();\n const codeWidth = parseInt((options.width - 22) * 0.85);\n options.elId = `${elId}`;\n\n // eslint-disable-next-line no-undef\n $('body').append(`<div id=\"codewrapper-${elId}\" style=\"width: ${codeWidth}pt\">\n <svg id=\"${elId}\" width=\"100%\" display=\"block\" height=\"100%\" class=\"hibarcode_imgcode\" preserveAspectRatio=\"none slice\"></svg>\n </div>`);\n // eslint-disable-next-line no-undef\n JsBarcode('#' + elId, '96778555251', {\n format: \"CODE128B\",\n width: 2,\n height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,\n margin: 0,\n displayValue: false\n });\n\n // eslint-disable-next-line no-undef\n const codeHtml = $(`#codewrapper-${elId}`).html();\n // eslint-disable-next-line no-undef\n $(`body>#codewrapper-${elId}`).remove();\n // eslint-disable-next-line no-undef\n const resizeObserver = new ResizeObserver(() => {\n JsBarcode('#' + elId, '96778555251', {\n format: \"CODE128B\",\n width: 2,\n height: parseInt(hinnn.pt.toPx(options.height - 22).toString()) * 0.6,\n margin: 0,\n displayValue: false\n });\n });\n setTimeout(() => {\n const node = document.getElementById(`temuBarCode-${elId}`);\n if (node) {\n resizeObserver.observe(node);\n }\n }, 0);\n var html = `\n <div class=\"temuBarCode\" id=\"temuBarCode-${elId}\">\n <div class=\"temuBarCode-top\">\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">(AA+AAA)*20PCS</div>\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">AA 20PCS+AAA 20PCS</div>\n </div>\n <div class=\"temuBarCode-middle\">\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content temuBarCode-code\" style=\"width: 100%\">\n ${codeHtml}\n </div>\n </div>\n <div class=\"temuBarCode-bottom\">\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">1034130097</div>\n <div class=\"hiprint-printElement-text-content hiprint-printElement-content\">Made in China</div>\n </div>\n </div>\n `;\n return html;\n }"
},
"printElementType": {
"title": "temu条码",
@@ -1067,11 +1063,12 @@ export default {
}
}
],
"paperNumberLeft": 0,
"paperNumberTop": 520,
"paperNumberLeft": 500,
"paperNumberTop": 530,
"paperNumberDisabled": true,
"paperNumberContinue": true,
"fontFamily": "Microsoft YaHei",
"scale": 1,
"watermarkOptions": {}
}
]

View File

@@ -1,13 +1,15 @@
<template>
<AiDetail class="add-label">
<template #title>
<ai-title title="添加标签" isShowBack :isShowBottomBorder="true" @onBackClick="cancel">
<ai-title title="添加模板" isShowBack :isShowBottomBorder="true" @onBackClick="cancel">
<template #rightBtn>
<label>模板名称</label>
<el-input placeholder="请输入模板名称" size="small" v-model="name" style="width: 200px; margin-right: 300px;"></el-input>
<el-button @click="preview" size="small" type="danger">预览</el-button>
<el-button @click="savePdf" size="small" type="primary">下载pdf</el-button>
<el-button @click="saveTemplate" size="small" type="primary">保存</el-button>
<el-button @click="print" size="small">打印</el-button>
<el-button @click="clearPaper" size="small" type="danger">清空纸张</el-button>
<el-button @click="saveTemplate" size="small" type="primary">保存</el-button>
</template>
</ai-title>
</template>
@@ -15,7 +17,7 @@
<ai-card title="标签模板" class="card" :hideTitle="true">
<template #content>
<div class="add-label__wrapper">
<Print ref="printRef" :labels="labels"></Print>
<Print ref="printRef" :template="template" :isPrint="false"></Print>
</div>
</template>
</ai-card>
@@ -25,6 +27,7 @@
<script>
import Print from '@/components/print/Print'
import template from '@/components/print/template'
export default {
components: {
@@ -33,7 +36,8 @@
data () {
return {
labels: []
name: '',
template: template
}
},
@@ -55,6 +59,10 @@
},
saveTemplate () {
if (!this.name) {
return this.$message.error('模板名称不能为空')
}
const json = this.$refs.printRef.exportJson()
console.log(json)
},

View File

@@ -2,45 +2,98 @@
<ai-list class="Learning">
<ai-title
slot="title"
title="新手园地"
title="标签打印"
isShowBottomBorder>
</ai-title>
<template slot="content">
<ai-search-bar>
<template #left>
<el-radio-group v-model="search.categoryId" @change="onChange">
<el-radio-button label="">全部</el-radio-button>
<el-radio-button label="isFavorite">我的收藏</el-radio-button>
<el-radio-button :label="item.id" :key="item.id" v-for="item in cateList">{{ item.name }}</el-radio-button>
</el-radio-group>
</template>
<template #right>
</template>
</ai-search-bar>
<div class="search-item__wrapper">
<div class="left">
<div class="search-item">
<label>添加方式</label>
<el-radio-group v-model="type" size="small" @change="onSearchRest">
<el-radio-button label="1">按备货单打印</el-radio-button>
<el-radio-button label="2">按SKC打印</el-radio-button>
<el-radio-button label="3">按SKU打印</el-radio-button>
</el-radio-group>
</div>
<div class="search-item">
<label>店铺</label>
<el-select v-model="search.mallId" placeholder="请选择店铺" size="small">
<el-option
v-for="item in $store.state.mallList"
:key="item.mallId"
:label="item.mallName"
:value="item.mallId">
</el-option>
</el-select>
</div>
</div>
<div class="right"></div>
</div>
<div class="search-item__wrapper">
<div class="left">
<div class="search-item" v-show="addType === '1'">
<label>备货单</label>
<el-button style="margin-left: 10px;" @click="onCateChange" size="small" :disabled="!search.mallId" :loading="isLoading">查询</el-button>
</div>
<div class="search-item" v-show="addType === '2'">
<label>SKC</label>
<el-input
v-model="search.SKC"
style="width: 250px"
size="small"
placeholder="多个查询请用户逗号分割"
clearable
suffix-icon="iconfont iconSearch">
</el-input>
<el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!search.mallId" :loading="isLoading">查询</el-button>
</div>
<div class="search-item" v-show="addType === '3'">
<label>SKU</label>
<el-input
v-if="addType === '3'"
v-model="search.SKU"
style="width: 250px"
size="small"
clearable
placeholder="多个查询请用户逗号分割"
suffix-icon="iconfont iconSearch">
</el-input>
<el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!search.mallId" :loading="isLoading">查询</el-button>
</div>
</div>
</div>
<ai-table
:tableData="tableData"
:col-configs="colConfigs"
:total="total"
:current.sync="search.current"
:size.sync="search.size"
style="margin-top: 8px;"
:isShowPagination="false"
@getList="getList">
<el-table-column slot="options" label="操作" align="center" fixed="right" width="140px">
<template v-slot="{ row }">
<div class="table-options">
<el-button type="text" @click="collection(row.id, row.isFavorite)">{{ row.isFavorite === '0' ? '收藏' : '取消收藏' }}</el-button>
<el-button type="text">打印</el-button>
<el-button type="text" @click="toDetail(row.url)">详情</el-button>
</div>
</template>
</el-table-column>
</ai-table>
<Print ref="printRef" :isPrint="true"></Print>
</template>
</ai-list>
</template>
<script>
import Print from '@/components/print/Print'
export default {
name: 'Learning',
name: 'PrintPage',
components: {
Print
},
data () {
return {
@@ -49,83 +102,27 @@
{ prop: 'createTime', label: '发布时间', align: 'center' },
],
tableData: [],
total: 0,
search: {
current: 1,
size: 10,
categoryId: ''
mallId: '',
SKC: '',
SKU: ''
},
cateList: [],
isFavorite: 0
type: '1',
isLoading: false
}
},
created () {
this.$store.dispatch('getUserInfo').then(e => {
console.log(e)
})
this.getCateList()
this.getList()
},
methods: {
toDetail (url) {
window.open(url)
},
onChange (e) {
if (e === 'isFavorite') {
this.$http.post('/api/learning/favoritePage', null, {
params: {
...this.search
}
}).then(res => {
if (res.code === 0) {
this.tableData = res.data.records
this.total = res.data.total
}
})
} else {
this.search.current = 1
this.getList()
}
},
collection (id, isFavorite) {
this.$confirm(isFavorite === '0' ? '确定收藏该文章?' : '确定取消收藏?', '温馨提示', {
confirmButtonText: '确定',
callback: action => {
if (action === 'confirm') {
this.$http.post(isFavorite === '0' ? `/api/learning/addFavorite?id=${id}` : `/api/learning/delFavorite?id=${id}`).then(res => {
if (res.code === 0) {
this.$message.success(isFavorite === '0' ? '收藏成功' : '取消成功')
this.getList()
}
})
}
}
})
},
getCateList () {
this.$http.post('/api/learningCategory/page?size=50').then(res => {
if (res.code === 0) {
this.cateList = res.data.records
}
})
toPrint (template, printData) {
this.$refs.printData.print(template, printData)
},
getList () {
this.$http.post('/api/learning/pluginPage', null, {
params: {
...this.search
}
}).then(res => {
if (res.code === 0) {
this.tableData = res.data.records
this.total = res.data.total
}
})
}
}
}

View File

@@ -10,13 +10,15 @@
<template slot="content">
<ai-search-bar>
<template #left>
<el-button type="primary" size="small" @click="isShow = true">添加</el-button>
<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>
</template>
<template #right>
</template>
</ai-search-bar>
<ai-table
:tableData="tableData"
:tableData="skuList"
:col-configs="colConfigs"
:total="total"
:current.sync="search.current"
@@ -32,7 +34,7 @@
</div>
</template>
</el-table-column>
<el-table-column slot="options" label="操作" align="center" fixed="right" width="140px">
<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>
@@ -58,7 +60,7 @@
</div>
<div class="search-item">
<label>店铺</label>
<el-select v-model="skuSearch.mallId" placeholder="请选择店铺" size="small">
<el-select v-model="lableSearch.mallId" placeholder="请选择店铺" size="small">
<el-option
v-for="item in $store.state.mallList"
:key="item.mallId"
@@ -84,7 +86,7 @@
collapse-tags
clearable>
</el-cascader>
<el-button style="margin-left: 10px;" @click="onCateChange" size="small" :disabled="!skuSearch.mallId" :loading="isLoading">查询</el-button>
<el-button style="margin-left: 10px;" @click="onCateChange" size="small" :disabled="!lableSearch.mallId" :loading="isLoading">查询</el-button>
</div>
<div class="search-item" v-show="addType === '2'">
<label>SKC</label>
@@ -98,7 +100,7 @@
@clear="getSkuList()"
suffix-icon="iconfont iconSearch">
</el-input>
<el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!skuSearch.mallId" :loading="isLoading">查询</el-button>
<el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!lableSearch.mallId" :loading="isLoading">查询</el-button>
</div>
<div class="search-item" v-show="addType === '3'">
<label>SKU</label>
@@ -113,22 +115,23 @@
@clear="getSkuList()"
suffix-icon="iconfont iconSearch">
</el-input>
<el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!skuSearch.mallId" :loading="isLoading">查询</el-button>
<el-button style="margin-left: 10px;" @click="getSkuList" size="small" :disabled="!lableSearch.mallId" :loading="isLoading">查询</el-button>
</div>
</div>
</div>
<ai-table
height="370"
:tableData="skuList"
:tableData="lableList"
:col-configs="colConfigs"
:total="skuTotal"
:current.sync="skuSearch.current"
:size.sync="skuSearch.size"
:total="lableTotal"
:current.sync="lableSearch.current"
:size.sync="lableSearch.size"
style="margin-top: 8px;"
@getList="getSkuList"
:pageSizes="[10, 20, 50, 100, 500, 1000]"
v-loading="isLoading"
:isShowPagination="false">
:isShowPagination="false"
@getList="() => {}"
@selection-change="handleSelectionChange">
<el-table-column slot="productName" width="300px" :show-overflow-tooltip="true" label="商品名称" fixed="left">
<template slot-scope="scope">
<div>
@@ -162,19 +165,18 @@
{ prop: 'skuExtCode', label: 'SKU货号', align: 'center' },
{ prop: 'skuSpecName', label: '次销售属性', align: 'center' }
],
tableData: [],
total: 0,
search: {
current: 1,
size: 100
},
skuSearch: {
lableSearch: {
current: 1,
size: 100,
mallId: ''
},
skuTotal: 0,
skuList: [],
lableTotal: 0,
lableList: [],
isShow: false,
skuReqParams: {
page: 1,
@@ -209,7 +211,9 @@
})
}
},
targetCatId: []
targetCatId: [],
skuList: [],
chooseSkuList: []
}
},
@@ -219,7 +223,7 @@
return {}
}
return this.$store.state.mallList.filter(v => v.mallId === this.skuSearch.mallId)[0]
return this.$store.state.mallList.filter(v => v.mallId === this.lableSearch.mallId)[0]
}
},
@@ -239,6 +243,7 @@
handleSelectionChange(e) {
console.log(e)
this.chooseSkuList = e
},
getSKCList(catIds, page) {
@@ -246,7 +251,7 @@
sendChromeAPIMessage({
url: 'bg-visage-mms/product/skc/pageQuery',
needMallId: true,
mallId: this.skuSearch.mallId,
mallId: this.lableSearch.mallId,
anti: true,
data: {
page: 1,
@@ -269,35 +274,42 @@
},
async onCateChange() {
let page = 1
let list = []
let isHasNext = true
this.isLoading = true
while (isHasNext) {
const result = await this.getSKCList([].concat(this.targetCatId.flat()), page)
page = page + 1
isHasNext = result.isHasNext ? true : false
list.push(...result.list)
this.$userCheck(this.lableSearch.mallId).then(async () => {
let page = 1
let list = []
let isHasNext = true
this.lableList = []
this.isLoading = true
while (isHasNext) {
const result = await this.getSKCList([].concat(this.targetCatId.flat()), page)
page = page + 1
isHasNext = result.isHasNext ? true : false
list.push(...result.list)
await this.$sleepSync(5000)
}
await this.$sleepSync(5000)
}
const skcList = [...new Set(list)]
const len = Math.ceil(skcList.length / 100)
for (let i = 0; i < len; i++) {
this.skuReqParams.page = 1
this.skuReqParams.SKC = [...new Set(list)].slice(i * 100, i * 100 + 100).join(',')
await this.requestSKUList()
await this.$sleepSync(2000)
}
const skcList = [...new Set(list)]
const len = Math.ceil(skcList.length / 100)
for (let i = 0; i < len; i++) {
this.skuReqParams.page = 1
this.skuReqParams.SKC = [...new Set(list)].slice(i * 100, i * 100 + 100).join(',')
await this.requestSKUList(true)
await this.$sleepSync(2000)
}
console.log(111)
this.isLoading = false
}).catch(() => {
this.lableSearch.mallId = ''
})
},
requestSKUList() {
this.isLoading = true
requestSKUList(flag) {
return sendChromeAPIMessage({
url: 'bg-visage-mms/labelcode/pageQuery',
needMallId: true,
mallId: this.skuSearch.mallId,
mallId: this.lableSearch.mallId,
anti: true,
data: {
page: this.skuReqParams.page,
@@ -309,7 +321,7 @@
if (res.errorCode == 1000000) {
const list = res.result.pageItems.map(v => {
return {
mallId: this.skuSearch.mallId,
mallId: this.lableSearch.mallId,
mallName: this.currMall.mallName,
productName: v.productName,
productSkuId: v.labelCodeVO.productSkuId,
@@ -320,33 +332,32 @@
}).join(',')
}
})
this.skuTotal = res.result.total
this.skuList.push(...list)
this.lableTotal = res.result.total
this.lableList.push(...list)
if (res.result.total > this.skuList.length) {
if (res.result.total > this.lableList.length) {
this.skuReqParams.page++
await this.$sleepSync(5000)
await this.requestSKUList()
} else {
this.isLoading = false
!flag && (this.isLoading = false)
}
}
})
},
getSkuList () {
if (!this.skuSearch.mallId) {
if (!this.lableSearch.mallId) {
return this.$message.error('请选择店铺')
}
this.$userCheck(this.skuSearch.mallId).then(() => {
this.skuList = []
this.$userCheck(this.lableSearch.mallId).then(() => {
this.lableList = []
this.skuReqParams.page = 1
this.isLoading = true
this.requestSKUList()
}).catch(() => {
this.skuSearch.mallId = ''
this.lableSearch.mallId = ''
})
},
@@ -364,7 +375,8 @@
},
onConfirm () {
this.skuList = this.chooseSkuList
this.isShow = false
}
}
}