订单管理

2026-01-29 14:51:16 +08:00 · 2026-01-29 14:51:16 +08:00 · 03eb338eb1
parent 7dcb5d53ff
commit 03eb338eb1
16 changed files with 351 additions and 23 deletions
--- a/index.html
+++ b/index.html
@ -30,7 +30,6 @@
      margin: 0;
      padding: 0;
      border: 0;
-      user-select: none;
    }
  </style>
  <title></title>
--- a/plugin/iconfont-process.ts
+++ b/plugin/iconfont-process.ts
@ -24,6 +24,7 @@ function createTs(text: string) {
  const tsContent = `export const icons = ${text.trim()} as const

 export type IconName = (typeof icons.glyphs)[number]['font_class']
+export const iconNames = icons.glyphs.map(it => it.font_class)

 export interface IconGlyphs {
  icon_id: string
--- a/src/assets/stylus/index.styl
+++ b/src/assets/stylus/index.styl
@ -47,7 +47,7 @@
  text-align-last: justify;
  display: inline-block !important;
  position: relative;
-  padding 0 12px !important;
+  padding 0 12px 0 0 !important;
 }

 .el-form-item.is-error {
--- a/src/assets/stylus/menu.styl
+++ b/src/assets/stylus/menu.styl
@ -24,6 +24,15 @@
  }
 }

+
+.el-menu--collapse .el-sub-menu.is-active .el-sub-menu__title {
+  color #5D87FF !important;
+}
+
+.el-sub-menu.is-active .el-sub-menu__title {
+  border-bottom-color: #5D87FF !important;
+}
+
 .el-sub-menu__title,
 .el-menu-item {
  height: 42px !important;
--- a/src/assets/stylus/root.styl
+++ b/src/assets/stylus/root.styl
@ -20,6 +20,18 @@ body {
  .region .el-radio-button__original-radio:checked + .el-radio-button__inner {
    color: var(--theme-color) !important;
  }
+  letter-spacing: 1px;
+  user-select: none;
+}
+
+.el-message-box {
+  --el-messagebox-width 300px !important
+  max-width unset !important
+  width unset !important;
+}
+
+.el-message-box__container {
+  justify-content center
 }

 :focus-visible {
--- a/src/components/a-icon/iconfont.css
+++ b/src/components/a-icon/iconfont.css
@ -1,8 +1,8 @@
@font-face {
  font-family: "iconfont"; /* 项目名称 再昇云 */
-  src: url('@/components/a-icon/iconfont.woff2?t=1769142012944') format('woff2'),
-  url('@/components/a-icon/iconfont.woff?t=1769142012944') format('woff'),
-  url('@/components/a-icon/iconfont.ttf?t=1769142012944') format('truetype');
+  src: url('@/components/a-icon/iconfont.woff2?t=1769666423879') format('woff2'),
+  url('@/components/a-icon/iconfont.woff?t=1769666423879') format('woff'),
+  url('@/components/a-icon/iconfont.ttf?t=1769666423879') format('truetype');
 }

 .iconfont {
@ -13,6 +13,30 @@
  -moz-osx-font-smoothing: grayscale;
 }

+.icon-liandan:before {
+  content: "\e65e";
+}
+
+.icon-chakanliaodan:before {
+  content: "\e6fc";
+}
+
+.icon-approach:before {
+  content: "\e69d";
+}
+
+.icon-carexit:before {
+  content: "\e69f";
+}
+
+.icon-fapiaotaitou:before {
+  content: "\e85d";
+}
+
+.icon-qiehuanyonghu:before {
+  content: "\e893";
+}
+
 .icon-dianhua-1:before {
  content: "\e65d";
 }
--- a/src/components/a-icon/iconfont.json
+++ b/src/components/a-icon/iconfont.json
@ -5,6 +5,48 @@
  "css_prefix_text": "icon-",
  "description": "",
  "glyphs": [
+    {
+      "icon_id": "15056965",
+      "name": "联单",
+      "font_class": "liandan",
+      "unicode": "e65e",
+      "unicode_decimal": 58974
+    },
+    {
+      "icon_id": "32234102",
+      "name": "查看料单",
+      "font_class": "chakanliaodan",
+      "unicode": "e6fc",
+      "unicode_decimal": 59132
+    },
+    {
+      "icon_id": "17660527",
+      "name": "车辆进场",
+      "font_class": "approach",
+      "unicode": "e69d",
+      "unicode_decimal": 59037
+    },
+    {
+      "icon_id": "17660543",
+      "name": "车辆出场",
+      "font_class": "carexit",
+      "unicode": "e69f",
+      "unicode_decimal": 59039
+    },
+    {
+      "icon_id": "23736496",
+      "name": "发票抬头",
+      "font_class": "fapiaotaitou",
+      "unicode": "e85d",
+      "unicode_decimal": 59485
+    },
+    {
+      "icon_id": "17789296",
+      "name": "切换用户",
+      "font_class": "qiehuanyonghu",
+      "unicode": "e893",
+      "unicode_decimal": 59539
+    },
    {
      "icon_id": "1272171",
      "name": "电话",
--- a/src/components/a-icon/iconfont.ts
+++ b/src/components/a-icon/iconfont.ts
@ -5,6 +5,48 @@ export const icons = {
  'css_prefix_text': 'icon-',
  'description': '',
  'glyphs': [
+    {
+      'icon_id': '15056965',
+      'name': '联单',
+      'font_class': 'liandan',
+      'unicode': 'e65e',
+      'unicode_decimal': 58974,
+    },
+    {
+      'icon_id': '32234102',
+      'name': '查看料单',
+      'font_class': 'chakanliaodan',
+      'unicode': 'e6fc',
+      'unicode_decimal': 59132,
+    },
+    {
+      'icon_id': '17660527',
+      'name': '车辆进场',
+      'font_class': 'approach',
+      'unicode': 'e69d',
+      'unicode_decimal': 59037,
+    },
+    {
+      'icon_id': '17660543',
+      'name': '车辆出场',
+      'font_class': 'carexit',
+      'unicode': 'e69f',
+      'unicode_decimal': 59039,
+    },
+    {
+      'icon_id': '23736496',
+      'name': '发票抬头',
+      'font_class': 'fapiaotaitou',
+      'unicode': 'e85d',
+      'unicode_decimal': 59485,
+    },
+    {
+      'icon_id': '17789296',
+      'name': '切换用户',
+      'font_class': 'qiehuanyonghu',
+      'unicode': 'e893',
+      'unicode_decimal': 59539,
+    },
    {
      'icon_id': '1272171',
      'name': '电话',
@ -761,7 +803,7 @@ export const icons = {
      'unicode': 'e639',
      'unicode_decimal': 58937,
    },
-  ],
+  ]
 } as const

 export type IconName = (typeof icons.glyphs)[number]['font_class']
--- a/src/components/a-icon/iconfont.ttf
+++ b/src/components/a-icon/iconfont.ttf
--- a/src/components/a-icon/iconfont.woff
+++ b/src/components/a-icon/iconfont.woff
--- a/src/components/a-icon/iconfont.woff2
+++ b/src/components/a-icon/iconfont.woff2
--- a/src/components/a-page/a-table-page/ATablePage.tsx
+++ b/src/components/a-page/a-table-page/ATablePage.tsx
@ -69,6 +69,7 @@ interface ActionColumnType<T> {
   * 列宽，默认：80px
   */
  width: number
+  foldLimit: number
  /**
   * 按钮列表
   */
@ -197,6 +198,7 @@ function buildTable<P extends object, T extends object>(table: DeepPartial<Table
  if (table.actionColumn == null) {
    table.actionColumn = {
      width: 80,
+      foldLimit: 3,
      tableActions: [],
    }
  }
@ -210,9 +212,14 @@ function buildTable<P extends object, T extends object>(table: DeepPartial<Table
      if (tableAction.confirm.width == null) tableAction.confirm.width = '180'
    }
  }
-  if (table.actionColumn.width == null) {
-    table.actionColumn.width = Math.min(table.actionColumn.tableActions.length, 3) * 50
+  if (table.actionColumn.foldLimit == null) {
+    table.actionColumn.foldLimit = 3
  }
+
+  if (table.actionColumn.width == null) {
+    table.actionColumn.width = Math.min(table.actionColumn.tableActions.length, table.actionColumn.foldLimit) * 50
+  }
+
  if (table.emptyText == null) {
    table.emptyText = '暂无数据'
  }
@ -357,13 +364,13 @@ const component = defineComponent(
    }
    const actionColumnRender = () => {
      const actionColumn = props.table.actionColumn
-      const len = actionColumn.tableActions.length
      if (Colls.isEmpty(actionColumn.tableActions)) return (<></>)
      return (<ElTableColumn width={actionColumn.width + 'px'} fixed="right" label="操作" prop="tableAction">
        {{
          default: (scope: ColumnScopeType<T>) => {
+            const len = actionColumn.tableActions.filter(it => it.show == null || it.show(scope)).length
            let btns: any[]
-            if (len <= 3) {
+            if (len <= actionColumn.foldLimit) {
              btns = (actionColumn.tableActions
                  .filter(it => (it.show == null ? true : it.show(scope)))
                  .map((tableAction, i) => (tableAction.confirm != null ?
@ -386,7 +393,7 @@ const component = defineComponent(
            } else {
              btns = (actionColumn.tableActions
                  .filter(it => (it.show == null ? true : it.show(scope)))
-                  .filter((_, i) => i < 2)
+                  .filter((_, i) => i < actionColumn.foldLimit - 1)
                  .map((tableAction, i) => (tableAction.confirm != null ?
                    (<ElPopconfirm
                      key={'action-btn-' + i}
@ -433,7 +440,7 @@ const component = defineComponent(
                    {
                      actionColumn.tableActions
                        .filter(it => (it.show == null ? true : it.show(scope)))
-                        .filter((_, i) => i >= 2)
+                        .filter((_, i) => i >= actionColumn.foldLimit - 1)
                        .map((it, i) => {
                          let elIcon: any | undefined = undefined
                          if (iconNames.includes(it.icon as IconName)) {
--- a/src/dts/components.d.ts
+++ b/src/dts/components.d.ts
@ -49,12 +49,12 @@ declare module 'vue' {
    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
    ElTabPane: typeof import('element-plus/es')['ElTabPane']
    ElTabs: typeof import('element-plus/es')['ElTabs']
+    ElTag: typeof import('element-plus/es')['ElTag']
    ElTooltip: typeof import('element-plus/es')['ElTooltip']
    ElUpload: typeof import('element-plus/es')['ElUpload']
    RouterLink: typeof import('vue-router')['RouterLink']
    RouterView: typeof import('vue-router')['RouterView']
  }
-
  export interface GlobalDirectives {
    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
  }
@ -100,6 +100,7 @@ declare global {
  const ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
  const ElTabPane: typeof import('element-plus/es')['ElTabPane']
  const ElTabs: typeof import('element-plus/es')['ElTabs']
+  const ElTag: typeof import('element-plus/es')['ElTag']
  const ElTooltip: typeof import('element-plus/es')['ElTooltip']
  const ElUpload: typeof import('element-plus/es')['ElUpload']
  const RouterLink: typeof import('vue-router')['RouterLink']
--- a/src/pages/order/history/History.vue
+++ b/src/pages/order/history/History.vue
@ -119,7 +119,7 @@ const tablePageProps = buildTablePageProps<OrderTypes.SearchOrderParam, OrderTyp
        {
          tooltip: '三联单',
          type: 'info',
-          icon: 'Position',
+          icon: 'liandan',
          action({row}) {
            bookDetailIns.value?.open(row)
          },
--- a/src/pages/order/realtime/InOutPanel.vue
+++ b/src/pages/order/realtime/InOutPanel.vue
@ -0,0 +1,122 @@
+<script lang="ts" setup>
+import Uploader from '@/components/uploader/Uploader.vue'
+import Utils from '@/common/utils'
+import ADialog from '@/components/a-dialog/ADialog.vue'
+import FormUtil from '@/common/utils/formUtil.ts'
+import {
+  ElMessage,
+  type FormInstance,
+} from 'element-plus'
+
+const orderData = Utils.resetAble(reactive<{
+  id: string
+  licensePlate: string,
+  state: '进场' | '出场',
+}>({
+  id: '',
+  licensePlate: '',
+  state: '进场',
+}))
+const title = computed(() => {
+  return `${orderData.licensePlate} ${orderData.state}`
+})
+
+const formIns = useTemplateRef<FormInstance>('formRef')
+
+const inOutData = Utils.resetAble(reactive({
+  weight: undefined,
+  headerPhoto: undefined,
+  bodyPhoto: undefined,
+}))
+const showDialog = ref(false)
+const submiting = ref(false)
+
+function dialogCloseHandler() {
+  inOutData.$reset()
+}
+
+function submitHandler() {
+  submiting.value = true
+  FormUtil.submit(formIns, () => Promise.resolve())
+    .then(res => {
+      ElMessage.success(`${title.value}成功`)
+      if ((res ?? true)) {
+        showDialog.value = false
+      }
+    })
+    .finally(() => {
+      submiting.value = false
+    })
+}
+
+defineExpose({
+  open(id: string, licensePlate: string, state: '进场' | '出场') {
+    orderData.$reset({
+      id,
+      licensePlate,
+      state,
+    })
+    showDialog.value = true
+  },
+})
+
+</script>
+
+<template>
+  <ADialog
+    v-model:show="showDialog"
+    :closed="dialogCloseHandler"
+    :submit-handler="submitHandler"
+    :title="title"
+  >
+    <ElForm ref="formRef"
+      class="in-out-panel-form"
+      @submit.prevent>
+      <ElFormItem label="磅重" prop="weight">
+        <ElInputNumber v-model="inOutData.weight" :max="200" :min="1" controls-position="right">
+          <template #suffix>吨</template>
+        </ElInputNumber>
+      </ElFormItem>
+      <ElFormItem label="车头照" prop="headerPhoto">
+        <Uploader v-model:file="inOutData.headerPhoto"/>
+      </ElFormItem>
+      <ElFormItem label="车斗照" prop="bodyPhoto">
+        <Uploader v-model:file="inOutData.bodyPhoto"/>
+      </ElFormItem>
+    </ElForm>
+    <template #footer>
+      <ElButton @click="showDialog = false">关闭</ElButton>
+      <ElButton :loading="submiting" type="primary" @click="submitHandler">确认{{ orderData.state }}</ElButton>
+    </template>
+  </ADialog>
+</template>
+
+<style lang="stylus" scoped>
+.in-out-panel-form {
+  display grid
+  grid-template-areas "weight weight" \
+  "headerPhoto bodyPhoto"
+  gap: 0 20px;
+  padding: 10px;
+
+  :deep(.el-input-number) {
+    .el-input__suffix-inner {
+      padding-left 10px
+    }
+  }
+
+  :deep(.el-form-item) {
+    &:nth-child(1) {
+      grid-area weight
+    }
+
+    &:nth-child(2) {
+      grid-area headerPhoto
+    }
+
+    &:nth-child(3) {
+      grid-area bodyPhoto
+    }
+  }
+}
+</style>
--- a/src/pages/order/realtime/Realtime.vue
+++ b/src/pages/order/realtime/Realtime.vue
@ -81,6 +81,7 @@
    </template>
    <OrderForm ref="orderForm" :research="research"/>
    <BookDetail ref="bookDetail"/>
+    <InOutPanel ref="inOutPanel"/>
  </ATablePage>
 </template>

@ -92,10 +93,17 @@ import ATablePage, {
  buildTablePageProps,
 } from '@/components/a-page/a-table-page/ATablePage.tsx'
 import BookDetail from '@/pages/order/book/BookDetail.vue'
+import {
+  checkStatus,
+  transStatus,
+} from '@/pages/order/constants.ts'
+import InOutPanel from '@/pages/order/realtime/InOutPanel.vue'
+import { ElMessage } from 'element-plus'
+import { useTemplateRef } from 'vue'

 const tablePageIns = useTemplateRef<ATablePageInstance>('tablePage')
 const bookDetailIns = useTemplateRef<InstanceType<typeof BookDetail>>('bookDetail')
-
+const inOutPanelIns = useTemplateRef<InstanceType<typeof InOutPanel>>('inOutPanel')

 function research() {
  tablePageIns.value?.doSearch()
@ -107,6 +115,7 @@ const tablePageProps = buildTablePageProps<OrderTypes.SearchOrderParam, OrderTyp
  },
  table: {
    actionColumn: {
+      width: 100,
      tableActions: [
        {
          tooltip: '详情',
@ -119,25 +128,37 @@ const tablePageProps = buildTablePageProps<OrderTypes.SearchOrderParam, OrderTyp
        {
          tooltip: '进场',
          type: 'info',
-          icon: 'Position',
+          icon: 'approach',
+          show({row}) {
+            return row.transStatus === transStatus.YunShuZhong
+          },
          action({row}) {
-            bookDetailIns.value?.open(row)
+            inOutPanelIns.value?.open(row.id!, row.truckLicensePlate!, '进场')
          },
        },
        {
          tooltip: '出场',
          type: 'info',
-          icon: 'Position',
+          icon: 'carexit',
+          show({row}) {
+            return row.transStatus === transStatus.YiJinChang && (row.checkStatus === checkStatus.Wu || row.checkStatus === checkStatus.YiKanLiao)
+          },
          action({row}) {
-            bookDetailIns.value?.open(row)
+            inOutPanelIns.value?.open(row.id!, row.truckLicensePlate!, '出场')
          },
        },
        {
          tooltip: '勘料',
          type: 'info',
-          icon: 'Position',
+          icon: 'chakanliaodan',
+          confirm: {
+            title: '是否确认勘料',
+          },
+          show({row}) {
+            return row.transStatus === transStatus.YiJinChang && row.checkStatus === checkStatus.WeiKanLiao
+          },
          action({row}) {
-            bookDetailIns.value?.open(row)
+            ElMessage.success(`${row.truckLicensePlate!}勘料成功`)
          },
        },
      ],
@ -192,10 +213,58 @@ const tablePageProps = buildTablePageProps<OrderTypes.SearchOrderParam, OrderTyp
              estimatedTrainNum: 2,
              transDistance: 500,
              orderCategoryTxt: '订单类型A',
-              transStatusTxt: '运输中',
-              transStatus: 'DaiPaiDan',
+              transStatusTxt: '已进场',
+              transStatus: 'YiJinChang',
+              checkStatus: 'YiKanLiao',
              checkStatusTxt: '未勘料',
              paymentStatusTxt: '未支付',
+              truckLicensePlate: '苏A9B905',
+            },
+            {
+              rowCount: 1,
+              id: '123',
+              sn: '202308240001',
+              orderTime: '2023-08-24 10:00:00',
+              contacts: '张三',
+              phone: '13800000000',
+              projectName: '项目A',
+              stationName: '站点B',
+              goodsName: '商品X',
+              unit: '吨',
+              customerMemo: '客户备注',
+              estimatedQuantity: 100,
+              estimatedTrainNum: 2,
+              transDistance: 500,
+              orderCategoryTxt: '订单类型A',
+              transStatusTxt: '运输中',
+              transStatus: 'YunShuZhong',
+              checkStatus: 'WeiKanLiao',
+              checkStatusTxt: '未勘料',
+              paymentStatusTxt: '未支付',
+              truckLicensePlate: '苏A9B905',
+            },
+            {
+              rowCount: 1,
+              id: '123',
+              sn: '202308240001',
+              orderTime: '2023-08-24 10:00:00',
+              contacts: '张三',
+              phone: '13800000000',
+              projectName: '项目A',
+              stationName: '站点B',
+              goodsName: '商品X',
+              unit: '吨',
+              customerMemo: '客户备注',
+              estimatedQuantity: 100,
+              estimatedTrainNum: 2,
+              transDistance: 500,
+              orderCategoryTxt: '订单类型A',
+              transStatusTxt: '已进场',
+              transStatus: 'YiJinChang',
+              checkStatus: 'WeiKanLiao',
+              checkStatusTxt: '未勘料',
+              paymentStatusTxt: '未支付',
+              truckLicensePlate: '苏A9B905',
            },
          ],
        },