| | |
| | | <template> |
| | | <basicContainer > |
| | | <avue-crud |
| | | :option="option" |
| | | :table-loading="pageF.loading" |
| | | :data="tableData" |
| | | :page="page" |
| | | :permission="permissionList" |
| | | :before-open="beforeOpen" |
| | | v-model="form" |
| | | ref="crudRef" |
| | | @row-update="rowUpdate" |
| | | @row-save="rowSave" |
| | | @refresh-change="refreshChange" |
| | | @row-del="rowDel" |
| | | @search-change="searchChange" |
| | | @search-reset="searchReset" |
| | | @selection-change="selectionChange" |
| | | @current-change="currentChange" |
| | | @size-change="sizeChange" |
| | | @on-load="onLoad" |
| | | > |
| | | <basicContainer> |
| | | <avue-crud :option="option" :table-loading="pageF.loading" :data="tableData" :page="page" |
| | | :permission="permissionList" :before-open="beforeOpen" v-model="form" ref="crudRef" @row-update="rowUpdate" |
| | | @row-save="rowSave" @refresh-change="refreshChange" @row-del="rowDel" @search-change="searchChange" |
| | | @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange" |
| | | @size-change="sizeChange" @on-load="onLoad"> |
| | | <template #menu-left> |
| | | <el-button |
| | | type="success" |
| | | icon="Edit" |
| | | :disabled="pageF.single" |
| | | v-hasPermi="['cwgl:keyCollectionInfo:edit']" |
| | | @click="handleUpdate">修改 |
| | | <el-button type="success" icon="Edit" :disabled="pageF.single" v-hasPermi="['cwgl:keyCollectionInfo:edit']" |
| | | @click="handleUpdate">修改 |
| | | </el-button> |
| | | <el-button |
| | | type="danger" |
| | | icon="Delete" |
| | | :disabled="pageF.multiple" |
| | | @click="handleDelete" |
| | | v-hasPermi="['cwgl:keyCollectionInfo:remove']" |
| | | >删除 |
| | | <el-button type="danger" icon="Delete" :disabled="pageF.multiple" @click="handleDelete" |
| | | v-hasPermi="['cwgl:keyCollectionInfo:remove']">删除 |
| | | </el-button> |
| | | <el-button |
| | | type="warning" |
| | | plain |
| | | icon="Download" |
| | | @click="handleExport" |
| | | v-hasPermi="['cwgl:keyCollectionInfo:export']" |
| | | >导出 |
| | | <el-button type="warning" plain icon="Download" @click="handleExport" |
| | | v-hasPermi="['cwgl:keyCollectionInfo:export']">导出 |
| | | </el-button> |
| | | </template> |
| | | </avue-crud> |
| | |
| | | </template> |
| | | |
| | | <script setup name="keyCollectionInfo" lang="ts"> |
| | | import {KeyCollectionInfoI,addKeyCollectionInfo, delKeyCollectionInfo, exportKeyCollectionInfo, getKeyCollectionInfo, listKeyCollectionInfo, updateKeyCollectionInfo} from "@/api/cwgl/keyCollectionInfo"; |
| | | import useCurrentInstance from "@/utils/useCurrentInstance"; |
| | | import {computed,reactive, ref, toRefs} from "vue"; |
| | | import {PagesInterface, PageQueryInterface} from "@/utils/globalInterface"; |
| | | import {usePagePlus} from "@/hooks/usePagePlus"; |
| | | import {hasPermission} from "@/utils/permissionUtils"; |
| | | import { KeyCollectionInfoI, addKeyCollectionInfo, delKeyCollectionInfo, exportKeyCollectionInfo, getKeyCollectionInfo, listKeyCollectionInfo, updateKeyCollectionInfo } from "@/api/cwgl/keyCollectionInfo"; |
| | | import useCurrentInstance from "@/utils/useCurrentInstance"; |
| | | import { computed, reactive, ref, toRefs } from "vue"; |
| | | import { PagesInterface, PageQueryInterface } from "@/utils/globalInterface"; |
| | | import { usePagePlus } from "@/hooks/usePagePlus"; |
| | | import { hasPermission } from "@/utils/permissionUtils"; |
| | | |
| | | const { proxy } = useCurrentInstance(); |
| | | const crudRef = ref(); |
| | | const { proxy } = useCurrentInstance(); |
| | | const crudRef = ref(); |
| | | |
| | | const permissionList = computed(()=>{ |
| | | return { |
| | | addBtn: hasPermission(["cwgl:keyCollectionInfo:add"]), |
| | | delBtn: hasPermission(["cwgl:keyCollectionInfo:remove"]), |
| | | editBtn: hasPermission(["cwgl:keyCollectionInfo:edit"]), |
| | | viewBtn: hasPermission(["cwgl:keyCollectionInfo:query"]), |
| | | } |
| | | }) |
| | | const permissionList = computed(() => { |
| | | return { |
| | | addBtn: hasPermission(["cwgl:keyCollectionInfo:add"]), |
| | | delBtn: hasPermission(["cwgl:keyCollectionInfo:remove"]), |
| | | editBtn: hasPermission(["cwgl:keyCollectionInfo:edit"]), |
| | | viewBtn: hasPermission(["cwgl:keyCollectionInfo:query"]), |
| | | } |
| | | }) |
| | | |
| | | const data = reactive({ |
| | | form:<KeyCollectionInfoI>{}, |
| | | queryParams:<KeyCollectionInfoI&PageQueryInterface>{}, |
| | | page: <PagesInterface>{ |
| | | pageSize: 10, |
| | | total: 0, |
| | | currentPage: 1, |
| | | const data = reactive({ |
| | | form: <KeyCollectionInfoI>{}, |
| | | queryParams: <KeyCollectionInfoI & PageQueryInterface>{}, |
| | | page: <PagesInterface>{ |
| | | pageSize: 10, |
| | | total: 0, |
| | | currentPage: 1, |
| | | }, |
| | | selectionList: [], |
| | | }) |
| | | const { queryParams, form, page, selectionList } = toRefs(data); |
| | | const option = ref({ |
| | | pageKey: 'KeyCollectionInfo', |
| | | rowKey: 'id', |
| | | menu: false, |
| | | addBtn: false, |
| | | editBtn: false, |
| | | delBtn: false, |
| | | viewBtn: false, |
| | | selection: false, |
| | | searchSpan: 5, |
| | | searchLabelWidth: 120, |
| | | labelWidth: 130, |
| | | column: { |
| | | // id: { |
| | | // label: 'ID', |
| | | // }, |
| | | customerName: { |
| | | label: '客户名称', |
| | | minWidth: 200, |
| | | search: true, |
| | | }, |
| | | selectionList:[], |
| | | }) |
| | | const {queryParams,form,page,selectionList} = toRefs(data); |
| | | const option = ref({ |
| | | pageKey: 'KeyCollectionInfo', |
| | | rowKey: 'id', |
| | | column: { |
| | | id: { |
| | | label: 'ID', |
| | | }, |
| | | customerName: { |
| | | label: '客户名称', |
| | | }, |
| | | carrier: { |
| | | label: '承运商', |
| | | }, |
| | | dispatchNo: { |
| | | label: '调度单号', |
| | | }, |
| | | driverName: { |
| | | label: '司机名称', |
| | | }, |
| | | driverMobile: { |
| | | label: '司机手机号', |
| | | }, |
| | | licensePlateNumber: { |
| | | label: '车牌号', |
| | | }, |
| | | orderTime: { |
| | | label: '订单下单时间', |
| | | }, |
| | | orderCreatedTime: { |
| | | label: '订单创建时间', |
| | | }, |
| | | dispatchCreatedTime: { |
| | | label: '调度单创建时间', |
| | | }, |
| | | keyCollectionTime: { |
| | | label: '钥匙领取时间', |
| | | }, |
| | | estimatedDepartureTime: { |
| | | label: '预计出发时间', |
| | | }, |
| | | requiredArrivalTime: { |
| | | label: '要求到达时间', |
| | | }, |
| | | consignorAddress: { |
| | | label: '出发地地址', |
| | | type: 'textarea', minRows: 3, maxRows: 5, |
| | | }, |
| | | consigneeAddress: { |
| | | label: '目的地地址', |
| | | type: 'textarea', minRows: 3, maxRows: 5, |
| | | }, |
| | | mainDriver: { |
| | | label: '主驾驶员', |
| | | }, |
| | | pointNum: { |
| | | label: '提送货点数', |
| | | }, |
| | | transportMode: { |
| | | label: '运输方式', |
| | | }, |
| | | assistantDriver: { |
| | | label: '副驾驶员', |
| | | }, |
| | | quantity: { |
| | | label: '件数', |
| | | }, |
| | | dispatchQuantity: { |
| | | label: '实发件数', |
| | | }, |
| | | remark: { |
| | | label: '备注', |
| | | type: 'textarea', minRows: 3, maxRows: 5, |
| | | }, |
| | | } |
| | | }) |
| | | carrier: { |
| | | label: '承运商', |
| | | minWidth: 200, |
| | | showOverflowTooltip: true, |
| | | }, |
| | | dispatchNo: { |
| | | label: '调度单号', |
| | | minWidth: 200, |
| | | search: true, |
| | | }, |
| | | driverName: { |
| | | label: '司机名称', |
| | | }, |
| | | driverMobile: { |
| | | label: '司机手机号', |
| | | minWidth: 200, |
| | | }, |
| | | licensePlateNumber: { |
| | | label: '车牌号', |
| | | minWidth: 150, |
| | | }, |
| | | orderTime: { |
| | | label: '订单下单时间', |
| | | minWidth: 180, |
| | | search: true, |
| | | type: 'datetime', // 改为 datetime 类型 |
| | | format: 'YYYY-MM-DD HH:mm:ss', |
| | | valueFormat: 'YYYY-MM-DD HH:mm:ss', |
| | | minWidth: 200, |
| | | }, |
| | | orderCreatedTime: { |
| | | label: '订单创建时间', |
| | | minWidth: 180, |
| | | search: true, |
| | | type: 'datetime', // 改为 datetime 类型 |
| | | format: 'YYYY-MM-DD HH:mm:ss', |
| | | valueFormat: 'YYYY-MM-DD HH:mm:ss', |
| | | minWidth: 200, |
| | | }, |
| | | dispatchCreatedTime: { |
| | | label: '调度单创建时间', |
| | | minWidth: 180, |
| | | search: true, |
| | | type: 'datetime', // 改为 datetime 类型 |
| | | format: 'YYYY-MM-DD HH:mm:ss', |
| | | valueFormat: 'YYYY-MM-DD HH:mm:ss', |
| | | minWidth: 200, |
| | | }, |
| | | keyCollectionTime: { |
| | | label: '钥匙领取时间', |
| | | minWidth: 180, |
| | | type: 'datetime', // 改为 datetime 类型 |
| | | format: 'YYYY-MM-DD HH:mm:ss', |
| | | valueFormat: 'YYYY-MM-DD HH:mm:ss', |
| | | minWidth: 200, |
| | | }, |
| | | estimatedDepartureTime: { |
| | | minWidth: 180, |
| | | type: 'datetime', // 改为 datetime 类型 |
| | | format: 'YYYY-MM-DD HH:mm:ss', |
| | | valueFormat: 'YYYY-MM-DD HH:mm:ss', |
| | | minWidth: 200, |
| | | label: '预计出发时间', |
| | | }, |
| | | requiredArrivalTime: { |
| | | label: '要求到达时间', |
| | | minWidth: 180, |
| | | type: 'datetime', // 改为 datetime 类型 |
| | | format: 'YYYY-MM-DD HH:mm:ss', |
| | | valueFormat: 'YYYY-MM-DD HH:mm:ss', |
| | | minWidth: 200, |
| | | }, |
| | | consignorAddress: { |
| | | label: '出发地地址', |
| | | showOverflowTooltip: true, |
| | | minWidth: 200, |
| | | type: 'textarea', minRows: 3, maxRows: 5, |
| | | }, |
| | | consigneeAddress: { |
| | | label: '目的地地址', |
| | | showOverflowTooltip: true, |
| | | minWidth: 200, |
| | | type: 'textarea', minRows: 3, maxRows: 5, |
| | | }, |
| | | mainDriver: { |
| | | label: '主驾驶员', |
| | | minWidth: 150, |
| | | }, |
| | | pointNum: { |
| | | label: '提送货点数', |
| | | minWidth: 150, |
| | | }, |
| | | transportMode: { |
| | | label: '运输方式', |
| | | minWidth: 150, |
| | | }, |
| | | assistantDriver: { |
| | | label: '副驾驶员', |
| | | minWidth: 150, |
| | | }, |
| | | quantity: { |
| | | label: '件数', |
| | | }, |
| | | dispatchQuantity: { |
| | | label: '实发件数', |
| | | }, |
| | | remark: { |
| | | minWidth: 150, |
| | | showOverflowTooltip: true, |
| | | label: '备注', |
| | | type: 'textarea', minRows: 3, maxRows: 5, |
| | | }, |
| | | } |
| | | }) |
| | | |
| | | const { tableData,pageF,rowSave,rowUpdate,rowDel,beforeOpen,searchChange, |
| | | searchReset,selectionChange,onLoad,currentChange,sizeChange,handleDelete,handleExport,handleUpdate,refreshChange} = usePagePlus({ |
| | | form:form, |
| | | option:option, |
| | | queryParams:queryParams, |
| | | idKey:'id', |
| | | page:page.value, |
| | | getListApi:listKeyCollectionInfo, |
| | | getDetailApi:getKeyCollectionInfo, |
| | | exportApi:exportKeyCollectionInfo, |
| | | deleteApi:delKeyCollectionInfo, |
| | | addApi:addKeyCollectionInfo, |
| | | updateApi:updateKeyCollectionInfo, |
| | | handleUpdateFunc:()=>{ |
| | | const { tableData, pageF, rowSave, rowUpdate, rowDel, beforeOpen, searchChange, |
| | | searchReset, selectionChange, onLoad, currentChange, sizeChange, handleDelete, handleExport, handleUpdate, refreshChange } = usePagePlus({ |
| | | form: form, |
| | | option: option, |
| | | queryParams: queryParams, |
| | | idKey: 'id', |
| | | page: page.value, |
| | | getListApi: listKeyCollectionInfo, |
| | | getDetailApi: getKeyCollectionInfo, |
| | | exportApi: exportKeyCollectionInfo, |
| | | deleteApi: delKeyCollectionInfo, |
| | | addApi: addKeyCollectionInfo, |
| | | updateApi: updateKeyCollectionInfo, |
| | | handleUpdateFunc: () => { |
| | | crudRef.value.rowEdit(selectionList.value[0]); |
| | | }, |
| | | handleSelectionChangeFunc:(selection:any)=>{ |
| | | handleSelectionChangeFunc: (selection: any) => { |
| | | selectionList.value = selection; |
| | | } |
| | | }) |
| | | |
| | | |
| | | </script> |
| | | <style scoped> |
| | | ::v-deep .el-descriptions__body .el-descriptions__table.is-bordered .el-descriptions__cell { |
| | | border: var(--el-descriptions-table-border); |
| | | padding: 8px 11px; |
| | | width: 200px; |
| | | } |
| | | |
| | | :deep(.avue-crud__table) { |
| | | overflow-y: auto; |
| | | } |
| | | |
| | | :deep(.el-scrollbar__bar.is-horizontal) { |
| | | pointer-events: auto; |
| | | } |
| | | </style> |