版本更新v0.01
parent
7520fa8dd9
commit
d3e251f3e4
|
|
@ -28,5 +28,5 @@ export default {
|
|||
// 获取仓库树结构
|
||||
sysStoreTree(data) {
|
||||
return request('tree', data, 'get')
|
||||
},
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
import { baseRequest } from '@/utils/request'
|
||||
|
||||
const request = (url, ...arg) => baseRequest(`/inventory/inbound/` + url, ...arg)
|
||||
|
||||
const produceRequest = (url, ...arg) => baseRequest(`/produce/inbound/` + url, ...arg)
|
||||
/**
|
||||
* 入库单Api接口管理器
|
||||
*
|
||||
|
|
@ -15,15 +15,15 @@ export default {
|
|||
},
|
||||
// 获取入库单 明细列表
|
||||
inventoryInboundDetailList(data) {
|
||||
return request('/detail/list', data, 'get')
|
||||
return request('detail/list', data, 'get')
|
||||
},
|
||||
// 获取入库单 条码列表
|
||||
inventoryInboundBarcodeTree(data) {
|
||||
return request('/barcode/tree/list', data, 'get')
|
||||
return produceRequest('barcode/tree/list', data, 'get')
|
||||
},
|
||||
// 获取入库单 条码（子级）列表
|
||||
inventoryInboundBarcodeTreeChildren(data) {
|
||||
return request('/barcode/tree/childrenList', data, 'get')
|
||||
return request('barcode/tree/childrenList', data, 'get')
|
||||
},
|
||||
// 获取入库单详情
|
||||
inventoryInboundDetail(data) {
|
||||
|
|
|
|||
|
|
@ -29,4 +29,8 @@ export default {
|
|||
inventoryInvoiceAuditPass(data, edit = false) {
|
||||
return request('audit/pass', data)
|
||||
},
|
||||
// 获取发货通知单明细列表
|
||||
inventoryInvoiceDetailList(data) {
|
||||
return request('detail/list', data, 'get')
|
||||
},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,5 +24,14 @@ export default {
|
|||
// 获取生产汇报单详情
|
||||
produceReportDetail(data) {
|
||||
return request('detail', data, 'get')
|
||||
},
|
||||
// 产品包装条码 树
|
||||
produceReportTreeList(data) {
|
||||
return request('barcode/tree/list', data, 'get')
|
||||
},
|
||||
|
||||
// 产品包装条码 树 子级
|
||||
produceReportTreeChildrenList(data) {
|
||||
return request('barcode/tree/childrenList', data, 'get')
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,175 @@
|
|||
<template>
|
||||
<div></div>
|
||||
<a-modal v-model:open="visible" title="物料选择" width="80%" @ok="handleOk" @cancel="handleClose">
|
||||
<a-form ref="searchFormRef" name="advanced_search" :model="searchFormState" class="ant-advanced-search-form">
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="6">
|
||||
<a-form-item label="名称" name="name">
|
||||
<a-input v-model:value="searchFormState.name" placeholder="请输入名称" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-form-item label="编码" name="number">
|
||||
<a-input v-model:value="searchFormState.number" placeholder="请输入编码" />
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-form-item label="可用状态" name="enabledState">
|
||||
<a-select
|
||||
v-model:value="searchFormState.enabledState"
|
||||
placeholder="请选择可用状态"
|
||||
:options="$TOOL.dictList('COMMON_STATUS')"
|
||||
/>
|
||||
</a-form-item>
|
||||
</a-col>
|
||||
<a-col :span="6">
|
||||
<a-button type="primary" @click="tableRef.refresh()">查询</a-button>
|
||||
<a-button style="margin: 0 8px" @click="reset">重置</a-button>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-form>
|
||||
|
||||
<a-row :gutter="24">
|
||||
<a-col :span="6">
|
||||
<dynamic-tree
|
||||
ref="dynamicTreeRef"
|
||||
treeTitle="物料分类"
|
||||
:tableRef="tableRef"
|
||||
:apiModel="{
|
||||
getTree: customerCategoryApi.customerCategoryTree,
|
||||
}"
|
||||
@selectTree="selectTree"
|
||||
@treeRefresh="treeRefresh"
|
||||
:toolConfig="{
|
||||
plus: false,
|
||||
edit: false,
|
||||
delete: false,
|
||||
refresh: true
|
||||
}"
|
||||
></dynamic-tree>
|
||||
</a-col>
|
||||
<a-col :span="18">
|
||||
<s-table
|
||||
ref="tableRef"
|
||||
:columns="columns"
|
||||
:data="loadData"
|
||||
:alert="options.alert.show"
|
||||
bordered
|
||||
:row-key="(record) => record.id"
|
||||
:tool-config="options.toolConfig"
|
||||
:row-selection="tableRowSelection"
|
||||
:scroll="{
|
||||
x: 100,
|
||||
y: 500
|
||||
}"
|
||||
>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex === 'number'">
|
||||
<a href="#">{{ record.number }}</a>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'enabledState'">
|
||||
<a-tag color="#87d068" v-if="record.enabledState === 'ENABLE'">启用</a-tag>
|
||||
<a-tag color="#f50" v-if="record.enabledState === 'DISABLED'">停用</a-tag>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'type'">
|
||||
{{ $TOOL.dictTypeData('OFFICIAL_ACCOUNT_TYPE', record.type) }}
|
||||
</template>
|
||||
</template>
|
||||
</s-table>
|
||||
</a-col>
|
||||
</a-row>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useTableManagement } from '@/hook/useTableManagement'
|
||||
import { message } from 'ant-design-vue'
|
||||
import customerApi from "@/api/base/customer/customerApi";
|
||||
import customerCategoryApi from "@/api/base/customer/customerCategoryApi";
|
||||
import {clientColumn} from "@/views/productionBusiness/basicData/client/columns/clientColumn";
|
||||
|
||||
const emits = defineEmits(['ok'])
|
||||
|
||||
// 弹窗是否打开
|
||||
const visible = ref(false)
|
||||
// 物料分类
|
||||
const dynamicTreeRef = ref(null)
|
||||
// 列表查询
|
||||
const { searchFormState, tableRef, selectedRowKeys, columns, loadData, reset, options, searchFormRef } =
|
||||
useTableManagement(
|
||||
{
|
||||
page: customerApi.customerPage,
|
||||
},
|
||||
clientColumn,
|
||||
[],
|
||||
false
|
||||
)
|
||||
|
||||
// 选择树
|
||||
const selectTree = (value) => {
|
||||
searchFormState.value.categoryId = value.id
|
||||
tableRef.value.refresh()
|
||||
}
|
||||
|
||||
// 刷新树
|
||||
const treeRefresh = () => {
|
||||
searchFormState.value.categoryId = null
|
||||
tableRef.value.refresh()
|
||||
}
|
||||
|
||||
// 物料单选
|
||||
let clientSelectedRowKey = []
|
||||
let clientSelectedRows = []
|
||||
const tableRowSelection = {
|
||||
type: 'radio',
|
||||
onChange: (selectedRowKey, selectedRows) => {
|
||||
clientSelectedRowKey = selectedRowKey
|
||||
clientSelectedRows = selectedRows
|
||||
}
|
||||
}
|
||||
|
||||
// 确认
|
||||
const handleOk = () => {
|
||||
if (clientSelectedRowKey.length === 0) return message.error('请选择物料')
|
||||
|
||||
emits('ok', {
|
||||
clientSelectedRowKey,
|
||||
clientSelectedRows
|
||||
})
|
||||
|
||||
closeModal()
|
||||
}
|
||||
|
||||
// 关闭弹窗
|
||||
const handleClose = () => {
|
||||
closeModal()
|
||||
}
|
||||
|
||||
// 关闭方法
|
||||
const closeModal = () => {
|
||||
// 关闭弹窗
|
||||
visible.value = false
|
||||
// 清空table 选项
|
||||
tableRef.value.clearSelected()
|
||||
}
|
||||
|
||||
// 打开方法
|
||||
const showOpen = () => {
|
||||
visible.value = true
|
||||
|
||||
nextTick(() => {
|
||||
// 加载物料分类
|
||||
dynamicTreeRef.value.loadTreeData()
|
||||
|
||||
// 加载表格
|
||||
tableRef.value.refresh()
|
||||
})
|
||||
}
|
||||
|
||||
// 导出方法
|
||||
defineExpose({
|
||||
showOpen
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
|
|
@ -59,9 +59,7 @@
|
|||
ref="formRef2"
|
||||
/>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="扩展字段" force-render>
|
||||
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="扩展字段" force-render> </a-tab-pane>
|
||||
<a-tab-pane key="3" tab="操作信息" v-if="route.query.type !== 'ADD'">
|
||||
<OperationalInformation :detailData="detailData" :colSpan="6"></OperationalInformation>
|
||||
</a-tab-pane>
|
||||
|
|
@ -108,13 +106,10 @@
|
|||
const formRef1 = ref(null)
|
||||
const formRef2 = ref(null)
|
||||
|
||||
const { formData, formRefs, onSubmit, handleBack, fetchData } = useFormHandler(
|
||||
[...formItems, ...baseFormItems],
|
||||
{
|
||||
submitForm: supplierApi.supplierSubmitForm,
|
||||
getDetail: supplierApi.supplierDetail
|
||||
}
|
||||
)
|
||||
const { formData, formRefs, onSubmit, handleBack, fetchData } = useFormHandler([...formItems, ...baseFormItems], {
|
||||
submitForm: supplierApi.supplierSubmitForm,
|
||||
getDetail: supplierApi.supplierDetail
|
||||
})
|
||||
|
||||
const onSubmitForm = () => {
|
||||
onSubmit({
|
||||
|
|
@ -145,7 +140,8 @@
|
|||
})
|
||||
|
||||
// 供应商分类
|
||||
supplierCategoryApi.supplierCategoryTree({
|
||||
supplierCategoryApi
|
||||
.supplierCategoryTree({
|
||||
enabledState: 'ENABLE'
|
||||
})
|
||||
.then((res) => {
|
||||
|
|
@ -155,12 +151,10 @@
|
|||
}
|
||||
})
|
||||
})
|
||||
|
||||
})
|
||||
|
||||
let activeKey = ref('1')
|
||||
|
||||
|
||||
// 省、市、县 数据回显
|
||||
const cityOptionsObj = cityOptions.reduce((acc, item) => ((acc[item.value] = item.children), acc), {})
|
||||
const getCityOptions = () => {
|
||||
|
|
|
|||
|
|
@ -22,7 +22,7 @@
|
|||
@delTree="delTree"
|
||||
@treeRefresh="treeRefresh"
|
||||
:toolConfig="{
|
||||
plus: hasPerm('supplierCategoryAdd'),
|
||||
plus: true,
|
||||
edit: hasPerm('supplierCategoryEdit'),
|
||||
delete: hasPerm('supplierCategoryDelete'),
|
||||
refresh: true
|
||||
|
|
@ -52,13 +52,11 @@
|
|||
type: 'ADD'
|
||||
})
|
||||
"
|
||||
v-if="hasPerm('supplierAdd')"
|
||||
>
|
||||
<template #icon><plus-outlined /></template>
|
||||
新增
|
||||
</a-button>
|
||||
<xn-batch-delete
|
||||
v-if="hasPerm('supplierBatchDelete')"
|
||||
:selectedRowKeys="selectedRowKeys"
|
||||
@batchDelete="deleteBatchRecords"
|
||||
/>
|
||||
|
|
@ -117,7 +115,7 @@
|
|||
</s-table>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
|
||||
<supplierCategoryForm ref="supplierCategoryFormRef" @successful="successful"></supplierCategoryForm>
|
||||
</a-card>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@ export const tableColumns = [
|
|||
width: 200,
|
||||
ellipsis: true
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
title: '创建人',
|
||||
dataIndex: 'createUserName',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,149 @@
|
|||
<template>
|
||||
<a-page-header style="padding: 10px; font-size: 20px" @back="handleBack">
|
||||
<template #extra>
|
||||
<!-- <a-button v-if="route.query.type !== 'SEARCH'" key="1" type="primary" @click="onSubmitForm">保存</a-button>-->
|
||||
</template>
|
||||
</a-page-header>
|
||||
|
||||
<a-card :bordered="false" title="入库单">
|
||||
<DynamicForm
|
||||
:allDisabled="route.query.type === 'SEARCH'"
|
||||
:formItems="unitFormItems"
|
||||
:model="formData"
|
||||
:rules="formRules"
|
||||
ref="formRef1"
|
||||
/>
|
||||
</a-card>
|
||||
|
||||
<a-card :bordered="false" class="mt-4" style="height: 100%">
|
||||
<a-tabs v-model:activeKey="activeKey">
|
||||
<a-tab-pane key="1" tab="汇报明细" forceRender>
|
||||
<a-table
|
||||
:columns="detailColumns"
|
||||
:data-source="detailDataSource"
|
||||
:scroll="{
|
||||
x: 100
|
||||
}"
|
||||
>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex === 'action'">
|
||||
<a type="primary" @click="handleOpenViewScan(record)">查看条码</a>
|
||||
</template>
|
||||
</template>
|
||||
</a-table>
|
||||
</a-tab-pane>
|
||||
<a-tab-pane key="2" tab="操作信息" v-if="route.query.type !== 'ADD'">
|
||||
<OperationalInformation :detailData="inform" :colSpan="6"></OperationalInformation>
|
||||
</a-tab-pane>
|
||||
</a-tabs>
|
||||
</a-card>
|
||||
|
||||
<!-- 产看条码 -->
|
||||
<a-modal v-model:open="visible" title="查看条码" width="80%">
|
||||
<a-table
|
||||
style="height: 500px"
|
||||
:columns="modalColumns"
|
||||
:data-source="scanTableList"
|
||||
:pagination="false"
|
||||
:scroll="{ x: 100, y: 420 }"
|
||||
:row-key="(record) => record.id"
|
||||
@expand="columnsExpand"
|
||||
bordered
|
||||
/>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import produceReportApi from '@/api/production/produceTask/produceReportApi'
|
||||
import useFormHandler from '@/hook/useFormHandler'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { unitFormItems, formRules } from '@/views/productionBusiness/productionCenter/report/formFields/detailFields'
|
||||
import { detailColumns, modalColumns } from '@/views/productionBusiness/productionCenter/report/columns/detailColumns'
|
||||
import { cloneDeep } from 'lodash-es'
|
||||
import produceReportDetailApi from '@/api/production/produceTask/produceReportDetailApi'
|
||||
import inventoryInboundApi from '@/api/inventory/inventoryInboundApi'
|
||||
|
||||
const route = useRoute()
|
||||
const formRef1 = ref(null)
|
||||
const tableRef = ref(null)
|
||||
let extendData = ref([])
|
||||
let searchFormState = ref({})
|
||||
|
||||
let { formData, formRefs, inform, handleBack, fetchData, getExtendField } = useFormHandler(unitFormItems, {
|
||||
getDetail: inventoryInboundApi.inventoryInboundDetail
|
||||
})
|
||||
|
||||
let detailDataSource = ref([])
|
||||
|
||||
const options = {
|
||||
alert: {
|
||||
show: true,
|
||||
clear: () => {
|
||||
selectedRowKeys.value = []
|
||||
}
|
||||
},
|
||||
rowSelection: {
|
||||
onChange: (selectedRowKey, selectedRows) => {
|
||||
selectedRowKeys.value = selectedRowKey
|
||||
}
|
||||
},
|
||||
toolConfig: { refresh: true, height: true, columnSetting: true, striped: false }
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
formRefs.value = [formRef1.value]
|
||||
const detailData = await fetchData(route.query.type)
|
||||
searchFormState.value.inboundId = detailData.id
|
||||
// tableRef.value.refresh(true)
|
||||
await loadData()
|
||||
extendData.value = await getExtendField('MATERIAL')
|
||||
})
|
||||
|
||||
// 获取产品包装条码控制器
|
||||
const loadData = async () => {
|
||||
const searchFormParam = cloneDeep(searchFormState.value)
|
||||
return inventoryInboundApi.inventoryInboundDetailList(Object.assign(searchFormParam)).then((data) => {
|
||||
detailDataSource.value = data
|
||||
})
|
||||
}
|
||||
|
||||
let activeKey = ref('1')
|
||||
|
||||
// 查看条码
|
||||
let visible = ref(false)
|
||||
let scanTableList = ref([])
|
||||
let recordTable = {}
|
||||
const handleOpenViewScan = (record) => {
|
||||
recordTable = record
|
||||
visible.value = true
|
||||
inventoryInboundApi
|
||||
.inventoryInboundBarcodeTree({
|
||||
docsDetailId: record.id,
|
||||
docsId: record.inboundId
|
||||
})
|
||||
.then((res) => {
|
||||
scanTableList.value = res
|
||||
scanTableList.value.forEach((item) => {
|
||||
if (item.subAmount && item.subAmount > 0) item.children = []
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const columnsExpand = (expanded, record) => {
|
||||
if (expanded) {
|
||||
produceReportApi
|
||||
.produceReportTreeChildrenList({
|
||||
docsDetailId: recordTable.id,
|
||||
docsId: record.docsId,
|
||||
parentBarcode: record.barcode
|
||||
})
|
||||
.then((res) => {
|
||||
record.children = res
|
||||
record.children &&
|
||||
record.children.forEach((item) => {
|
||||
if (item.subAmount && item.subAmount > 0) item.children = []
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
import { required } from '@/utils/formRules'
|
||||
import tool from '@/utils/tool'
|
||||
|
||||
export const unitFormItems = reactive([
|
||||
{
|
||||
label: '单号：',
|
||||
name: 'billNumber',
|
||||
type: 'a-input-number',
|
||||
span: 6,
|
||||
attrs: {
|
||||
placeholder: '请输入编码',
|
||||
allowClear: true
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '业务日期：',
|
||||
name: 'businessDate',
|
||||
type: 'a-date-picker',
|
||||
span: 6,
|
||||
attrs: {
|
||||
placeholder: '请输入业务日期',
|
||||
allowClear: true,
|
||||
valueFormat: 'YYYY-MM-DD HH:mm:ss'
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '状态：',
|
||||
name: 'state',
|
||||
type: 'a-select',
|
||||
span: 6,
|
||||
attrs: {
|
||||
placeholder: '请选择可用状态',
|
||||
options: tool.dictList('PRODUCE_REPORT_STATE')
|
||||
},
|
||||
defaultValue: ''
|
||||
},
|
||||
{
|
||||
label: '类型：',
|
||||
name: 'produceType',
|
||||
type: 'a-select',
|
||||
span: 6,
|
||||
attrs: {
|
||||
options: tool.dictList('PRODUCE_TYPE')
|
||||
}
|
||||
},
|
||||
{
|
||||
label: '生产线：',
|
||||
name: 'productionLineName',
|
||||
type: 'a-select',
|
||||
span: 6,
|
||||
attrs: {
|
||||
placeholder: '请选择是否基本单位',
|
||||
options: tool.dictList('YES_NO')
|
||||
},
|
||||
defaultValue: 'NO'
|
||||
},
|
||||
{
|
||||
label: '备注：',
|
||||
name: 'remarks',
|
||||
type: 'a-textarea',
|
||||
span: 24,
|
||||
attrs: {
|
||||
placeholder: '请输入备注',
|
||||
allowClear: true
|
||||
}
|
||||
}
|
||||
])
|
||||
|
||||
export const formRules = {}
|
||||
|
|
@ -1,12 +1,13 @@
|
|||
import tool from '@/utils/tool'
|
||||
|
||||
export const searchFields = [
|
||||
{ name: 'billNumber', label: '单号', component: 'a-input', props: { placeholder: '请输入单号' } },
|
||||
{ name: 'billNumber', label: '单号', component: 'a-input', props: { placeholder: '请输入单号' } },
|
||||
{
|
||||
label: '类型：',
|
||||
name: 'type',
|
||||
type: 'a-select',
|
||||
attrs: {
|
||||
component: 'a-select',
|
||||
props: {
|
||||
placeholder: '请选择类型',
|
||||
allowClear: true,
|
||||
options: tool.dictList('INBOUND_TYPE')
|
||||
|
|
@ -15,9 +16,8 @@ export const searchFields = [
|
|||
{
|
||||
label: '仓库：',
|
||||
name: 'storeId',
|
||||
type: 'a-tree-select',
|
||||
span: 6,
|
||||
attrs: {
|
||||
component: 'a-tree-select',
|
||||
props: {
|
||||
placeholder: '请选择仓库',
|
||||
treeData: [],
|
||||
fieldNames: {
|
||||
|
|
@ -25,8 +25,7 @@ export const searchFields = [
|
|||
label: 'name',
|
||||
value: 'id'
|
||||
}
|
||||
},
|
||||
defaultValue: ''
|
||||
}
|
||||
},
|
||||
{ name: 'customerName', label: '供货单位名称', component: 'a-input', props: { placeholder: '请输入供货单位名称' } },
|
||||
{ name: 'customerNumber', label: '供货单位编码', component: 'a-input', props: { placeholder: '请输入供货单位编码' } }
|
||||
|
|
|
|||
|
|
@ -1,14 +1,13 @@
|
|||
<template>
|
||||
<AdvancedSearchForm
|
||||
:formState="searchFormState"
|
||||
:formFields="searchFields"
|
||||
:formFields="searchFieldsRef"
|
||||
@search="tableRef.refresh()"
|
||||
@reset="tableRef.refresh()"
|
||||
/>
|
||||
|
||||
<a-card :bordered="false" class="mt-4" style="height: 100%">
|
||||
<a-row :gutter="24">
|
||||
|
||||
<a-col :span="24">
|
||||
<s-table
|
||||
ref="tableRef"
|
||||
|
|
@ -18,15 +17,10 @@
|
|||
bordered
|
||||
:row-key="(record) => record.id"
|
||||
:tool-config="options.toolConfig"
|
||||
:row-selection="options.rowSelection"
|
||||
:scroll="{
|
||||
x: 100
|
||||
}"
|
||||
>
|
||||
<template #operator>
|
||||
<a-space>
|
||||
</a-space>
|
||||
</template>
|
||||
<template #bodyCell="{ column, record }">
|
||||
<template v-if="column.dataIndex === 'billNumber'">
|
||||
<span style="color: #0d84ff">{{ record.billNumber }}</span>
|
||||
|
|
@ -40,7 +34,7 @@
|
|||
<a-space>
|
||||
<a
|
||||
@click="
|
||||
navigateTo('/inventory/inbound/detail', {
|
||||
navigateTo('/inbound/detail', {
|
||||
type: 'SEARCH',
|
||||
id: record.id
|
||||
})
|
||||
|
|
@ -51,13 +45,10 @@
|
|||
</a>
|
||||
</a-space>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</s-table>
|
||||
</a-col>
|
||||
</a-row>
|
||||
|
||||
|
||||
</a-card>
|
||||
</template>
|
||||
|
||||
|
|
@ -67,16 +58,16 @@
|
|||
import { useTableManagement } from '@/hook/useTableManagement'
|
||||
import { searchFields } from '@/views/productionBusiness/inventory/inbound/formFields/searchFields'
|
||||
import { tableColumns } from '@/views/productionBusiness/inventory/inbound/columns/tableColumn'
|
||||
import sysStoreApi from '@/api/base/store/sysStoreApi'
|
||||
|
||||
const searchFieldsRef = ref(searchFields)
|
||||
|
||||
const tagColorList = ['warning', 'success', 'error', 'purple']
|
||||
const {
|
||||
searchFormState,
|
||||
tableRef,
|
||||
selectedRowKeys,
|
||||
columns,
|
||||
loadData,
|
||||
deleteRecord,
|
||||
deleteBatchRecords,
|
||||
options,
|
||||
navigateTo
|
||||
} = useTableManagement(
|
||||
|
|
@ -84,15 +75,20 @@
|
|||
page: inventoryInboundApi.inventoryInboundPage
|
||||
},
|
||||
tableColumns,
|
||||
['inventoryInbound:export']
|
||||
['customerEdit', 'customerDelete']
|
||||
)
|
||||
// 批量导出
|
||||
const exportBatchVerify = () =>{
|
||||
const exportBatchVerify = () => {}
|
||||
|
||||
}
|
||||
onMounted(async () => {
|
||||
const list = await sysStoreApi.sysStoreTree()
|
||||
console.log(list)
|
||||
searchFieldsRef.value.forEach((item) => {
|
||||
if (item.name === 'storeId') {
|
||||
item.props.treeData = list
|
||||
|
||||
onMounted(() => {
|
||||
|
||||
console.log(item.props.treeData, 'item.props.treeData')
|
||||
}
|
||||
})
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<a-card :bordered="false" title="基本信息">
|
||||
<DynamicForm
|
||||
:allDisabled="route.query.type === 'SEARCH'"
|
||||
:formItems="basicInfoFormItems"
|
||||
:formItems="basicInfoFormItemsRef"
|
||||
:rules="basicInfoFormRules"
|
||||
:model="formData"
|
||||
ref="formRef1"
|
||||
|
|
@ -19,9 +19,9 @@
|
|||
readonly
|
||||
v-bind="{ ...item.attrs }"
|
||||
v-model:value="model[item.name]"
|
||||
@click="openClient"
|
||||
></a-input>
|
||||
</template>
|
||||
|
||||
</DynamicForm>
|
||||
</a-card>
|
||||
|
||||
|
|
@ -33,20 +33,14 @@
|
|||
title="扩展字段"
|
||||
>
|
||||
<DynamicForm
|
||||
:allDisabled="route.query.type === 'SEARCH'"
|
||||
:formItems="extendData"
|
||||
:model="extendFormData"
|
||||
:rules="formRules"
|
||||
v-if="extendData.length > 0"
|
||||
/>
|
||||
:allDisabled="route.query.type === 'SEARCH'"
|
||||
:formItems="extendData"
|
||||
:model="extendFormData"
|
||||
v-if="extendData.length > 0"
|
||||
/>
|
||||
</a-card>
|
||||
|
||||
<a-card
|
||||
:bordered="false"
|
||||
class="mt-4"
|
||||
style="height: 100%"
|
||||
title="商品明细信息"
|
||||
>
|
||||
<a-card :bordered="false" class="mt-4" style="height: 100%" title="商品明细信息">
|
||||
<a-space>
|
||||
<a-button v-if="route.query.type !== 'SEARCH'" key="1" type="primary" @click="addRow">新增</a-button>
|
||||
<xn-batch-delete
|
||||
|
|
@ -73,7 +67,7 @@
|
|||
readonly
|
||||
v-model:value="record['productName']"
|
||||
placeholder="请选择商品信息"
|
||||
@click="openMateriel"
|
||||
@click="openMateriel(record, index)"
|
||||
></a-input>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'unitName'">
|
||||
|
|
@ -81,16 +75,15 @@
|
|||
style="width: 100%"
|
||||
:options="record.unitArr"
|
||||
v-model:value="record['unitName']"
|
||||
@change="
|
||||
(value, options) => {
|
||||
cityChange(value, options, record)
|
||||
}
|
||||
"
|
||||
:filter-option="filterOption"
|
||||
:fieldNames="{
|
||||
label: 'name',
|
||||
value: 'id'
|
||||
}"
|
||||
></a-select>
|
||||
</template>
|
||||
<template v-if="column.dataIndex === 'planAmount'">
|
||||
<a-input-number class="xn-wd"
|
||||
<a-input-number
|
||||
class="xn-wd"
|
||||
:disabled="route.query.type === 'SEARCH'"
|
||||
v-model:value="record['planAmount']"
|
||||
:min="0"
|
||||
|
|
@ -98,9 +91,7 @@
|
|||
</template>
|
||||
<template v-if="column.dataIndex === 'action'">
|
||||
<a-space>
|
||||
<a-button type="link" danger size="small" >
|
||||
<DeleteOutlined />删除
|
||||
</a-button>
|
||||
<a-button type="link" danger size="small"> <DeleteOutlined />删除 </a-button>
|
||||
</a-space>
|
||||
</template>
|
||||
</template>
|
||||
|
|
@ -109,24 +100,29 @@
|
|||
|
||||
<materiel-selector-plus ref="materielSelectorPlusRef" @ok="materielBackOk"></materiel-selector-plus>
|
||||
|
||||
<client-selector-plus ref="clientSelectorPlusRef" @ok="clientBackOk"></client-selector-plus>
|
||||
</template>
|
||||
|
||||
<script setup name="taskDetail">
|
||||
import { required } from '@/utils/formRules'
|
||||
import inventoryInvoiceApi from '@/api/inventory/inventoryInvoiceApi'
|
||||
import sysStoreApi from '@/api/base/store/sysStoreApi'
|
||||
import materialApi from '@/api/base/material/materialApi'
|
||||
import useFormHandler from '@/hook/useFormHandler'
|
||||
import { basicInfoFormRules, basicInfoFormItems, productDetailFormItems } from '@/views/productionBusiness/inventory/invoice/formFields/detailFields'
|
||||
import {
|
||||
basicInfoFormRules,
|
||||
basicInfoFormItems,
|
||||
productDetailFormItems
|
||||
} from '@/views/productionBusiness/inventory/invoice/formFields/detailFields'
|
||||
import { useRoute } from 'vue-router'
|
||||
import MaterielSelectorPlus from '@/components/Selector/materielSelectorPlus.vue'
|
||||
import ClientSelectorPlus from '@/components/Selector/clientSelectorPlus.vue'
|
||||
const route = useRoute()
|
||||
|
||||
|
||||
|
||||
const formRef1 = ref(null)
|
||||
let extendData = ref([])
|
||||
|
||||
const basicInfoFormItemsRef = ref(basicInfoFormItems)
|
||||
|
||||
const { formData, formRefs, inform, extendFormData, onSubmit, handleBack, fetchData, getExtendField } =
|
||||
useFormHandler([...basicInfoFormItems], {
|
||||
submitForm: inventoryInvoiceApi.inventoryInvoiceSubmitForm,
|
||||
|
|
@ -142,15 +138,21 @@
|
|||
formData.storeId = res.storeId // 仓库id
|
||||
formData.storeName = res.storeName // 仓库名称
|
||||
formData.storeNumber = res.storeNumber // 仓库编码
|
||||
|
||||
}
|
||||
})
|
||||
|
||||
// 获取明细列表
|
||||
const detailList = await inventoryInvoiceApi.inventoryInvoiceDetailList({
|
||||
invoiceId: formRefs.value.id
|
||||
})
|
||||
|
||||
productDetailData.value = detailList
|
||||
|
||||
// 处理表单 元素数据填充
|
||||
const sysStoreTreeList = await sysStoreApi.sysStoreTree();
|
||||
basicInfoFormItems.forEach((item) => {
|
||||
const sysStoreTreeList = await sysStoreApi.sysStoreTree()
|
||||
basicInfoFormItemsRef.value.forEach((item) => {
|
||||
if (item.name === 'storeId') {
|
||||
item.attrs.treeData = (sysStoreTreeList || []);
|
||||
item.attrs.treeData = sysStoreTreeList || []
|
||||
}
|
||||
})
|
||||
|
||||
|
|
@ -160,64 +162,61 @@
|
|||
const onSubmitForm = () => {
|
||||
onSubmit({
|
||||
isDeep: true,
|
||||
...formData
|
||||
...formData,
|
||||
detailList: productDetailData.value
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
/* 物料选择器 */
|
||||
const materielSelectorPlusRef = ref(null)
|
||||
let materialPackageData = {}
|
||||
|
||||
// 打开物料选择
|
||||
const openMateriel = () => {
|
||||
let materielIndex = {}
|
||||
const openMateriel = (record, index) => {
|
||||
materielSelectorPlusRef.value.showOpen()
|
||||
materielIndex = index
|
||||
}
|
||||
|
||||
// 物料选择器返回操作
|
||||
const materielBackOk = (event) => {
|
||||
const materielId = event.materielSelectedRows[0].id;
|
||||
if(materielId){
|
||||
// 判断处理 物料-包装关系 数据信息
|
||||
let packageData = handleMaterialPackageData(materielId);
|
||||
|
||||
const materielBackOk = async (event) => {
|
||||
productDetailData.value[materielIndex].productName = event.materielSelectedRows[0].name
|
||||
productDetailData.value[materielIndex].productNumber = event.materielSelectedRows[0].number
|
||||
productDetailData.value[materielIndex].specification = event.materielSelectedRows[0].specification
|
||||
productDetailData.value[materielIndex].baseUnitName = event.materielSelectedRows[0].baseUnitName
|
||||
productDetailData.value[materielIndex].batchNumber = event.materielSelectedRows[0].batchNumber
|
||||
productDetailData.value[materielIndex].planAmount = event.materielSelectedRows[0].planAmount
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
// 下方无用可删除
|
||||
formData.productName = event.materielSelectedRows[0].name // 物料名称
|
||||
formData.productNumber = event.materielSelectedRows[0].number // 物料名称
|
||||
formData.productId = event.materielSelectedRows[0].id // 物料id
|
||||
// 选择物料自动带出基本单位和生产单位
|
||||
formData.produceUnitName = event.materielSelectedRows[0].produceUnitName // 生产单位
|
||||
formData.produceUnitId = event.materielSelectedRows[0].produceUnitId // 生产单位id
|
||||
|
||||
formData.baseUnitName = event.materielSelectedRows[0].baseUnitName // 生产单位
|
||||
formData.baseUnitId = event.materielSelectedRows[0].baseUnitId // 生产单位id
|
||||
|
||||
formData.unitGroupId = event.materielSelectedRows[0].unitGroupId
|
||||
formData.unitGroupName = event.materielSelectedRows[0].unitGroupName
|
||||
formData.packageProportion = event.materielSelectedRows[0].packageProportion
|
||||
|
||||
|
||||
// 获取单位列表
|
||||
productDetailData.value[materielIndex].unitArr = await handleMaterialPackageData(event.materielSelectedRows[0].id)
|
||||
// record.unitArr
|
||||
}
|
||||
|
||||
const handleMaterialPackageData = async(materielId)=>{
|
||||
let packageData = [];
|
||||
if(materielId){
|
||||
packageData = materialPackageData[materielId];
|
||||
if(!packageData || packageData.length === 0){
|
||||
const handleMaterialPackageData = async (materielId) => {
|
||||
let packageData = []
|
||||
if (materielId) {
|
||||
packageData = materialPackageData[materielId]
|
||||
if (!packageData || packageData.length === 0) {
|
||||
packageData = await materialApi.materialPackageData({
|
||||
materialId: materielId
|
||||
})
|
||||
if(packageData && packageData.length > 0){
|
||||
materialPackageData[materielId] = packageData;
|
||||
}
|
||||
}
|
||||
}
|
||||
return packageData;
|
||||
return packageData.filter((item) => item.enabledState === 'ENABLE')
|
||||
}
|
||||
|
||||
/**
|
||||
* 客户选择器
|
||||
* */
|
||||
const clientSelectorPlusRef = ref(null)
|
||||
|
||||
const openClient = () => {
|
||||
clientSelectorPlusRef.value.showOpen()
|
||||
}
|
||||
|
||||
const clientBackOk = (event) => {
|
||||
formData.customerName = event.clientSelectedRows[0].name
|
||||
formData.customerId = event.clientSelectedRows[0].id
|
||||
}
|
||||
|
||||
/* =================================== 商品明细 ============================*/
|
||||
|
|
|
|||
|
|
@ -122,8 +122,8 @@ const basicInfoFormItems = [
|
|||
{
|
||||
label: '备注：',
|
||||
name: 'remarks',
|
||||
type: 'a-input',
|
||||
span: 12,
|
||||
type: 'a-textarea',
|
||||
span: 24,
|
||||
attrs: {
|
||||
placeholder: '请输入备注',
|
||||
allowClear: true
|
||||
|
|
@ -184,4 +184,4 @@ const productDetailFormItems = [
|
|||
}
|
||||
]
|
||||
|
||||
export { basicInfoFormRules, basicInfoFormItems, productDetailFormItems }
|
||||
export { basicInfoFormRules, basicInfoFormItems, productDetailFormItems }
|
||||
|
|
|
|||
|
|
@ -0,0 +1,72 @@
|
|||
<!--
|
||||
* @Description:
|
||||
* @Author: CcSimple
|
||||
* @Github: https://github.com/CcSimple
|
||||
* @Date: 2023-02-16 14:35:38
|
||||
* @LastEditors: CcSimple
|
||||
* @LastEditTime: 2023-04-11 13:40:27
|
||||
-->
|
||||
<template>
|
||||
<div class="modal" v-if="show">
|
||||
<div class="wrap" @click="close">
|
||||
<div class="box">
|
||||
<div class="modal-box__header" @click.stop="">预览</div>
|
||||
<div class="preview-body" style="max-height: 50vh; overflow: auto">
|
||||
<div class="container"></div>
|
||||
</div>
|
||||
<div class="modal-box__footer">
|
||||
<button class="primary" @click="close">确定</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref } from 'vue'
|
||||
import $ from 'jquery'
|
||||
export default {
|
||||
name: 'StartPreview',
|
||||
setup() {
|
||||
const show = ref(false)
|
||||
const close = () => {
|
||||
show.value = false
|
||||
}
|
||||
const showModal = (...html) => {
|
||||
show.value = true
|
||||
do {
|
||||
setTimeout(() => {
|
||||
$('.container').empty()
|
||||
$('.container').html(html)
|
||||
}, 200)
|
||||
return
|
||||
} while ($('.container').length <= 0)
|
||||
}
|
||||
return {
|
||||
show,
|
||||
close,
|
||||
showModal
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 不同模板 间隙 */
|
||||
.container .hiprint-printTemplate {
|
||||
background: #fff;
|
||||
border-bottom: 10px solid #ccc;
|
||||
}
|
||||
/* 批量打印 间隙 */
|
||||
.container .hiprint-printTemplate .hiprint-printPanel:not(:last-of-type) {
|
||||
border-bottom: 5px solid #ccc;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
.preview-body {
|
||||
background: #ccc;
|
||||
padding: 14px 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,342 @@
|
|||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 3559670 */
|
||||
src: url("iconfont.woff2?t=1667531544868") format("woff2"),
|
||||
url("iconfont.woff?t=1667531544868") format("woff"),
|
||||
url("iconfont.ttf?t=1667531544868") format("truetype");
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.sv-edit-data:before {
|
||||
content: "\e655";
|
||||
}
|
||||
|
||||
.sv-shimmer:before {
|
||||
content: "\e6d6";
|
||||
}
|
||||
|
||||
.sv-origin:before {
|
||||
content: "\e6ac";
|
||||
}
|
||||
|
||||
.sv-zIndex:before {
|
||||
content: "\e603";
|
||||
}
|
||||
|
||||
.sv-structure:before {
|
||||
content: "\ec6f";
|
||||
}
|
||||
|
||||
.sv-list:before {
|
||||
content: "\e742";
|
||||
}
|
||||
|
||||
.sv-grid:before {
|
||||
content: "\e849";
|
||||
}
|
||||
|
||||
.sv-flow:before {
|
||||
content: "\e611";
|
||||
}
|
||||
|
||||
.sv-switch:before {
|
||||
content: "\e6f6";
|
||||
}
|
||||
|
||||
.sv-theme:before {
|
||||
content: "\e644";
|
||||
}
|
||||
|
||||
.sv-element:before {
|
||||
content: "\e615";
|
||||
}
|
||||
|
||||
.sv-pdf:before {
|
||||
content: "\e67a";
|
||||
}
|
||||
|
||||
.sv-browser:before {
|
||||
content: "\e726";
|
||||
}
|
||||
|
||||
.sv-font-big:before {
|
||||
content: "\eb04";
|
||||
}
|
||||
|
||||
.sv-font-small:before {
|
||||
content: "\eb05";
|
||||
}
|
||||
|
||||
.sv-font-bold:before {
|
||||
content: "\ec83";
|
||||
}
|
||||
|
||||
.sv-font-tiny:before {
|
||||
content: "\e6c1";
|
||||
}
|
||||
|
||||
.sv-options:before {
|
||||
content: "\e607";
|
||||
}
|
||||
|
||||
.sv-close:before {
|
||||
content: "\e646";
|
||||
}
|
||||
|
||||
.sv-clone:before {
|
||||
content: "\ec7a";
|
||||
}
|
||||
|
||||
.sv-cut:before {
|
||||
content: "\e643";
|
||||
}
|
||||
|
||||
.sv-preview:before {
|
||||
content: "\e61c";
|
||||
}
|
||||
|
||||
.sv-zoom-in:before {
|
||||
content: "\e60f";
|
||||
}
|
||||
|
||||
.sv-zoom-out:before {
|
||||
content: "\e610";
|
||||
}
|
||||
|
||||
.sv-edit:before {
|
||||
content: "\e6b9";
|
||||
}
|
||||
|
||||
.sv-paste:before {
|
||||
content: "\e6c0";
|
||||
}
|
||||
|
||||
.sv-copy:before {
|
||||
content: "\e6c2";
|
||||
}
|
||||
|
||||
.sv-unlock:before {
|
||||
content: "\e6e7";
|
||||
}
|
||||
|
||||
.sv-lock:before {
|
||||
content: "\e6e8";
|
||||
}
|
||||
|
||||
.sv-zIndex-plus:before {
|
||||
content: "\e715";
|
||||
}
|
||||
|
||||
.sv-zIndex-minus:before {
|
||||
content: "\e716";
|
||||
}
|
||||
|
||||
.sv-zIndex-top:before {
|
||||
content: "\e71f";
|
||||
}
|
||||
|
||||
.sv-sigh:before {
|
||||
content: "\e724";
|
||||
}
|
||||
|
||||
.sv-ask:before {
|
||||
content: "\e725";
|
||||
}
|
||||
|
||||
.sv-dev-code:before {
|
||||
content: "\e733";
|
||||
}
|
||||
|
||||
.sv-bug:before {
|
||||
content: "\e73f";
|
||||
}
|
||||
|
||||
.sv-zIndex-bottom:before {
|
||||
content: "\e71d";
|
||||
}
|
||||
|
||||
.sv-new:before {
|
||||
content: "\e64d";
|
||||
}
|
||||
|
||||
.sv-clear:before {
|
||||
content: "\e62d";
|
||||
}
|
||||
|
||||
.sv-base:before {
|
||||
content: "\e7d0";
|
||||
}
|
||||
|
||||
.sv-export:before {
|
||||
content: "\eabf";
|
||||
}
|
||||
|
||||
.sv-import:before {
|
||||
content: "\eac0";
|
||||
}
|
||||
|
||||
.sv-add:before {
|
||||
content: "\eaf3";
|
||||
}
|
||||
|
||||
.sv-printer:before {
|
||||
content: "\eabe";
|
||||
}
|
||||
|
||||
.sv-save:before {
|
||||
content: "\eabd";
|
||||
}
|
||||
|
||||
.sv-more:before {
|
||||
content: "\e625";
|
||||
}
|
||||
|
||||
.sv-menu:before {
|
||||
content: "\e628";
|
||||
}
|
||||
|
||||
.sv-nav-right:before {
|
||||
content: "\e629";
|
||||
}
|
||||
|
||||
.sv-nav-up:before {
|
||||
content: "\e62a";
|
||||
}
|
||||
|
||||
.sv-nav-left:before {
|
||||
content: "\e62b";
|
||||
}
|
||||
|
||||
.sv-nav-down:before {
|
||||
content: "\e62c";
|
||||
}
|
||||
|
||||
.sv-setting:before {
|
||||
content: "\e62e";
|
||||
}
|
||||
|
||||
.sv-delete:before {
|
||||
content: "\e630";
|
||||
}
|
||||
|
||||
.sv-undo:before {
|
||||
content: "\e631";
|
||||
}
|
||||
|
||||
.sv-redo:before {
|
||||
content: "\e632";
|
||||
}
|
||||
|
||||
.sv-refresh:before {
|
||||
content: "\e634";
|
||||
}
|
||||
|
||||
.sv-history:before {
|
||||
content: "\e635";
|
||||
}
|
||||
|
||||
.sv-html:before {
|
||||
content: "\e633";
|
||||
}
|
||||
|
||||
.sv-longText:before {
|
||||
content: "\e64c";
|
||||
}
|
||||
|
||||
.sv-table:before {
|
||||
content: "\ec15";
|
||||
}
|
||||
|
||||
.sv-qrcode:before {
|
||||
content: "\e642";
|
||||
}
|
||||
|
||||
.sv-image:before {
|
||||
content: "\e8ba";
|
||||
}
|
||||
|
||||
.sv-barcode:before {
|
||||
content: "\eb64";
|
||||
}
|
||||
|
||||
.sv-text:before {
|
||||
content: "\e60b";
|
||||
}
|
||||
|
||||
.sv-vline:before {
|
||||
content: "\e63a";
|
||||
}
|
||||
|
||||
.sv-oval:before {
|
||||
content: "\eb99";
|
||||
}
|
||||
|
||||
.sv-rect:before {
|
||||
content: "\e620";
|
||||
}
|
||||
|
||||
.sv-hline:before {
|
||||
content: "\e60a";
|
||||
}
|
||||
|
||||
.sv-print-c:before {
|
||||
content: "\e602";
|
||||
}
|
||||
|
||||
.sv-print:before {
|
||||
content: "\e601";
|
||||
}
|
||||
|
||||
.sv-c:before {
|
||||
content: "\e600";
|
||||
}
|
||||
|
||||
.sv-vertical:before {
|
||||
content: "\e706";
|
||||
}
|
||||
|
||||
.sv-distributeHor:before {
|
||||
content: "\e707";
|
||||
}
|
||||
|
||||
.sv-right:before {
|
||||
content: "\e708";
|
||||
}
|
||||
|
||||
.sv-left:before {
|
||||
content: "\e709";
|
||||
}
|
||||
|
||||
.sv-distributeVer:before {
|
||||
content: "\e70f";
|
||||
}
|
||||
|
||||
.sv-bottom:before {
|
||||
content: "\e710";
|
||||
}
|
||||
|
||||
.sv-top:before {
|
||||
content: "\e711";
|
||||
}
|
||||
|
||||
.sv-horizontal:before {
|
||||
content: "\e712";
|
||||
}
|
||||
|
||||
.sv-rotate:before {
|
||||
content: "\e66f";
|
||||
}
|
||||
|
||||
.sv-butongbu:before {
|
||||
content: "\e636";
|
||||
}
|
||||
|
||||
.sv-synchronization:before {
|
||||
content: "\e676";
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -0,0 +1,174 @@
|
|||
/* 字体样式 */
|
||||
/*@import "./iconfont.css";*/
|
||||
|
||||
/* 定义全局样式 */
|
||||
/* 在 main.js 入库文件引入 */
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* scrollbar */
|
||||
::-webkit-scrollbar {
|
||||
height: 4px;
|
||||
width: 4px;
|
||||
}
|
||||
::-webkit-scrollbar-corner {
|
||||
height: 4px;
|
||||
width: 4px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: purple;
|
||||
border-radius: 2px;
|
||||
background-image: -webkit-linear-gradient(
|
||||
45deg,
|
||||
rgba(255, 255, 255, 0.2) 25%,
|
||||
transparent 25%,
|
||||
transparent 50%,
|
||||
rgba(255, 255, 255, 0.2) 50%,
|
||||
rgba(255, 255, 255, 0.2) 75%,
|
||||
transparent 75%,
|
||||
transparent
|
||||
);
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: purple;
|
||||
}
|
||||
|
||||
/* flex */
|
||||
.flex-row {
|
||||
display: flex;
|
||||
}
|
||||
.flex-col {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.flex-wrap {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.align-center {
|
||||
align-items: center;
|
||||
}
|
||||
.justify-center {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
flex: 1;
|
||||
}
|
||||
.flex-2 {
|
||||
flex: 2;
|
||||
}
|
||||
.flex-3 {
|
||||
flex: 3;
|
||||
}
|
||||
.flex-4 {
|
||||
flex: 4;
|
||||
}
|
||||
.flex-5 {
|
||||
flex: 5;
|
||||
}
|
||||
|
||||
.ml-10 {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.mr-10 {
|
||||
margin-right: 10px;
|
||||
}
|
||||
.mt-10 {
|
||||
margin-top: 10px;
|
||||
}
|
||||
.mb-10 {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
/* button 样式 为了好看点 */
|
||||
button {
|
||||
padding: 10px;
|
||||
min-width: 40px;
|
||||
color: white;
|
||||
opacity: 0.9;
|
||||
cursor: pointer;
|
||||
border-width: 0;
|
||||
border: 1px solid #d9d9d9;
|
||||
}
|
||||
button:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
button i {
|
||||
font-size: 16px !important;
|
||||
}
|
||||
.circle,
|
||||
.circle-4 {
|
||||
border-radius: 4px !important;
|
||||
}
|
||||
.circle-10 {
|
||||
border-radius: 10px !important;
|
||||
}
|
||||
/* 按钮颜色 */
|
||||
.primary {
|
||||
background: purple;
|
||||
}
|
||||
.info {
|
||||
color: #000;
|
||||
background: none;
|
||||
}
|
||||
.info:hover {
|
||||
color: purple;
|
||||
border-color: purple;
|
||||
}
|
||||
.secondary {
|
||||
background: #1976d2;
|
||||
}
|
||||
.warning {
|
||||
background: #d32f2f;
|
||||
}
|
||||
|
||||
/* modal */
|
||||
.modal {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
.modal .mask {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
height: 100%;
|
||||
background-color: #00000073;
|
||||
}
|
||||
.modal .wrap {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 1000;
|
||||
overflow: auto;
|
||||
background-color: #00000073;
|
||||
outline: 0;
|
||||
}
|
||||
.modal .wrap .box {
|
||||
position: relative;
|
||||
margin: 10% auto;
|
||||
width: 40%;
|
||||
background: #fff;
|
||||
border-radius: 4px;
|
||||
z-index: 1001;
|
||||
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.modal-box__header {
|
||||
padding: 10px 14px;
|
||||
border-bottom: 1px solid #e9e9e9;
|
||||
}
|
||||
.modal-box__footer {
|
||||
text-align: end;
|
||||
}
|
||||
.modal-box__footer button {
|
||||
min-width: 100px;
|
||||
}
|
||||
.modal-box__footer button:not(:last-child) {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
|
@ -0,0 +1,108 @@
|
|||
/*
|
||||
* @Description:
|
||||
* @Author: CcSimple
|
||||
* @Github: https://github.com/CcSimple
|
||||
* @Date: 2023-02-09 13:32:39
|
||||
* @LastEditors: CcSimple
|
||||
* @LastEditTime: 2023-02-09 23:38:03
|
||||
*/
|
||||
import { reactive, computed, toRefs } from "vue";
|
||||
import { getHiprintPrintTemplate } from "../utils/template-helper";
|
||||
|
||||
/**
|
||||
* vue3 组合式函数
|
||||
* 把一些逻辑抽离出来，方便复用
|
||||
* 返回 使用方 可用的方法和数据
|
||||
*/
|
||||
export function usePaper(key) {
|
||||
// 数据
|
||||
const state = reactive({
|
||||
curPaper: {
|
||||
type: "A4",
|
||||
width: 210,
|
||||
height: 296.6,
|
||||
},
|
||||
paperTypes: {
|
||||
A3: {
|
||||
width: 420,
|
||||
height: 296.6,
|
||||
},
|
||||
A4: {
|
||||
width: 210,
|
||||
height: 296.6,
|
||||
},
|
||||
A5: {
|
||||
width: 210,
|
||||
height: 147.6,
|
||||
},
|
||||
B3: {
|
||||
width: 500,
|
||||
height: 352.6,
|
||||
},
|
||||
B4: {
|
||||
width: 250,
|
||||
height: 352.6,
|
||||
},
|
||||
B5: {
|
||||
width: 250,
|
||||
height: 175.6,
|
||||
},
|
||||
},
|
||||
// 自定义纸张
|
||||
paperPopVisible: false,
|
||||
paperWidth: "220",
|
||||
paperHeight: "80",
|
||||
});
|
||||
// 计算属性
|
||||
const curPaperType = computed(() => {
|
||||
let type = "other";
|
||||
let types = state.paperTypes;
|
||||
for (const key in types) {
|
||||
let item = types[key];
|
||||
let { width, height } = state.curPaper;
|
||||
if (item.width === width && item.height === height) {
|
||||
type = key;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
});
|
||||
const tp = () => {
|
||||
return getHiprintPrintTemplate(key);
|
||||
};
|
||||
// 方法
|
||||
const showPaperPop = () => {
|
||||
state.paperPopVisible = true;
|
||||
};
|
||||
const hidePaperPop = () => {
|
||||
state.paperPopVisible = false;
|
||||
};
|
||||
const setPaper = (type, value) => {
|
||||
try {
|
||||
if (Object.keys(state.paperTypes).includes(type)) {
|
||||
state.curPaper = { type: type, width: value.width, height: value.height };
|
||||
tp().setPaper(value.width, value.height);
|
||||
} else {
|
||||
state.curPaper = { type: "other", width: value.width, height: value.height };
|
||||
tp().setPaper(value.width, value.height);
|
||||
}
|
||||
} catch (error) {
|
||||
alert(`操作失败: ${error}`);
|
||||
}
|
||||
};
|
||||
const setPaperOther = () => {
|
||||
let value = {};
|
||||
value.width = state.paperWidth;
|
||||
value.height = state.paperHeight;
|
||||
state.paperPopVisible = false;
|
||||
setPaper("other", value);
|
||||
};
|
||||
// 暴露给使用方
|
||||
return {
|
||||
...toRefs(state),
|
||||
curPaperType,
|
||||
showPaperPop,
|
||||
hidePaperPop,
|
||||
setPaper,
|
||||
setPaperOther,
|
||||
};
|
||||
}
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
/*
|
||||
* @Description:
|
||||
* @Author: CcSimple
|
||||
* @Github: https://github.com/CcSimple
|
||||
* @Date: 2023-02-09 13:32:39
|
||||
* @LastEditors: CcSimple
|
||||
* @LastEditTime: 2023-02-10 16:00:54
|
||||
*/
|
||||
import { reactive, toRefs } from "vue";
|
||||
import { getHiprintPrintTemplate } from "../utils/template-helper";
|
||||
|
||||
/**
|
||||
* vue3 组合式函数
|
||||
* 把一些逻辑抽离出来，方便复用
|
||||
* 返回 使用方 可用的方法和数据
|
||||
*/
|
||||
export function useZoom(key) {
|
||||
// 数据
|
||||
const state = reactive({
|
||||
scaleValue: 1,
|
||||
scaleMax: 5,
|
||||
scaleMin: 0.5,
|
||||
});
|
||||
// 获取 template
|
||||
const tp = () => {
|
||||
return getHiprintPrintTemplate(key);
|
||||
};
|
||||
// 方法
|
||||
const changeScale = (big) => {
|
||||
let scaleValue = state.scaleValue;
|
||||
if (big) {
|
||||
scaleValue += 0.1;
|
||||
if (scaleValue > state.scaleMax) scaleValue = 5;
|
||||
} else {
|
||||
scaleValue -= 0.1;
|
||||
if (scaleValue < state.scaleMin) scaleValue = 0.5;
|
||||
}
|
||||
if (tp()) {
|
||||
// scaleValue: 放大缩小值, false: 不保存(不传也一样), 如果传 true, 打印时也会放大
|
||||
tp().zoom(scaleValue);
|
||||
state.scaleValue = scaleValue;
|
||||
}
|
||||
};
|
||||
// 暴露给使用方
|
||||
return {
|
||||
...toRefs(state),
|
||||
changeScale,
|
||||
};
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,127 @@
|
|||
/*
|
||||
* @Description:
|
||||
* @Author: CcSimple
|
||||
* @Github: https://github.com/CcSimple
|
||||
* @Date: 2023-02-09 10:40:26
|
||||
* @LastEditors: CcSimple
|
||||
* @LastEditTime: 2023-02-09 11:37:21
|
||||
*/
|
||||
import { hiprint } from 'vue-plugin-hiprint'
|
||||
export const provider1 = function (options) {
|
||||
var addElementTypes = function (context) {
|
||||
context.removePrintElementTypes('providerModule1')
|
||||
context.addPrintElementTypes('providerModule1', [
|
||||
new hiprint.PrintElementTypeGroup('', [
|
||||
// options.config,
|
||||
{
|
||||
tid: 'providerModule1.text',
|
||||
title: '文本',
|
||||
data: '文本',
|
||||
type: 'text',
|
||||
options: {
|
||||
testData: '文本',
|
||||
height: 17,
|
||||
fontSize: 16.5,
|
||||
fontWeight: '700',
|
||||
textAlign: 'center',
|
||||
hideTitle: true
|
||||
}
|
||||
},
|
||||
{ tid: 'providerModule1.image', title: '图片', data: '', type: 'image' },
|
||||
{
|
||||
tid: 'providerModule1.barcode',
|
||||
title: '条形码',
|
||||
data: 'XS888888888',
|
||||
type: 'text',
|
||||
options: {
|
||||
field: 'barcode',
|
||||
testData: 'XS888888888',
|
||||
height: 32,
|
||||
fontSize: 12,
|
||||
lineHeight: 18,
|
||||
textAlign: 'left',
|
||||
textType: 'barcode'
|
||||
}
|
||||
},
|
||||
{
|
||||
tid: 'providerModule1.qrcode',
|
||||
title: '二维码',
|
||||
data: 'XS888888888',
|
||||
type: 'text',
|
||||
options: {
|
||||
field: 'qrcode',
|
||||
testData: 'XS888888888',
|
||||
height: 32,
|
||||
fontSize: 12,
|
||||
lineHeight: 18,
|
||||
textType: 'qrcode'
|
||||
}
|
||||
},
|
||||
// {
|
||||
// tid: 'providerModule1.type',
|
||||
// title: '单据类型',
|
||||
// data: '单据类型',
|
||||
// type: 'text',
|
||||
// options: {
|
||||
// testData: '单据类型',
|
||||
// height: 16,
|
||||
// fontSize: 15,
|
||||
// fontWeight: '700',
|
||||
// textAlign: 'center',
|
||||
// hideTitle: true
|
||||
// }
|
||||
// },
|
||||
{
|
||||
tid: 'providerModule1.date',
|
||||
title: '日期',
|
||||
data: '2020-01-01',
|
||||
type: 'text',
|
||||
options: {
|
||||
field: 'date',
|
||||
testData: '2020-01-01',
|
||||
height: 16,
|
||||
fontSize: 6.75,
|
||||
fontWeight: '700',
|
||||
textAlign: 'left',
|
||||
textContentVerticalAlign: 'middle'
|
||||
}
|
||||
}
|
||||
])
|
||||
// new hiprint.PrintElementTypeGroup('客户', [
|
||||
// {
|
||||
// tid: 'providerModule1.khname',
|
||||
// title: '客户名称',
|
||||
// data: '高级客户',
|
||||
// type: 'text',
|
||||
// options: {
|
||||
// field: 'name',
|
||||
// testData: '高级客户',
|
||||
// height: 16,
|
||||
// fontSize: 6.75,
|
||||
// fontWeight: '700',
|
||||
// textAlign: 'left',
|
||||
// textContentVerticalAlign: 'middle'
|
||||
// }
|
||||
// },
|
||||
// {
|
||||
// tid: 'providerModule1.tel',
|
||||
// title: '客户电话',
|
||||
// data: '18888888888',
|
||||
// type: 'text',
|
||||
// options: {
|
||||
// field: 'tel',
|
||||
// testData: '18888888888',
|
||||
// height: 16,
|
||||
// fontSize: 6.75,
|
||||
// fontWeight: '700',
|
||||
// textAlign: 'left',
|
||||
// textContentVerticalAlign: 'middle'
|
||||
// }
|
||||
// }
|
||||
// ])
|
||||
])
|
||||
}
|
||||
return {
|
||||
addElementTypes: addElementTypes
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,90 @@
|
|||
/*
|
||||
* @Description:
|
||||
* @Author: CcSimple
|
||||
* @Github: https://github.com/CcSimple
|
||||
* @Date: 2023-02-09 10:40:26
|
||||
* @LastEditors: CcSimple
|
||||
* @LastEditTime: 2023-02-09 10:50:02
|
||||
*/
|
||||
import { hiprint } from 'vue-plugin-hiprint'
|
||||
export const provider2 = function (options) {
|
||||
console.log(options)
|
||||
var addElementTypes = function (context) {
|
||||
context.removePrintElementTypes('providerModule2')
|
||||
context.addPrintElementTypes('providerModule2', [
|
||||
new hiprint.PrintElementTypeGroup('', [
|
||||
{
|
||||
tid: 'providerModule2.table',
|
||||
title: '表格',
|
||||
type: 'table',
|
||||
options: {
|
||||
field: 'table',
|
||||
fields: [
|
||||
{ text: '名称', field: 'NAME' },
|
||||
{ text: '数量', field: 'SL' },
|
||||
{ text: '规格', field: 'GG' },
|
||||
{ text: '条码', field: 'TM' },
|
||||
{ text: '单价', field: 'DJ' },
|
||||
{ text: '金额', field: 'JE' },
|
||||
{ text: '备注', field: 'DETAIL' }
|
||||
]
|
||||
},
|
||||
columns: [
|
||||
[
|
||||
{ title: '名称', align: 'center', field: 'NAME', width: 100 },
|
||||
{ title: '数量', align: 'center', field: 'SL', width: 100 },
|
||||
{ title: '条码', align: 'center', field: 'TM', width: 100 },
|
||||
{ title: '规格', align: 'center', field: 'GG', width: 100 },
|
||||
{ title: '单价', align: 'center', field: 'DJ', width: 100 },
|
||||
{ title: '金额', align: 'center', field: 'JE', width: 100 },
|
||||
{ title: '备注', align: 'center', field: 'DETAIL', width: 100 }
|
||||
]
|
||||
],
|
||||
footerFormatter: function (options, rows, data, currentPageGridRowsData) {
|
||||
console.log(currentPageGridRowsData)
|
||||
if (data && data['totalCap']) {
|
||||
return `<td style="padding:0 10px" colspan="100">${'应收金额大写: ' + data['totalCap']}</td>`
|
||||
}
|
||||
return '<td style="padding:0 10px" colspan="100">应收金额大写: </td>'
|
||||
}
|
||||
},
|
||||
{ tid: 'providerModule2.customText', title: '文本', customText: '自定义文本', custom: true, type: 'text' },
|
||||
{
|
||||
tid: 'providerModule2.longText',
|
||||
title: '长文本',
|
||||
type: 'longText',
|
||||
options: {
|
||||
field: 'test.longText',
|
||||
width: 200,
|
||||
testData: '长文本分页/不分页测试'
|
||||
}
|
||||
}
|
||||
]),
|
||||
new hiprint.PrintElementTypeGroup('', [
|
||||
{
|
||||
tid: 'providerModule2.hline',
|
||||
title: '横线',
|
||||
type: 'hline'
|
||||
},
|
||||
{
|
||||
tid: 'providerModule2.vline',
|
||||
title: '竖线',
|
||||
type: 'vline'
|
||||
},
|
||||
{
|
||||
tid: 'providerModule2.rect',
|
||||
title: '矩形',
|
||||
type: 'rect'
|
||||
},
|
||||
{
|
||||
tid: 'providerModule2.oval',
|
||||
title: '椭圆',
|
||||
type: 'oval'
|
||||
}
|
||||
])
|
||||
])
|
||||
}
|
||||
return {
|
||||
addElementTypes: addElementTypes
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,365 @@
|
|||
export default {
|
||||
panels: [
|
||||
{
|
||||
index: 0,
|
||||
height: 297,
|
||||
width: 210,
|
||||
paperHeader: 49.5,
|
||||
paperFooter: 780,
|
||||
printElements: [
|
||||
{
|
||||
options: {
|
||||
left: 175.5,
|
||||
top: 10.5,
|
||||
height: 27,
|
||||
width: 259,
|
||||
title: 'HiPrint自定义模块打印插件',
|
||||
fontSize: 19,
|
||||
fontWeight: '600',
|
||||
textAlign: 'center',
|
||||
lineHeight: 26,
|
||||
coordinateSync: true,
|
||||
widthHeightSync: true,
|
||||
draggable: false
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 60, top: 27, height: 13, width: 52, title: '页眉线', textAlign: 'center' },
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 25.5, top: 57, height: 705, width: 9, fixed: true, borderStyle: 'dotted' },
|
||||
printElementType: { type: 'vline' }
|
||||
},
|
||||
{
|
||||
options: { left: 60, top: 61.5, height: 48, width: 87, src: '', fit: 'contain' },
|
||||
printElementType: { title: '图片', type: 'image' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 153,
|
||||
top: 64.5,
|
||||
height: 39,
|
||||
width: 276,
|
||||
title:
|
||||
'二维码以及条形码均采用svg格式打印。不同打印机打印不会造成失真。图片打印：不同DPI打印可能会导致失真，',
|
||||
fontFamily: '微软雅黑',
|
||||
textAlign: 'center',
|
||||
lineHeight: 18
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 457.5,
|
||||
top: 79.5,
|
||||
height: 13,
|
||||
width: 120,
|
||||
title: '姓名',
|
||||
field: 'name',
|
||||
testData: '古力娜扎',
|
||||
color: '#f00808',
|
||||
textDecoration: 'underline',
|
||||
textAlign: 'center',
|
||||
fields: [
|
||||
{ text: 'id', field: 'id' },
|
||||
{ text: '姓名', field: 'name' },
|
||||
{ text: '性别', field: 'gender' },
|
||||
{ text: '数量', field: 'count' }
|
||||
]
|
||||
},
|
||||
printElementType: { title: '文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 483,
|
||||
top: 124.5,
|
||||
height: 43,
|
||||
width: 51,
|
||||
title: '123456789',
|
||||
textType: 'qrcode'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 285,
|
||||
top: 130.5,
|
||||
height: 34,
|
||||
width: 175,
|
||||
title: '123456789',
|
||||
fontFamily: '微软雅黑',
|
||||
textAlign: 'center',
|
||||
textType: 'barcode'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 60,
|
||||
top: 132,
|
||||
height: 19,
|
||||
width: 213,
|
||||
title: '所有打印元素都可已拖拽的方式来改变元素大小',
|
||||
fontFamily: '微软雅黑',
|
||||
textAlign: 'center',
|
||||
lineHeight: 18
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 153,
|
||||
top: 189,
|
||||
height: 13,
|
||||
width: 238,
|
||||
title: '单击元素，右侧可自定义元素属性',
|
||||
textAlign: 'center',
|
||||
fontFamily: '微软雅黑'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 60, top: 190.5, height: 13, width: 51, title: '横线', textAlign: 'center' },
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 415.5,
|
||||
top: 190.5,
|
||||
height: 13,
|
||||
width: 164,
|
||||
title: '可以配置各属性的默认值',
|
||||
textAlign: 'center',
|
||||
fontFamily: '微软雅黑'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 60, top: 214.5, height: 10, width: 475.5 },
|
||||
printElementType: { title: '横线', type: 'hline' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 235.5,
|
||||
top: 220.5,
|
||||
height: 32,
|
||||
width: 342,
|
||||
title:
|
||||
'自定义表格：用户可左键选中表头，右键查看可操作项，操作类似Excel，双击表头单元格可进行编辑。内容：title#field',
|
||||
fontFamily: '微软雅黑',
|
||||
textAlign: 'center',
|
||||
lineHeight: 15
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 156,
|
||||
top: 265.5,
|
||||
height: 13,
|
||||
width: 94,
|
||||
title: '表头列大小可拖动',
|
||||
fontFamily: '微软雅黑',
|
||||
textAlign: 'center'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 60,
|
||||
top: 265.5,
|
||||
height: 13,
|
||||
width: 90,
|
||||
title: '红色区域可拖动',
|
||||
fontFamily: '微软雅黑',
|
||||
textAlign: 'center'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 60,
|
||||
top: 285,
|
||||
height: 56,
|
||||
width: 511.5,
|
||||
field: 'table',
|
||||
tableFooterRepeat: '',
|
||||
fields: [
|
||||
{ text: 'id', field: 'id' },
|
||||
{ text: '姓名', field: 'name' },
|
||||
{ text: '性别', field: 'gender' },
|
||||
{ text: '数量', field: 'count' }
|
||||
],
|
||||
columns: [
|
||||
[
|
||||
{ width: 85.25, colspan: 1, rowspan: 1, checked: true },
|
||||
{
|
||||
title: '性别',
|
||||
field: 'gender',
|
||||
width: 85.25,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
checked: false
|
||||
},
|
||||
{
|
||||
title: '姓名',
|
||||
field: 'name',
|
||||
width: 85.25,
|
||||
align: 'center',
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
checked: true,
|
||||
tableSummary: 'count'
|
||||
},
|
||||
{
|
||||
title: '数量',
|
||||
field: 'count',
|
||||
width: 85.25,
|
||||
align: 'center',
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
checked: true,
|
||||
tableSummary: 'sum'
|
||||
},
|
||||
{
|
||||
width: 85.25,
|
||||
colspan: 1,
|
||||
rowspan: 1,
|
||||
checked: true
|
||||
},
|
||||
{ width: 85.25, colspan: 1, rowspan: 1, checked: true }
|
||||
]
|
||||
]
|
||||
},
|
||||
printElementType: {
|
||||
title: '表格',
|
||||
type: 'table'
|
||||
}
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 21,
|
||||
top: 346.5,
|
||||
height: 61.5,
|
||||
width: 15,
|
||||
title: '装订线',
|
||||
lineHeight: 18,
|
||||
fixed: true,
|
||||
contentPaddingTop: 3.75,
|
||||
backgroundColor: '#ffffff'
|
||||
},
|
||||
printElementType: { type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 225,
|
||||
top: 355,
|
||||
height: 13,
|
||||
width: 346.5,
|
||||
title: '自定义模块：主要为开发人员设计，能够快速，简单，实现自己功能',
|
||||
textAlign: 'center'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 60, top: 370.5, height: 18, width: 79, title: '配置项表格', textAlign: 'center' },
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 225,
|
||||
top: 385.5,
|
||||
height: 38,
|
||||
width: 346.5,
|
||||
title: '配置模块：主要为客户使用，开发人员可以配置属性，字段，标题等，客户直接使用，配置模块请参考实例2',
|
||||
fontFamily: '微软雅黑',
|
||||
lineHeight: 15,
|
||||
textAlign: 'center',
|
||||
color: '#d93838'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 60,
|
||||
top: 487.5,
|
||||
height: 13,
|
||||
width: 123,
|
||||
title: '长文本会自动分页',
|
||||
textAlign: 'center'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 60, top: 507, height: 40, width: 511.5, field: 'longText' },
|
||||
printElementType: { title: '长文', type: 'longText' }
|
||||
},
|
||||
{
|
||||
options: { left: 475.5, top: 565.5, height: 100, width: 100 },
|
||||
printElementType: { title: '矩形', type: 'rect' }
|
||||
},
|
||||
{
|
||||
options: { left: 174, top: 568.5, height: 13, width: 90, title: '竖线', textAlign: 'center' },
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 60, top: 574.5, height: 100, width: 10 },
|
||||
printElementType: { title: '竖线', type: 'vline' }
|
||||
},
|
||||
{
|
||||
options: { left: 210, top: 604.5, height: 13, width: 120, title: '横线', textAlign: 'center' },
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 130.5, top: 625.5, height: 10, width: 277 },
|
||||
printElementType: { title: '横线', type: 'hline' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 364.5,
|
||||
top: 649.5,
|
||||
height: 13,
|
||||
width: 101,
|
||||
title: '矩形',
|
||||
textAlign: 'center'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 525, top: 784.5, height: 13, width: 63, title: '页尾线', textAlign: 'center' },
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: { left: 12, top: 786, height: 49, width: 49 },
|
||||
printElementType: { title: 'html', type: 'html' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 75,
|
||||
top: 790.5,
|
||||
height: 13,
|
||||
width: 137,
|
||||
title: '红色原型是自动定义的Html',
|
||||
textAlign: 'center'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
},
|
||||
{
|
||||
options: {
|
||||
left: 334.5,
|
||||
top: 810,
|
||||
height: 13,
|
||||
width: 205,
|
||||
title: '页眉线已上。页尾下以下每页都会重复打印',
|
||||
textAlign: 'center'
|
||||
},
|
||||
printElementType: { title: '自定义文本', type: 'text' }
|
||||
}
|
||||
],
|
||||
paperNumberLeft: 565.5,
|
||||
paperNumberTop: 819
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -0,0 +1,21 @@
|
|||
/*
|
||||
* @Description:
|
||||
* @Author: CcSimple
|
||||
* @Github: https://github.com/CcSimple
|
||||
* @Date: 2023-02-09 23:26:18
|
||||
* @LastEditors: CcSimple
|
||||
* @LastEditTime: 2023-02-09 23:35:20
|
||||
*/
|
||||
import { hiprint } from "vue-plugin-hiprint";
|
||||
|
||||
const templateMap = {};
|
||||
|
||||
export function newHiprintPrintTemplate(key, options) {
|
||||
let template = new hiprint.PrintTemplate(options);
|
||||
templateMap[key] = template;
|
||||
return template;
|
||||
}
|
||||
|
||||
export function getHiprintPrintTemplate(key) {
|
||||
return templateMap[key];
|
||||
}
|
||||
|
|
@ -226,14 +226,14 @@ export const modalColumns = [
|
|||
align: 'center',
|
||||
ellipsis: true
|
||||
},
|
||||
{
|
||||
/*{
|
||||
title: '打码时间',
|
||||
dataIndex: 'subAmount',
|
||||
width: 200,
|
||||
resizable: true,
|
||||
align: 'center',
|
||||
ellipsis: true
|
||||
},
|
||||
},*/
|
||||
{
|
||||
title: '扫描时间',
|
||||
dataIndex: 'scanTime',
|
||||
|
|
|
|||
|
|
@ -41,12 +41,14 @@
|
|||
<!-- 产看条码 -->
|
||||
<a-modal v-model:open="visible" title="查看条码" width="80%">
|
||||
<a-table
|
||||
style="height: 500px"
|
||||
:columns="modalColumns"
|
||||
:data-source="scanTableList"
|
||||
:pagination="false"
|
||||
:scroll="{ x: 100 }"
|
||||
:scroll="{ x: 100, y: 420 }"
|
||||
:row-key="(record) => record.id"
|
||||
@expand="columnsExpand"
|
||||
bordered
|
||||
/>
|
||||
</a-modal>
|
||||
</template>
|
||||
|
|
@ -110,35 +112,38 @@
|
|||
// 查看条码
|
||||
let visible = ref(false)
|
||||
let scanTableList = ref([])
|
||||
let recordTable = {}
|
||||
const handleOpenViewScan = (record) => {
|
||||
recordTable = record
|
||||
visible.value = true
|
||||
producePackageBarcodeApi
|
||||
.producePackageBarcodeTreeList({
|
||||
reportDetailId: record.id,
|
||||
reportId: record.reportId
|
||||
produceReportApi
|
||||
.produceReportTreeList({
|
||||
docsDetailId: record.id,
|
||||
docsId: record.reportId
|
||||
})
|
||||
.then((res) => {
|
||||
scanTableList.value = res
|
||||
scanTableList.value.forEach((item) => {
|
||||
// if (item.subAmount > 0) item.children = []
|
||||
item.children = []
|
||||
if (item.subAmount && item.subAmount > 0) item.children = []
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const columnsExpand = (expanded, record) => {
|
||||
if (expanded) {
|
||||
producePackageBarcodeApi
|
||||
.producePackageBarcodeTreeChildrenList({
|
||||
reportDetailId: record.reportDetailId,
|
||||
reportId: record.reportId,
|
||||
produceReportApi
|
||||
.produceReportTreeChildrenList({
|
||||
docsDetailId: recordTable.id,
|
||||
docsId: record.docsId,
|
||||
parentBarcode: record.barcode
|
||||
})
|
||||
.then((res) => {
|
||||
record.children = res
|
||||
record.children.forEach((item) => {
|
||||
item.children = []
|
||||
})
|
||||
record.children &&
|
||||
record.children.forEach((item) => {
|
||||
if (item.subAmount && item.subAmount > 0)
|
||||
item.children = []
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue