修复开单,优化打印,优化干线自提

src/components/HeaderSearch/HeaderSearch.vue

@@ -0,0 +1,138 @@
+<template>
+  <div v-h5uShow="props.search">
+    <!-- 查询模块 -->
+    <el-form :inline="true" :model="props.query" class="header_search">
+      <el-form-item v-for="item in props.searchOption" :key="item.prop" :label="item.label">
+        <template v-if="item.type === 'input'">
+          <el-input
+            v-model.trim="query[item.prop]"
+            :placeholder="`请输入${item.label}`"
+            clearable
+          ></el-input>
+        </template>
+
+        <template v-else-if="item.type === 'select'">
+          <el-select
+            v-model="query[item.prop]"
+            :placeholder="`请输入${item.label}`"
+            filterable
+            clearable
+          >
+            <el-option
+              v-for="value in item.checkarr || []"
+              :key="value.dictValue"
+              :label="value.dictValue"
+              :value="value.dictKey"
+            />
+          </el-select>
+        </template>
+
+        <template v-else-if="item.type === 'time'">
+          <el-date-picker
+            v-model="query[item.prop]"
+            type="datetimerange"
+            unlink-panels
+            range-separator="至"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :shortcuts="details.shortcuts"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            clearable
+          />
+        </template>
+      </el-form-item>
+
+      <!-- 查询按钮 -->
+      <el-form-item class="el-btn">
+        <el-button type="primary" icon="el-icon-search" @click="handleSearch">搜 索</el-button>
+        <el-button icon="el-icon-delete" @click="searchReset">清 空</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { defineProps, reactive, type PropType } from 'vue';
+
+type SerachOption = {
+  /** 标题 */
+  label: string;
+  /** 查询属性 */
+  prop: string;
+  /** 标题宽度 */
+  labelWidth?: string;
+  /** 搜索类型 */
+  type: 'input' | 'select' | 'time';
+  /** 下拉框搜索的值 */
+  checkarr: { dictKey: string; dictValue: string }[];
+}[];
+
+const props = defineProps({
+  search: {
+    type: Boolean,
+    required: true,
+  },
+  /** 是否显示弹窗 */
+  modelValue: {
+    type: Boolean,
+    required: true,
+  },
+  /** 查询的容器 */
+  query: {
+    type: Boolean,
+    required: true,
+  },
+  /** 搜索配置项 */
+  searchOption: {
+    type: Array as PropType<SerachOption>,
+    required: true,
+  },
+});
+
+const $emit = defineEmits(['update:modelValue', 'search', 'remove']);
+
+const details = reactive({
+  /** 时间快捷选择设置 */
+  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];
+      },
+    },
+  ],
+});
+
+/** 搜索 */
+const handleSearch = () => {
+  $emit('search', props.query);
+};
+
+/** 清空搜索框 */
+const searchReset = () => {
+  $emit('remove');
+};
+</script>
+
+<style scoped lang="scss"></style>

src/components/MyPrint/MyPrint.vue

@@ -60,7 +60,7 @@
 </template>
 
 <script setup lang="ts">
-import { defineProps, computed, ref, nextTick, reactive } from 'vue';
+import { defineProps, computed, ref, nextTick, reactive, watch } from 'vue';
 import print from '@/utils/print';
 import { ElMessage, ElMessageBox } from 'element-plus';
 import { getObjType } from '@/utils/util';
