| New file |
| | |
| | | <template> |
| | | <el-container> |
| | | <el-header class="m-header" style="height: auto"> |
| | | <el-row :gutter="10" style="margin-bottom: 5px"> |
| | | <el-col :span="7"> |
| | | <el-date-picker |
| | | v-model="datevalue" |
| | | type="daterange" |
| | | unlink-panels |
| | | range-separator="到" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | :shortcuts="shortcuts" |
| | | :size="size" |
| | | format="YYYY/MM/DD" |
| | | value-format="YYYY-MM-DD" |
| | | /> |
| | | |
| | | </el-col> |
| | | |
| | | <el-col :span="2"> |
| | | <el-button |
| | | id="select" |
| | | type="primary" |
| | | :icon="Search" |
| | | @click="BtnSearchPurchaseOrder">查询 |
| | | </el-button> |
| | | </el-col> |
| | | </el-row> |
| | | </el-header> |
| | | <el-main style="padding-top: 5px;height:100%"> |
| | | <vxe-grid |
| | | |
| | | max-height="600" |
| | | @filter-change="filterChanged" |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | v-on="gridEvents" |
| | | > |
| | | |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row}"> |
| | | <ul class="expand-wrapper"> |
| | | <li v-for="(item,key,index) in row"> |
| | | <span style="font-weight: bold">{{ key + ': ' }}</span> |
| | | <span>{{ item }}</span> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | | |
| | | <!--左边固定显示的插槽--> |
| | | <template #button_slot="{ row }"> |
| | | <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button> |
| | | <!-- <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>--> |
| | | <!-- <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>--> |
| | | </template> |
| | | |
| | | |
| | | <template #num1_filter="{ column, $panel }"> |
| | | <div> |
| | | <div v-for="(option, index) in column.filters" :key="index"> |
| | | <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | </vxe-grid> |
| | | |
| | | |
| | | <vxe-modal v-model="showDetails" title="查看详情" width="600" height="400" :mask="false" :lock-view="false" resize> |
| | | <template #default> |
| | | <vxe-table |
| | | border="inner" |
| | | auto-resize |
| | | show-overflow |
| | | height="auto" |
| | | :row-config="{isHover: true}" |
| | | :show-header="false" |
| | | :sync-resize="showDetails" |
| | | :data="detailData"> |
| | | <vxe-column field="label" width="40%"></vxe-column> |
| | | <vxe-column field="value"></vxe-column> |
| | | </vxe-table> |
| | | </template> |
| | | </vxe-modal> |
| | | |
| | | |
| | | </el-main> |
| | | </el-container> |
| | | </template> |
| | | |
| | | |
| | | <script setup> |
| | | import {ref} from "vue"; |
| | | import {reactive} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | import {Search} from "@element-plus/icons-vue"; |
| | | import dayjs from "dayjs"; |
| | | import {VXETable} from "vxe-table"; |
| | | |
| | | let router = useRouter() |
| | | const getTableRow = (row, type) => { |
| | | switch (type) { |
| | | case 'edit' : { |
| | | //alert('我接收到子组件传送的编辑信息') |
| | | router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}}) |
| | | break |
| | | } |
| | | case 'delete': { |
| | | |
| | | |
| | | |
| | | alert('我接收到子组件传送的删除信息'+row.id) |
| | | break |
| | | } |
| | | } |
| | | } |
| | | |
| | | const xGrid = ref() |
| | | const gridEvents = { |
| | | toolbarButtonClick({code}) { |
| | | const $grid = xGrid.value |
| | | if ($grid) { |
| | | switch (code) { |
| | | case 'Add': {//新增 |
| | | router.push({path: '/main/purchaseOrder/CreatePurchaseOrder'}) |
| | | break |
| | | } |
| | | case 'Sure':{ |
| | | if ($grid.getCheckboxRecords().length === 0) { |
| | | openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'}) |
| | | //VXETable.modal.message( '请选择一条数据!') |
| | | return |
| | | } else { |
| | | const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据!,是否确认退货?'); |
| | | //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据!', status: 'success' }) |
| | | //VXETable.modal.message( '请选择一条数据!') |
| | | return |
| | | } |
| | | break |
| | | } |
| | | case 'Log':{ |
| | | |
| | | openAlert({type: 'alert', content: '点击了退货记录', status: 'success'}) |
| | | break |
| | | } |
| | | |
| | | } |
| | | } |
| | | }, |
| | | toolbarToolClick({code}) { |
| | | const $grid = xGrid.value |
| | | if ($grid) { |
| | | switch (code) { |
| | | case 'myPrint': { |
| | | $grid.print() |
| | | break |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | } |
| | | |
| | | const openAlert = (options) => { |
| | | if(options.type==='message'){ |
| | | VXETable.modal.message(options) |
| | | }else{ |
| | | VXETable.modal.alert(options) |
| | | } |
| | | |
| | | } |
| | | const closeAlert = (id) => { |
| | | VXETable.modal.close(id) |
| | | } |
| | | |
| | | const confirmEvent = async () => { |
| | | const type = await VXETable.modal.confirm('您确定要删除吗?') |
| | | VXETable.modal.message({ content: `点击了 ${type}` }) |
| | | } |
| | | |
| | | const BtnSearchPurchaseOrder =()=>{ |
| | | for (let i = 1; i < 6; i++) { |
| | | const randomInt = Math.floor(Math.random() * 999) + 1000;//4位数随机数 |
| | | const randomSumInt = Math.floor(Math.random() * 99) + 10;//2位数随机数 |
| | | const randomOrderInt = Math.floor(Math.random() * 99) + 100;//3位数随机数 |
| | | const t = i % 2 === 0 ? 5 : 6; |
| | | const s = i % 2 === 0 ? '入库' :i % 3 === 0?'退货':'部分入库'; |
| | | const thdh = i % 2 === 0 ? '' :i % 3 === 0?'THID'+randomOrderInt:''; |
| | | const CGNo = 'NGCG231200' + randomOrderInt;//采购编号 |
| | | const wlNo = 'NGWL1000' + randomInt; |
| | | const xh = 'NGXH' + randomSumInt; |
| | | const wlmc = 'WLMC' + randomInt; |
| | | const gys = '供应商' + randomSumInt; |
| | | const xhdh='NG231200'+randomOrderInt; |
| | | const w = i % 2 === 0 ? '3300' : i % 3 === 0 ? '3660' : i % 4 === 0 ? '2250' : '2580'; |
| | | const h = i % 2 === 0 ? '2440' : i % 3 === 0 ? '2440' : i % 4 === 0 ? '2000' : '2300'; |
| | | const dw = i % 2 === 0 ? '片' : i % 3 === 0 ? '平米' : i % 4 === 0 ? '包' : '吨'; |
| | | now.setDate(now.getDate() + 1); |
| | | gridOptions.data.push({ |
| | | cgdh: CGNo, |
| | | thdh:thdh, |
| | | h: t, |
| | | xh: xh, |
| | | wlbh: wlNo, |
| | | wlmc: wlmc, |
| | | gys: gys, |
| | | w: w, |
| | | g: h, |
| | | dw: dw, |
| | | cgzt:s, |
| | | rq:dayjs(now).format('YYYY-MM-DD'), |
| | | yl:randomSumInt, |
| | | sl:randomOrderInt, |
| | | xsdh:xhdh, |
| | | je:randomInt, |
| | | 6: '139xxxxxxxx', |
| | | |
| | | }) |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | |
| | | //组件接收参数 |
| | | const gridOptions = reactive({ |
| | | border: "full",//表格加边框 |
| | | keepSource: true,//保持源数据 |
| | | align: 'center',//文字居中 |
| | | stripe: true,//斑马纹 |
| | | rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮 |
| | | id: 'CustomerList', |
| | | showFooter: true,//显示脚 |
| | | printConfig: {}, |
| | | importConfig: {}, |
| | | exportConfig: {}, |
| | | scrollY: {enabled: true},//开启虚拟滚动 |
| | | showOverflow: true, |
| | | columnConfig: { |
| | | resizable: true, |
| | | useKey: true |
| | | }, |
| | | filterConfig: { //筛选配置项 |
| | | remote: true |
| | | }, |
| | | customConfig: { |
| | | storage: true |
| | | }, |
| | | editConfig: { |
| | | trigger: 'click', |
| | | mode: 'row', |
| | | showStatus: true |
| | | }, |
| | | columns: [ |
| | | {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"}, |
| | | {type: 'seq', fixed: "left", title: ' ', width: 50}, |
| | | { type: 'checkbox',fixed:"left", title: '', width: 50 }, |
| | | {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50}, |
| | | {field: 'thdh', width: '10%', title: '退货单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'cgdh', width: '10%', title: '采购单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'cgzt', width: '10%', title: '状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'gys', width: '10%',title: '供应商', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'wlbh', width: '10%',title: '物料编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'wlmc', width: '10%', title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'xh', width: '8%',title: '型号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'dw', width: '8%',title: '单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '12%',title: '不含税单价', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'sl', width: '8%',title: '数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'sl', width: '12%',title: '已采购数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'je', width: '8%',title: '金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'je', width: '12%',title: '不含税金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '8%',title: '税率', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'sl', width: '8%',title: '库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'yl', width: '10%',title: '周用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'yl', width: '10%',title: '月用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'cgzt', width: '10%',title: '单据状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'xsdh', width: '10%',title: '销售单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'rq', width: '10%',title: '制单日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '10%', title: '制单人', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '10%',title: '采购部门', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '10%',title: '采购组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true} |
| | | ],//表头参数 |
| | | toolbarConfig: { |
| | | buttons: [{type:'text'},{ |
| | | 'name': '退货记录', |
| | | |
| | | 'code':'Log' |
| | | }, |
| | | { |
| | | 'name': '确认退货', |
| | | status:'primary', |
| | | 'code':'Sure' |
| | | }], |
| | | import: false, |
| | | export: true, |
| | | print: true, |
| | | zoom: true, |
| | | custom: true, |
| | | style: 'paddling-left:10px' |
| | | },//表头按钮 |
| | | data: [],//table body实际数据 |
| | | mergeFooterItems: [ |
| | | {row: 0, col: 0, rowspan: 1, colspan: 4} |
| | | ],//合并脚 |
| | | footerMethod({columns, data}) {//页脚函数 |
| | | return [ |
| | | columns.map((column, columnIndex) => { |
| | | if (columnIndex === 0) { |
| | | return '合计:' |
| | | } |
| | | /* if (props.tableProp.footList.includes(column.field)) { |
| | | return sumNum(data, column.field) |
| | | }*/ |
| | | return '' |
| | | }) |
| | | ] |
| | | }, |
| | | |
| | | }) |
| | | |
| | | /*const showDetails = ref(false) |
| | | const detailData = ref([]) |
| | | const cellClickEvent = ({ row }) => { |
| | | detailData.value = ['采购单号', 'wlbh', 'wlmc', 'gys', 'h', 'k', 'g'].map(field => { |
| | | return { label: field, value: row[field] } |
| | | }) |
| | | showDetails.value = true |
| | | }*/ |
| | | |
| | | |
| | | const now = new Date() |
| | | |
| | | //时间快捷选择 |
| | | const datevalue = ref('') |
| | | const shortcuts = [ |
| | | { |
| | | text: '近一周', |
| | | value: () => { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 7) |
| | | return [start, end] |
| | | }, |
| | | }, |
| | | { |
| | | text: '近一个月', |
| | | value: () => { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) |
| | | return [start, end] |
| | | }, |
| | | }, |
| | | { |
| | | text: '近三个月', |
| | | value: () => { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 90) |
| | | return [start, end] |
| | | }, |
| | | }, |
| | | ] |
| | | |
| | | </script> |
| | | |
| | | |
| | | <style scoped> |
| | | |
| | | </style> |
| New file |
| | |
| | | <template> |
| | | <el-container> |
| | | <el-header class="m-header" style="height: auto"> |
| | | <el-row :gutter="10" style="margin-bottom: 5px"> |
| | | <el-col :span="7"> |
| | | <el-date-picker |
| | | v-model="datevalue" |
| | | type="daterange" |
| | | unlink-panels |
| | | range-separator="到" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | :shortcuts="shortcuts" |
| | | :size="size" |
| | | format="YYYY/MM/DD" |
| | | value-format="YYYY-MM-DD" |
| | | /> |
| | | |
| | | </el-col> |
| | | |
| | | <el-col :span="2"> |
| | | <el-button |
| | | id="select" |
| | | type="primary" |
| | | :icon="Search" |
| | | @click="BtnSearchPurchaseOrder">查询 |
| | | </el-button> |
| | | </el-col> |
| | | </el-row> |
| | | </el-header> |
| | | <el-main style="padding-top: 5px;height:100%"> |
| | | <vxe-grid |
| | | |
| | | max-height="600" |
| | | @filter-change="filterChanged" |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | v-on="gridEvents" |
| | | > |
| | | |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row}"> |
| | | <ul class="expand-wrapper"> |
| | | <li v-for="(item,key,index) in row"> |
| | | <span style="font-weight: bold">{{ key + ': ' }}</span> |
| | | <span>{{ item }}</span> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | | |
| | | <!--左边固定显示的插槽--> |
| | | <template #button_slot="{ row }"> |
| | | <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button> |
| | | <!-- <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>--> |
| | | <!-- <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>--> |
| | | </template> |
| | | |
| | | |
| | | <template #num1_filter="{ column, $panel }"> |
| | | <div> |
| | | <div v-for="(option, index) in column.filters" :key="index"> |
| | | <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | </vxe-grid> |
| | | |
| | | |
| | | <vxe-modal v-model="showDetails" title="查看详情" width="600" height="400" :mask="false" :lock-view="false" resize> |
| | | <template #default> |
| | | <vxe-table |
| | | border="inner" |
| | | auto-resize |
| | | show-overflow |
| | | height="auto" |
| | | :row-config="{isHover: true}" |
| | | :show-header="false" |
| | | :sync-resize="showDetails" |
| | | :data="detailData"> |
| | | <vxe-column field="label" width="40%"></vxe-column> |
| | | <vxe-column field="value"></vxe-column> |
| | | </vxe-table> |
| | | </template> |
| | | </vxe-modal> |
| | | |
| | | |
| | | </el-main> |
| | | </el-container> |
| | | </template> |
| | | |
| | | |
| | | <script setup> |
| | | import {ref} from "vue"; |
| | | import {reactive} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | import {Search} from "@element-plus/icons-vue"; |
| | | import dayjs from "dayjs"; |
| | | import {VXETable} from "vxe-table"; |
| | | |
| | | let router = useRouter() |
| | | const getTableRow = (row, type) => { |
| | | switch (type) { |
| | | case 'edit' : { |
| | | //alert('我接收到子组件传送的编辑信息') |
| | | router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}}) |
| | | break |
| | | } |
| | | case 'delete': { |
| | | |
| | | |
| | | |
| | | alert('我接收到子组件传送的删除信息'+row.id) |
| | | break |
| | | } |
| | | } |
| | | } |
| | | |
| | | const xGrid = ref() |
| | | const gridEvents = { |
| | | toolbarButtonClick({code}) { |
| | | const $grid = xGrid.value |
| | | if ($grid) { |
| | | switch (code) { |
| | | case 'Sure':{ |
| | | if ($grid.getCheckboxRecords().length === 0) { |
| | | openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'}) |
| | | //VXETable.modal.message( '请选择一条数据!') |
| | | return |
| | | } else { |
| | | const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据!,是否确认退货?'); |
| | | //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据!', status: 'success' }) |
| | | //VXETable.modal.message( '请选择一条数据!') |
| | | return |
| | | } |
| | | break |
| | | } |
| | | case 'Log':{ |
| | | |
| | | openAlert({type: 'alert', content: '点击了退货记录', status: 'success'}) |
| | | break |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | toolbarToolClick({code}) { |
| | | const $grid = xGrid.value |
| | | if ($grid) { |
| | | switch (code) { |
| | | case 'myPrint': { |
| | | $grid.print() |
| | | break |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | } |
| | | |
| | | const openAlert = (options) => { |
| | | if(options.type==='message'){ |
| | | VXETable.modal.message(options) |
| | | }else{ |
| | | VXETable.modal.alert(options) |
| | | } |
| | | |
| | | } |
| | | const closeAlert = (id) => { |
| | | VXETable.modal.close(id) |
| | | } |
| | | |
| | | const confirmEvent = async () => { |
| | | const type = await VXETable.modal.confirm('您确定要删除吗?') |
| | | VXETable.modal.message({ content: `点击了 ${type}` }) |
| | | } |
| | | |
| | | const BtnSearchPurchaseOrder =()=>{ |
| | | for (let i = 1; i < 6; i++) { |
| | | const randomInt = Math.floor(Math.random() * 999) + 1000;//4位数随机数 |
| | | const randomSumInt = Math.floor(Math.random() * 99) + 10;//2位数随机数 |
| | | const randomOrderInt = Math.floor(Math.random() * 99) + 100;//3位数随机数 |
| | | const t = i % 2 === 0 ? 5 : 6; |
| | | const s = i % 2 === 0 ? '入库':i % 3 === 0 ? '待审核' : '已采购'; |
| | | const rkdh = i % 2 === 0 ? 'RKID'+randomOrderInt:i % 3 === 0 ? '' : ''; |
| | | const CGNo = 'NGCG231200' + randomOrderInt;//采购编号 |
| | | const wlNo = 'NGWL1000' + randomInt; |
| | | const xh = 'NGXH' + randomSumInt; |
| | | const wlmc = 'WLMC' + randomInt; |
| | | const gys = '供应商' + randomSumInt; |
| | | const xhdh='NG231200'+randomOrderInt; |
| | | const w = i % 2 === 0 ? '3300' : i % 3 === 0 ? '3660' : i % 4 === 0 ? '2250' : '2580'; |
| | | const h = i % 2 === 0 ? '2440' : i % 3 === 0 ? '2440' : i % 4 === 0 ? '2000' : '2300'; |
| | | const dw = i % 2 === 0 ? '片' : i % 3 === 0 ? '平米' : i % 4 === 0 ? '包' : '吨'; |
| | | now.setDate(now.getDate() + 1); |
| | | gridOptions.data.push({ |
| | | cgdh: CGNo, |
| | | rkdh:rkdh, |
| | | h: t, |
| | | xh: xh, |
| | | wlbh: wlNo, |
| | | wlmc: wlmc, |
| | | gys: gys, |
| | | w: w, |
| | | g: h, |
| | | dw: dw, |
| | | cgzt:s, |
| | | rq:dayjs(now).format('YYYY-MM-DD'), |
| | | yl:randomSumInt, |
| | | sl:randomOrderInt, |
| | | xsdh:xhdh, |
| | | je:randomInt, |
| | | 6: '139xxxxxxxx', |
| | | |
| | | }) |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | |
| | | //组件接收参数 |
| | | const gridOptions = reactive({ |
| | | border: "full",//表格加边框 |
| | | keepSource: true,//保持源数据 |
| | | align: 'center',//文字居中 |
| | | stripe: true,//斑马纹 |
| | | rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮 |
| | | id: 'CustomerList', |
| | | showFooter: true,//显示脚 |
| | | printConfig: {}, |
| | | importConfig: {}, |
| | | exportConfig: {}, |
| | | scrollY: {enabled: true},//开启虚拟滚动 |
| | | showOverflow: true, |
| | | columnConfig: { |
| | | resizable: true, |
| | | useKey: true |
| | | }, |
| | | filterConfig: { //筛选配置项 |
| | | remote: true |
| | | }, |
| | | customConfig: { |
| | | storage: true |
| | | }, |
| | | editConfig: { |
| | | trigger: 'click', |
| | | mode: 'row', |
| | | showStatus: true |
| | | }, |
| | | columns: [ |
| | | {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"}, |
| | | {type: 'seq', fixed: "left", title: ' ', width: 50}, |
| | | { type: 'checkbox',fixed:"left", title: '', width: 50 }, |
| | | {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50}, |
| | | {field: 'rkdh', width: '10%', title: '入库单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'cgdh', width: '10%', title: '采购单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'cgzt', width: '10%', title: '状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'gys', width: '10%',title: '供应商', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'wlbh', width: '10%',title: '物料编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'wlmc', width: '10%', title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'xh', width: '8%',title: '型号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'dw', width: '8%',title: '单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '12%',title: '不含税单价', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'sl', width: '8%',title: '数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'sl', width: '12%',title: '已采购数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'je', width: '8%',title: '金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'je', width: '12%',title: '不含税金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '8%',title: '税率', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'sl', width: '8%',title: '库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'yl', width: '10%',title: '周用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'yl', width: '10%',title: '月用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'cgzt', width: '10%',title: '单据状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'xsdh', width: '10%',title: '销售单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: 'rq', width: '10%',title: '制单日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '10%', title: '制单人', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '10%',title: '采购部门', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '10%',title: '采购组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}, |
| | | {field: '6', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true} |
| | | ],//表头参数 |
| | | toolbarConfig: { |
| | | buttons: [{type:'text'/*,name:'订单入库'*/},{ |
| | | 'name': '入库记录', |
| | | |
| | | 'code':'Log' |
| | | }, |
| | | { |
| | | 'name': '确认入库', |
| | | status:'primary', |
| | | 'code':'Sure' |
| | | }], |
| | | import: false, |
| | | export: true, |
| | | print: true, |
| | | zoom: true, |
| | | custom: true, |
| | | style: 'paddling-left:10px' |
| | | },//表头按钮 |
| | | data: [],//table body实际数据 |
| | | mergeFooterItems: [ |
| | | {row: 0, col: 0, rowspan: 1, colspan: 4} |
| | | ],//合并脚 |
| | | footerMethod({columns, data}) {//页脚函数 |
| | | return [ |
| | | columns.map((column, columnIndex) => { |
| | | if (columnIndex === 0) { |
| | | return '合计:' |
| | | } |
| | | /* if (props.tableProp.footList.includes(column.field)) { |
| | | return sumNum(data, column.field) |
| | | }*/ |
| | | return '' |
| | | }) |
| | | ] |
| | | }, |
| | | |
| | | }) |
| | | |
| | | /*const showDetails = ref(false) |
| | | const detailData = ref([]) |
| | | const cellClickEvent = ({ row }) => { |
| | | detailData.value = ['采购单号', 'wlbh', 'wlmc', 'gys', 'h', 'k', 'g'].map(field => { |
| | | return { label: field, value: row[field] } |
| | | }) |
| | | showDetails.value = true |
| | | }*/ |
| | | |
| | | |
| | | const now = new Date() |
| | | |
| | | //时间快捷选择 |
| | | const datevalue = ref('') |
| | | const shortcuts = [ |
| | | { |
| | | text: '近一周', |
| | | value: () => { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 7) |
| | | return [start, end] |
| | | }, |
| | | }, |
| | | { |
| | | text: '近一个月', |
| | | value: () => { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) |
| | | return [start, end] |
| | | }, |
| | | }, |
| | | { |
| | | text: '近三个月', |
| | | value: () => { |
| | | const end = new Date() |
| | | const start = new Date() |
| | | start.setTime(start.getTime() - 3600 * 1000 * 24 * 90) |
| | | return [start, end] |
| | | }, |
| | | }, |
| | | ] |
| | | |
| | | </script> |
| | | |
| | | |
| | | <style scoped> |
| | | |
| | | </style> |