给商品选择、单据查看和商品列表增加缩略图

This commit is contained in:
季圣华
2023-07-06 00:01:54 +08:00
parent d67fa0ccf6
commit 9d98db0eda
3 changed files with 81 additions and 14 deletions

View File

@@ -87,9 +87,9 @@
{{record.mBarCode}} {{record.mBarCode}}
<a-popover placement="right" trigger="click"> <a-popover placement="right" trigger="click">
<template slot="content"> <template slot="content">
<img :src='getImgUrl(record.imgName)' width="500px" /> <img :src="getImgUrl(record.imgName, '')" width="500px" />
</template> </template>
<a-icon v-if="record.imgName" style="font-size: 18px" theme="twoTone" type="file-image" /> <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" style="cursor:pointer; max-width:36px; max-height:27px;" title="查看大图" />
</a-popover> </a-popover>
</template> </template>
<template slot="customName" slot-scope="text, record"> <template slot="customName" slot-scope="text, record">
@@ -307,6 +307,13 @@
return '' return ''
} }
}, },
getImgMiniUrl(imgName) {
if(imgName && imgName.split(',')) {
return getFileAccessHttpUrl('systemConfig/static/mini/' + imgName.split(',')[0])
} else {
return ''
}
},
close() { close() {
this.searchReset(0); this.searchReset(0);
this.visible = false; this.visible = false;

View File

@@ -77,6 +77,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
</a-col> </a-col>
@@ -158,6 +161,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
</a-col> </a-col>
@@ -230,6 +236,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -308,6 +317,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -414,6 +426,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -501,6 +516,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -579,6 +597,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -690,6 +711,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -780,6 +804,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -826,6 +853,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -863,6 +893,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -900,6 +933,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -937,6 +973,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -978,6 +1017,9 @@
:pagination="false" :pagination="false"
:columns="columns" :columns="columns"
:dataSource="dataSource"> :dataSource="dataSource">
<template slot="customBarCode" slot-scope="text, record">
{{record.barCode}} <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" class="material-img" />
</template>
</a-table> </a-table>
</div> </div>
<a-row class="form-row" :gutter="24"> <a-row class="form-row" :gutter="24">
@@ -1007,7 +1049,7 @@
<script> <script>
import pick from 'lodash.pick' import pick from 'lodash.pick'
import { getAction, postAction } from '@/api/manage' import { getAction, postAction, getFileAccessHttpUrl } from '@/api/manage'
import { findBillDetailByNumber, findFinancialDetailByNumber, getPlatformConfigByKey, getCurrentSystemConfig} from '@/api/api' import { findBillDetailByNumber, findFinancialDetailByNumber, getPlatformConfigByKey, getCurrentSystemConfig} from '@/api/api'
import { getMpListShort, getCheckFlag, openDownloadDialog, sheet2blob } from "@/utils/util" import { getMpListShort, getCheckFlag, openDownloadDialog, sheet2blob } from "@/utils/util"
import BillPrintIframe from './BillPrintIframe' import BillPrintIframe from './BillPrintIframe'
@@ -1411,10 +1453,12 @@
let info = {} let info = {}
info.title = this.defColumns[i].title info.title = this.defColumns[i].title
info.dataIndex = this.defColumns[i].dataIndex info.dataIndex = this.defColumns[i].dataIndex
info.width = this.defColumns[i].width
if(this.defColumns[i].dataIndex === 'finishNumber') { if(this.defColumns[i].dataIndex === 'finishNumber') {
info.title = '已采购' info.title = '已采购'
} }
if(this.defColumns[i].dataIndex === 'barCode') {
info.scopedSlots = { customRender: 'customBarCode' }
}
currentCol.push(info) currentCol.push(info)
} }
this.columns = currentCol this.columns = currentCol
@@ -1427,7 +1471,9 @@
let info = {} let info = {}
info.title = this.defColumns[i].title info.title = this.defColumns[i].title
info.dataIndex = this.defColumns[i].dataIndex info.dataIndex = this.defColumns[i].dataIndex
info.width = this.defColumns[i].width if(this.defColumns[i].dataIndex === 'barCode') {
info.scopedSlots = { customRender: 'customBarCode' }
}
currentCol.push(info) currentCol.push(info)
} }
//添加有数据的列 //添加有数据的列
@@ -1435,7 +1481,6 @@
let info = {} let info = {}
info.title = this.defColumns[i].title info.title = this.defColumns[i].title
info.dataIndex = this.defColumns[i].dataIndex info.dataIndex = this.defColumns[i].dataIndex
info.width = this.defColumns[i].width
currentCol.push(info) currentCol.push(info)
} }
} }
@@ -1580,6 +1625,14 @@
} }
}) })
}, },
getImgUrl(imgName, type) {
if(imgName && imgName.split(',')) {
type = type? type + '/':''
return getFileAccessHttpUrl('systemConfig/static/' + type + imgName.split(',')[0])
} else {
return ''
}
},
//三联打印预览 //三联打印预览
handlePrint() { handlePrint() {
getPlatformConfigByKey({"platformKey": "bill_print_url"}).then((res)=> { getPlatformConfigByKey({"platformKey": "bill_print_url"}).then((res)=> {
@@ -1715,5 +1768,8 @@
</script> </script>
<style scoped> <style scoped>
.material-img{
max-width:36px;
max-height:27px;
}
</style> </style>

View File

@@ -147,15 +147,17 @@
<a>删除</a> <a>删除</a>
</a-popconfirm> </a-popconfirm>
</span> </span>
<template slot="customBarCode" slot-scope="text, record"> <template slot="customPic" slot-scope="text, record">
{{record.mBarCode}}
<a-popover placement="right" trigger="click"> <a-popover placement="right" trigger="click">
<template slot="content"> <template slot="content">
<img :src='getImgUrl(record.imgName)' width="500px" /> <img :src="getImgUrl(record.imgName, '')" width="500px" />
</template> </template>
<a-icon v-if="record.imgName" style="font-size: 18px" theme="twoTone" type="file-image" /> <img v-if="record.imgName" :src="getImgUrl(record.imgName, 'mini')" style="cursor:pointer; max-width:36px; max-height:27px;" title="查看大图" />
</a-popover> </a-popover>
</template> </template>
<template slot="customBarCode" slot-scope="text, record">
{{record.mBarCode}}
</template>
<template slot="customName" slot-scope="text, record"> <template slot="customName" slot-scope="text, record">
{{record.name}} {{record.name}}
<a-tag v-if="record.enableSerialNumber==1" color="orange">序</a-tag> <a-tag v-if="record.enableSerialNumber==1" color="orange">序</a-tag>
@@ -247,7 +249,8 @@
width: 100, width: 100,
scopedSlots: { customRender: 'action' }, scopedSlots: { customRender: 'action' },
}, },
{title: '条码', dataIndex: 'mBarCode', width: 160, scopedSlots: { customRender: 'customBarCode' }}, {title: '图片', dataIndex: 'pic', width: 45, scopedSlots: { customRender: 'customPic' }},
{title: '条码', dataIndex: 'mBarCode', width: 120},
{title: '名称', dataIndex: 'name', width: 160, scopedSlots: { customRender: 'customName' }}, {title: '名称', dataIndex: 'name', width: 160, scopedSlots: { customRender: 'customName' }},
{title: '规格', dataIndex: 'standard', width: 120}, {title: '规格', dataIndex: 'standard', width: 120},
{title: '型号', dataIndex: 'model', width: 120}, {title: '型号', dataIndex: 'model', width: 120},
@@ -390,9 +393,10 @@
this.$refs.modalForm.showOkFlag = false this.$refs.modalForm.showOkFlag = false
} }
}, },
getImgUrl(imgName) { getImgUrl(imgName, type) {
if(imgName && imgName.split(',')) { if(imgName && imgName.split(',')) {
return getFileAccessHttpUrl('systemConfig/static/' + imgName.split(',')[0]) type = type? type + '/':''
return getFileAccessHttpUrl('systemConfig/static/' + type + imgName.split(',')[0])
} else { } else {
return '' return ''
} }