@@ -249,6 +249,21 @@ const printTemplate = () => {
 const handleFullScrean = () => {
   details.isFullscreen = !details.isFullscreen;
 };
+
+watch(
+  () => props.modelValue,
+  async () => {
+    if (!props.modelValue) return;
+
+    await nextTick();
+
+    setTimeout(() => {
+      const node = document.querySelectorAll('.printCode .isEdit');
+      console.log('node :>> ', node);
+      node.forEach(val => val.setAttribute('contenteditable', true));
+    }, 500);
+  }
+);
 </script>
 
 <style scoped lang="scss">

src/main.js

@@ -23,6 +23,7 @@ import thirdRegister from './components/third-register/main.vue';
 import NfDesignBase from '@saber/nf-design-base-elp';
 import flowDesign from './components/flow-design/main.vue';
 import tablecmt from './components/tablecmt/tablecmt.vue';
+import HeaderSearch from './components/HeaderSearch/HeaderSearch.vue';
 import webCamera from './components/webCameraIMG/webCamera.vue';
 import SelectBox from './components/SelectBox/SelectBox.vue';
 import edittablehead from './components/edittablehead/index.vue';
@@ -60,6 +61,8 @@ app.component('tablecmt', tablecmt);
 app.component('webCamera', webCamera);
 app.component('edittablehead', edittablehead);
 app.component('SelectBox', SelectBox);
+/** 表头搜索 */
+app.component('HeaderSearch', HeaderSearch);
 /** 打印 */
 app.component('MyPrint', MyPrint);
 /** 上传Excel */

src/views/distribution/inventory/CreateOrder.vue

@@ -66,6 +66,7 @@
                   prefix-icon="Calendar"
                   type="datetime"
                   placeholder="创建时间"
+                  :clearable="false"
                 />
               </div>
             </div>

src/views/distribution/inventory/addArteryDistrilbutionBillLadingList.vue

@@ -417,6 +417,12 @@
   ></edittablehead>
 </template>
 
+<script lang="ts">
+export default {
+  name: '/distribution/inventory/addArteryDistrilbutionBillLadingList',
+};
+</script>
+
 <script lang="ts" setup>
 // 引入页面请求
 import {

src/views/distribution/inventory/arteryDistrilbutionBillLadingList.vue

@@ -2,114 +2,105 @@
   <basic-container v-loading="loadingObj.pageLoading">
     <div class="avue-crud">
       <!-- 搜索模块 -->
-      <div v-h5uShow="!search">
-        <!-- 查询模块 -->
-        <el-form :inline="true" :model="query" class="header_search">
-          <el-form-item label="批次号:">
-            <el-input v-model="query.serviceNumber" placeholder="请输入批次号" clearable></el-input>
-          </el-form-item>
-
-          <!-- 查询按钮 -->
-          <el-form-item class="el-btn">
-            <el-button type="primary" icon="el-icon-search" @click="searchChange">搜 索</el-button>
-            <el-button icon="el-icon-delete" @click="searchReset">清 空</el-button>
-          </el-form-item>
-        </el-form>
-      </div>
+      <HeaderSearch
+        :search="search"
+        :query="query"
+        :searchOption="searchOption"
+        @search="() => searchChange()"
+        @remove="() => searchReset()"
+      />
 
       <!-- 控件模块 -->
-      <el-row>
-        <div class="avue-crud__header">
-          <!-- 头部左侧按钮模块 -->
-          <div class="avue-crud__left">
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_add"
-              icon="el-icon-plus"
-              @click="handleAdd"
-            >
-              新 增
-            </el-button>
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_edit"
-              icon="el-icon-edit"
-              @click="handleEdit"
-              >编 辑</el-button
-            >
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_addBillLadingData"
-              icon="el-icon-plus"
-              @click="handleAddDistrilbution"
-            >
-              添加提货数据
-            </el-button>
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_startBill"
-              icon="Check"
-              @click="handleEditBillladingStatus(1)"
-            >
-              开始提货
-            </el-button>
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_confirmBill"
-              icon="el-icon-check"
-              @click="handleShowConfirm"
-            >
-              提货完成
-            </el-button>
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_cancelConfirmBill"
-              icon="el-icon-close"
-              @click="handleEditBillladingStatus(3)"
-            >
-              取消完成
-            </el-button>
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_settleAccounts"
-              icon="el-icon-check"
-              @click="handleEditBillladingStatus(4)"
-            >
-              结 算
-            </el-button>
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_cancelSettleAccounts"
-              icon="el-icon-close"
-              @click="handleEditBillladingStatus(5)"
-            >
-              取消结算
-            </el-button>
-            <el-button
-              type="primary"
-              v-if="permissionObj.arteryDistrilbutionBillLadingList_cancelBill"
-              icon="el-icon-close"
-              @click="handleEditBillladingStatus(6)"
-            >
-              取消提货
-            </el-button>
-            <el-button
-              type="danger"
-              icon="el-icon-download"
-              @click="() => handleExportInfo('page')"
-              plain
-            >
-              导出
-            </el-button>
-          </div>
-          <!-- 头部右侧按钮模块 -->
-          <div class="avue-crud__right">
-            <el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
-            <el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
-            <el-button icon="el-icon-search" @click="searchHide" circle></el-button>
-          </div>
+      <div class="avue-crud__header flex-c-sb">
+        <!-- 头部左侧按钮模块 -->
+        <div class="avue-crud__left">
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_add"
+            icon="el-icon-plus"
+            @click="handleAdd"
+          >
+            新 增
+          </el-button>
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_edit"
+            icon="el-icon-edit"
+            @click="handleEdit"
+            >编 辑</el-button
+          >
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_addBillLadingData"
+            icon="el-icon-plus"
+            @click="handleAddDistrilbution"
+          >
+            添加提货数据
+          </el-button>
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_startBill"
+            icon="Check"
+            @click="() => handleShowConfirm(1)"
+          >
+            开始提货
+          </el-button>
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_confirmBill"
+            icon="el-icon-check"
+            @click="() => handleShowConfirm(2)"
+          >
+            提货完成
+          </el-button>
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_cancelConfirmBill"
+            icon="el-icon-close"
+            @click="() => handleEditBillladingStatus(3)"
+          >
+            取消完成
+          </el-button>
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_settleAccounts"
+            icon="el-icon-check"
+            @click="() => handleEditBillladingStatus(4)"
+          >
+            结 算
+          </el-button>
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_cancelSettleAccounts"
+            icon="el-icon-close"
+            @click="() => handleEditBillladingStatus(5)"
+          >
+            取消结算
+          </el-button>
+          <el-button
+            type="primary"
+            v-if="permissionObj.arteryDistrilbutionBillLadingList_cancelBill"
+            icon="el-icon-close"
+            @click="() => handleEditBillladingStatus(6)"
+          >
+            取消提货
+          </el-button>
+          <el-button
+            type="danger"
+            icon="el-icon-download"
+            @click="() => handleExportInfo('page')"
+            plain
+          >
+            导出
+          </el-button>
+        </div>
+        <!-- 头部右侧按钮模块 -->
+        <div class="avue-crud__right">
+          <el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
+          <el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
+          <el-button icon="el-icon-search" @click="searchHide" circle></el-button>
         </div>
-      </el-row>
+      </div>
 
       <!-- 列表模块 -->
       <tablecmt
@@ -140,31 +131,23 @@
         </template>
       </tablecmt>
 
-      <!-- 统计 -->
-      <!-- <el-row>
-        <div>选择数: , 运单数: , 件数: , 重量: , 体积: , 提货费: ,</div>
-        <div>总计: 总数: , 运单数: , 件数: , 重量: , 体积: , 提货费: ,</div>
-      </el-row> -->
-
       <!-- 分页模块 -->
-      <el-row class="el-fy">
-        <div class="avue-crud__pagination flex-c-sb" style="width: 100%">
-          <div style="font-size: 14px">勾选数量: {{ selectionList.length }}</div>
-          <!-- 分页模块 -->
-          <el-pagination
-            align="right"
-            background
-            @size-change="sizeChange"
-            @current-change="currentChange"
-            :current-page="page.pageNum"
-            :page-sizes="[30, 50, 80, 120]"
-            :page-size="page.pageSize"
-            layout="total, sizes, prev, pager, next, jumper"
-            :total="page.total"
-          >
-          </el-pagination>
-        </div>
-      </el-row>
+      <div class="avue-crud__pagination flex-c-sb" style="width: 100%">
+        <div style="font-size: 14px">勾选数量: {{ selectionList.length }}</div>
+        <!-- 分页模块 -->
+        <el-pagination
+          align="right"
+          background
+          @size-change="sizeChange"
+          @current-change="currentChange"
+          :current-page="page.pageNum"
+          :page-sizes="[30, 50, 80, 120]"
+          :page-size="page.pageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="page.total"
+        >
+        </el-pagination>
+      </div>
 
       <!-- 添加提货数据 -->
       <el-dialog
@@ -257,16 +240,22 @@
 
       <!-- 确认提货完成 -->
       <el-dialog
-        title="确认提货完成"
+        :title="`确认提货${{ 1: '开始', 2: '完成' }[form.type]}`"
         v-model="popUpShow.confirmBillLading"
         width="780px"
         :before-close="beforeClose"
+        align-center
+        destroy-on-close
         append-to-body
       >
-        <el-form ref="form" :model="form" label-width="120px">
+        <el-form ref="billLadingFormRef" :model="form" label-width="120px">
           <!-- 表单字段 -->
 
-          <el-form-item label="提货完成时间" prop="createTime">
+          <el-form-item
+            :label="`提货${{ 1: '开始', 2: '完成' }[form.type]}时间`"
+            :rules="[{ required: true, message: '请输入时间', trigger: 'change' }]"
+            prop="time"
+          >
             <el-date-picker
               class="w100 h100"
               v-model="form.time"
@@ -388,9 +377,9 @@ import {
   deepClone,
   handleTranslationDataSeclect,
   ChecksWhetherTheWarehouseIsSelected,
+  getObjType,
 } from '@/utils/util';
 import { dateNow } from '@/utils/date';
-import { detail } from '@/api/flow/flow';
 
 export default {
   data() {
@@ -456,7 +445,11 @@ export default {
       /** 字典 */
       clientType: [],
       options: [],
-      debounce,
+      searchOption: [
+        { label: '批次号', prop: 'serviceNumber', type: 'input' },
+        { label: '开始时间', prop: 'startTimeArr', type: 'time' },
+        { label: '完成时间', prop: 'completeTimeArr', type: 'time' },
+      ],
       /** 时间 */
       shortcuts: [
         {
@@ -493,37 +486,38 @@ export default {
           // 开启页面loading
           this.loading = true;
 
-          // 请求页面数据
-          const res = await postPageList({ ...page, ...this.query, ...params });
+          const submitData = { ...page, ...this.query, ...params };
 
-          console.log('res :>> ', res);
-          const { code, data } = res.data;
-          if (code !== 200) return;
+          // 开始时间
+          if (
+            getObjType(submitData.startTimeArr) === 'array' &&
+            submitData.startTimeArr.length > 0
+          ) {
+            submitData.startTimeStartStr = submitData.startTimeArr[0];
+            submitData.startTimeEndStr = submitData.startTimeArr[1];
+          }
 
-          this.data = data.records;
-          let _billladingStatusOption = [];
-          let _chargeTypeOption = [];
+          // 完成时间
+          if (
+            getObjType(submitData.completeTimeArr) === 'array' &&
+            submitData.completeTimeArr.length > 0
+          ) {
+            submitData.completeTimeStartStr = submitData.completeTimeArr[0];
+            submitData.completeTimeEndStr = submitData.completeTimeArr[1];
+          }
 
-          for (let i = 0; i < this.columnList.length; i++) {
-            const value = this.columnList[i];
+          delete submitData.startTimeArr;
+          delete submitData.completeTimeArr;
 
-            if (value.prop === 'billladingStatusName') _billladingStatusOption = value.checkarr;
-            else if (value.prop === 'chargeTypeName') _chargeTypeOption = value.checkarr;
-          }
+          // 请求页面数据
+          const res = await postPageList(submitData);
 
-          for (let i = 0; i < this.data.length; i++) {
-            const value = this.data[i];
+          const { code, data } = res.data;
+          if (code !== 200) return;
 
-            value.billladingStatusName = (
-              _billladingStatusOption.find(item => item.value === Number(value.billladingStatus)) ||
-              {}
-            ).label;
-            value.chargeTypeName = (
-              _chargeTypeOption.find(item => item.value === Number(value.chargeType)) || {}
-            ).label;
-          }
+          this.data = data.records;
 
-          console.log('this.data :>> ', this.data);
+          handleTranslationDataSeclect(this.data, this.columnList);
 
           this.page.total = data.total;
         } catch (error) {
@@ -788,7 +782,7 @@ export default {
       });
     },
     /** 提货完成 */
-    handleShowConfirm() {
+    handleShowConfirm(type) {
       if (!ChecksWhetherTheWarehouseIsSelected())
         return this.$message.warning('多仓权限无法操作，请选择仓库');
       if (this.selectionList.length === 0) return this.$message.error('最少选择一条数据');
@@ -801,35 +795,40 @@ export default {
         minTime: new Date(item.startTime).getTime(),
         time: dayjs(new Date()).format('YYYY-MM-DD HH:mm:ss'),
         id: item.id,
+        type,
       };
       console.log('this.form :>> ', this.form);
     },
-    async handleConfirmSubmit() {
-      try {
-        if (new Date(this.form.time).getTime() <= this.form.minTime)
-          return this.$message.warning('完成时间请大于提货开始时间');
-        this.popUpShow.confirmBillLading = false;
-        this.loadingObj.pageLoading = true;
+    handleConfirmSubmit() {
+      this.$refs.billLadingFormRef.validate(async valid => {
+        if (!valid) return;
+        if (!this.form.time) return this.$message.warning('请选择时间');
+        try {
+          if (this.form.type !== 1 && new Date(this.form.time).getTime() <= this.form.minTime)
+            return this.$message.warning('完成时间请大于提货开始时间');
+          this.popUpShow.confirmBillLading = false;
+          this.loadingObj.pageLoading = true;
 
-        const res = await postUpdateBillladingStatus({
-          id: this.form.id,
-          type: 2,
-          completeTime: this.form.time,
-        });
+          const res = await postUpdateBillladingStatus({
+            id: this.form.id,
+            type: this.form.type,
+            completeTime: this.form.time,
+          });
 
-        const { code, msg } = res.data;
+          const { code, msg } = res.data;
 
-        if (code !== 200) return;
-        this.$message.success(msg);
-        // 清空复选框
-        this.selectionClear();
-        // 刷新表格
-        this.onLoad(this.page);
-      } catch (error) {
-        console.log('error :>> ', error);
-      } finally {
-        this.loadingObj.pageLoading = false;
-      }
+          if (code !== 200) return;
+          this.$message.success(msg);
+          // 清空复选框
+          this.selectionClear();
+          // 刷新表格
+          this.onLoad(this.page);
+        } catch (error) {
+          console.log('error :>> ', error);
+        } finally {
+          this.loadingObj.pageLoading = false;
+        }
+      });
     },
     /** 开启添加提货数据弹窗 */
     handleAddDistrilbution() {

src/views/waybill/CreateZeroOrder.vue

@@ -58,7 +58,12 @@
               <el-icon><User /></el-icon>
               <span style="margin-left: 10px">{{ details.query.openOrderUserName }}</span>
             </div>
-            <el-date-picker v-model="query.openOrderDate" type="datetime" placeholder="创建时间" />
+            <el-date-picker
+              v-model="query.openOrderDate"
+              type="datetime"
+              :clearable="false"
+              placeholder="创建时间"
+            />
           </div>
         </div>