重构产品管理

src/api/basicdata/basicdataCategory.js

@@ -1,14 +1,10 @@
 import request from '@/axios';
 
-export const getList = (current, size, params) => {
+export const getList = params => {
   return request({
     url: '/api/logpm-basicdata/basicdataCategory/list',
     method: 'get',
-    params: {
+    params,
-      ...params,
-      current,
-      size,
-    },
   });
 };
 
@@ -60,6 +56,14 @@ export const update = row => {
   });
 };
 
+export const submit = row => {
+  return request({
+    url: '/api/logpm-basicdata/basicdataCategory/submit',
+    method: 'post',
+    data: row,
+  });
+};
+
 export const getDeptLazyTree = parentId => {
   return request({
     url: '/api/logpm-basicdata/basicdataCategory/lazy-tree',
@@ -80,10 +84,10 @@ export const getDownTemplate = () => {
     responseType: 'blob',
   });
 };
-export const $_getList = (params) => {
+export const $_getList = params => {
   return request({
     url: '/api/logpm-basicdata/basicdataCategory/list',
     method: 'get',
-    params
+    params,
   });
 };

src/option/basicdata/basicdataCategory.js

@@ -1,180 +1,49 @@
-export default {
+export const columnList = [
-  height: 'auto',
-  calcHeight: 30,
-  tip: false,
-  searchShow: false,
-  searchMenuSpan: 6,
-  indexLabel: '序号',
-  indexWidth: 80,
-  border: true,
-  index: true,
-  viewBtn: true,
-  selection: true,
-  dialogClickModal: false,
-  column: [
   {
-      label: '主键',
+    prop: '',
-      prop: 'id',
+    label: '复选框',
-      type: 'input',
+    type: 0,
-      addDisplay: false,
+    width: 55,
-      editDisplay: false,
+    fixed: true,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
   },
   {
-      label: '租户号',
+    prop: '',
-      prop: 'tenantId',
+    label: '序号',
-      type: 'input',
+    type: 12,
-      addDisplay: false,
+    values: '',
-      editDisplay: false,
+    width: 55,
-      viewDisplay: false,
+    fixed: true,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '创建人',
-      prop: 'createUser',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '创建时间',
-      prop: 'createTime',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '更新人',
-      prop: 'updateUser',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '更新时间',
-      prop: 'updateTime',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '状态',
-      prop: 'status',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '是否已删除',
-      prop: 'isDeleted',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '创建部门',
-      prop: 'createDept',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '预留1',
-      prop: 'reserve1',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '预留2',
-      prop: 'reserve2',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '预留3',
-      prop: 'reserve3',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '预留4',
-      prop: 'reserve4',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
-    },
-    {
-      label: '预留5',
-      prop: 'reserve5',
-      type: 'input',
-      addDisplay: false,
-      editDisplay: false,
-      viewDisplay: false,
-      hide: true,
-      width: 'fit-content',
   },
   {
     label: '名称',
     prop: 'name',
-      type: 'input',
+    type: 2,
-      search: true,
+    values: '',
+    width: '150',
+    checkarr: [],
+    fixed: false,
+    sortable: true,
+    isTitleSearch: true,
   },
   {
     label: '类型',
-      prop: 'type',
+    prop: 'typeName',
-      type: 'select',
+    type: 3,
-      search: true,
+    values: '',
-      dicUrl: '/api/blade-system/dict-biz/dictionary?code=category',
+    width: '150',
-      props: {
+    checkarr: [],
-        label: 'dictValue',
+    fixed: false,
-        value: 'dictKey',
+    sortable: true,
-      },
+    isTitleSearch: true,
-      rules: [
+  },
-        {
+  {
-          required: true,
+    label: '操作',
-          message: '请选择类型',
+    prop: '',
-          trigger: 'blur',
+    type: 6,
-        },
+    values: '',
-      ],
+    width: '150',
-    },
+    checkarr: [],
-  ],
+    fixed: false,
-};
+    sortable: true,
+  },
+];

src/views/basicdata/brand/basicdataCategory.vue

@@ -1,358 +1,646 @@
 <template>
-  <div>
+  <basic-container v-loading="details.loadingObj.pageLoading">
-    <el-row>
+    <div class="avue-crud">
-      <!-- <el-col :span="5">
+      <!-- 搜索模块 -->
-        <div class="box" v-if="qw">
+      <div v-h5uShow="!search">
-          <el-scrollbar>
+        <!-- 查询模块 -->
-            <basic-container>
+        <el-form :inline="true" :model="query" class="header_search">
-              <avue-tree :option="treeOption" :data="treeData" @node-click="nodeClick" />
+          <template v-for="item in details.columnList" :key="item.prop">
-            </basic-container>
+            <el-form-item v-if="item.isTitleSearch" :label="item.label">
-          </el-scrollbar>
+              <!-- 普通输入框 -->
+              <template v-if="item.type === 2">
+                <el-input
+                  class="w100"
+                  :placeholder="`请输入${item.label}`"
+                  v-model="details.query[item.prop]"
+                  clearable
+                ></el-input>
+              </template>
+
+              <!-- 下拉框 -->
+              <template v-else-if="item.type === 3">
+                <el-select
+                  v-model="details.query[item.prop.replace('Name', '')]"
+                  :placeholder="`请选择${item.label}`"
+                  class="w100"
+                  clearable
+                  filterable
+                  @change="
+                    val => {
+                      !val && delete details.query[item.prop.replace('Name', '')];
+                    }
+                  "
+                  :multiple="item.multiple || false"
+                >
+                  <el-option
+                    v-for="val in item.checkarr"
+                    :key="val.value"
+                    :label="val.label"
+                    :value="val.value"
+                  />
+                </el-select>
+              </template>
+            </el-form-item>
+          </template>
+
+          <!-- 查询按钮 -->
+          <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>
-      </el-col> -->
+
-      <el-col >
+      <div class="avue-crud__header">
-        <basic-container>
+        <!-- 头部左侧按钮模块 -->
-          <avue-crud
+        <div class="avue-crud__left">
-            :option="option"
+          <el-button type="primary" icon="Plus" @click="handleAdd">新 增</el-button>
-            v-model:search="search"
+          <el-button type="primary" icon="Delete" @click="handleBatchDelete">批量删除</el-button>
-            v-model:page="page"
+          <el-button type="primary" icon="Upload" @click="handleUpload">导入</el-button>
-            v-model="form"
+        </div>
-            :table-loading="loading"
+        <!-- 头部右侧按钮模块 -->
-            :data="data"
+        <div class="avue-crud__right">
-            :permission="permissionList"
+          <el-button icon="Download" @click="handleExportData" circle></el-button>
-            :before-open="beforeOpen"
+          <el-button icon="el-icon-refresh" @click="searchChange" circle></el-button>
-            ref="crud"
+          <el-button icon="Operation" @click="showdrawer(true)" circle></el-button>
-            @row-update="rowUpdate"
+          <el-button icon="Search" @click="searchHide" circle></el-button>
-            @row-save="rowSave"
+        </div>
-            @row-del="rowDel"
+      </div>
-            @search-change="searchChange"
+
-            @search-reset="searchReset"
+      <!-- 表格 -->
-            @selection-change="selectionChange"
+      <tablecmt
-            @current-change="currentChange"
+        ref="tableNodeRef"
+        :columnList="details.columnList"
+        :tableData="details.data"
+        :loading="details.loadingObj.list"
+        @inputTxt="inputsc"
+        @timeCheck="timesc"
+        @selectCheck="selectsc"
+        @selection="selectionChange"
+      >
+        <template #default="slotProps">
+          <template v-if="slotProps.scope.column.label === '操作'">
+            <!-- 车次详情 -->
+            <el-text @click="() => handleEdit(slotProps.scope)"> 编 辑 </el-text>
+            <el-text @click="() => handleDelete(slotProps.scope)"> 删 除 </el-text>
+          </template>
+        </template>
+      </tablecmt>
+
+      <!-- 分页模块 -->
+      <div class="avue-crud__pagination flex-c-sb mt10" style="width: 100%">
+        <div style="font-size: 14px">勾选数量: {{ selectionList.length }}</div>
+        <!-- 分页模块 -->
+        <el-pagination
+          align="right"
+          background
           @size-change="sizeChange"
-            @refresh-change="refreshChange"
+          @current-change="currentChange"
-            @on-load="onLoad"
+          :current-page="page.current"
+          :page-sizes="[30, 50, 80, 120, 5000]"
+          :page-size="page.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="page.total"
         >
-            <template #menu-left>
+        </el-pagination>
-              <el-button
+      </div>
-                type="danger"
+
-                icon="el-icon-delete"
+      <!-- 开标签 -->
-                plain
+      <el-dialog
-                v-if="permission.basicdataCategory_delete"
+        destroy-on-close
-                @click="handleDelete"
+        :modal-append-to-body="false"
-                >删 除
+        :append-to-body="false"
-              </el-button>
+        :title="details.title"
+        width="50%"
+        v-model="details.popUpShow.addVisited"
+        draggable
+        align-center
+      >
+        <div v-loading="details.loadingObj.addTagLoading">
+          <el-form ref="ruleFormRef" :model="details.form" inline label-width="100px">
+            <template v-for="item in details.columnList" :key="item.prop">
+              <el-form-item
+                v-if="item.isTitleSearch"
+                :label="item.label"
+                style="width: 350px"
+                :rules="[
+                  {
+                    required: true,
+                    message: `${{ 2: '请输入', 3: '请选择' }[item.type] + item.label}`,
+                    trigger: ['blur', 'change'],
+                  },
+                ]"
+                :prop="item.prop.replace('Name', '')"
+              >
+                <!-- 普通输入框 -->
+                <template v-if="item.type === 2">
+                  <el-input
+                    class="w100"
+                    :placeholder="`请输入${item.label}`"
+                    v-model="details.form[item.prop]"
+                    clearable
+                  ></el-input>
+                </template>
+
+                <!-- 下拉框 -->
+                <template v-else-if="item.type === 3">
+                  <el-select
+                    v-model="details.form[item.prop.replace('Name', '')]"
+                    :placeholder="`请选择${item.label}`"
+                    class="w100"
+                    clearable
+                    filterable
+                    :multiple="item.multiple || false"
+                  >
+                    <el-option
+                      v-for="val in item.checkarr"
+                      :key="val.value"
+                      :label="val.label"
+                      :value="val.value"
+                    />
+                  </el-select>
+                </template>
+              </el-form-item>
+            </template>
+          </el-form>
+        </div>
+
+        <div class="flex-c-c dialog-footer">
+          <el-button icon="Close" @click="details.popUpShow.addVisited = false"> 取 消 </el-button>
 
+          <!-- 提交 -->
           <el-button
-                type="danger"
+            icon="Position"
-                icon="Upload"
+            type="primary"
-                plain
+            :loading="details.loadingObj.addTagLoading"
-                v-if="permission.basicdataCategory_delete"
+            @click="handleSubmit"
-                @click="
+          >
-                  () => {
+            提 交
-                    popUpShow.UploadPackageDelivery = true;
-                  }
-                "
-                >导 入
           </el-button>
-              <!--            <el-button type="warning"-->
+        </div>
-              <!--                       plain-->
+      </el-dialog>
-              <!--                       icon="el-icon-download"-->
+    </div>
-              <!--                       @click="handleExport">导 出-->
-              <!--            </el-button>-->
-            </template>
-          </avue-crud>
   </basic-container>
-      </el-col>
+
-    </el-row>
+  <MyPrint
+    width="780px"
+    :html="details.html"
+    v-model="details.popUpShow.dialogVisible"
+    :isShowExport="false"
+  />
 
   <MyUpload
     ref="myUpload"
-      v-model="popUpShow.UploadPackageDelivery"
+    v-model="details.popUpShow.UploadPackageDelivery"
     templateSrc=""
     uploadAddress="/api/logpm-basicdata/basicdataCategory/import"
     isDefined
     :success="
       () => {
-          popUpShow.UploadPackageDelivery = false;
+        details.popUpShow.UploadPackageDelivery = false;
         onLoad(page);
       }
     "
   >
-      <el-button type="danger" icon="Download" @click="handleDownloadTemplate">
+    <el-button type="danger" icon="Download" @click="handleDownloadTemplate"> 下载模板 </el-button>
-        下载模板
-      </el-button>
   </MyUpload>
-  </div>
+
+  <!-- 列表配置显示 -->
+  <edittablehead
+    @closce="showdrawer"
+    :drawerShow="drawerShow"
+    v-model="details.columnList"
+  ></edittablehead>
 </template>
 
-<script>
+<script setup lang="ts">
+import { ref, reactive, toRefs, computed, onMounted, nextTick } from 'vue';
+import functions from '@/utils/functions.js';
+import dayjs from 'dayjs';
+import { mapGetters } from 'vuex';
+/** 获取字典 */
+import { getDictionaryBiz } from '@/api/system/dict';
+import {
+  getopenOrderAdvancePageList,
+  postOpenOrderFreezeByAdvanceIds,
+} from '@/api/waybill/TemporaryStorageList';
+import {
+  downloadXls,
+  setNodeHeight,
+  getHtmls,
+  handleClearTableQuery,
+  handleInputQuery,
+  handleSelectQuery,
+  handleTranslationDataSeclect,
+  getObjType,
+} from '@/utils/util';
+import { columnList } from '@/option/basicdata/basicdataCategory';
+import { useRouter } from 'vue-router';
+import { deepClone } from '@/utils/util';
+import { showOrderPackgeCode } from '@/api/distribution/distributionStockArticle';
+import { getPageByCarNum } from '@/api/warehouse/PreStoragePackage';
 import {
   getList,
   getDetail,
-  add,
+  submit,
-  update,
   remove,
   getDeptLazyTree,
   getDownTemplate,
 } from '@/api/basicdata/basicdataCategory';
-import option from '@/option/basicdata/basicdataCategory';
+import { ElMessage, ElMessageBox } from 'element-plus';
-import { mapGetters } from 'vuex';
+import { exportExcel } from '@/utils/exportData';
-import { exportBlob } from '@/api/common';
+
-import { getToken } from '@/utils/auth';
+// 获取路由实例
-import { downloadXls } from '@/utils/util';
+const $router = useRouter();
-import { dateNow } from '@/utils/date';
+
-import NProgress from 'nprogress';
+// 组件实例
-import 'nprogress/nprogress.css';
+const ruleFormRef = ref();
-// import { getDeptLazyTree } from '@/api/system/dept';
+const myUpload = ref();
-
+
-export default {
+const details = reactive<any>({
-  data() {
+  /** 是否开启搜索 */
-    return {
+  search: true,
-      form: {},
+  /** 表格搜索条件 */
   query: {},
-      search: {},
+  /** 时间快捷选择设置 */
-      loading: false,
+  shortcuts: [
-      qw: true,
+    {
-      treeId: '',
+      text: '最近一周',
-      page: {
+      value: () => {
-        pageSize: 30,
+        const end = new Date();
-        currentPage: 1,
+        const start = new Date();
-        total: 0,
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+        return [start, end];
       },
-      selectionList: [],
-      option: option,
-      data: [],
-      treeData: [],
-      treeOption: {
-        nodeKey: 'id',
-        lazy: true,
-        treeLoad: function (node, resolve) {
-          // console.log("<<<<<<<<<<<<<<",node,resolve);
-          const parentId = node.level === 0 ? 1 : node.data.id;
-          getDeptLazyTree(parentId).then(res => {
-            // console.log("res>",res)
-            resolve(
-              res.data.data.map(item => {
-                return {
-                  ...item,
-                  leaf: !item.hasChildren,
-                };
-              })
-            );
-          });
     },
-        addBtn: false,
+    {
-        menu: false,
+      text: '最近一个月',
-        size: 'small',
+      value: () => {
-        props: {
+        const end = new Date();
-          labelText: '标题',
+        const start = new Date();
-          label: 'title',
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-          value: 'value',
+        return [start, end];
-          children: 'children',
       },
     },
-      /** 弹出层显示 */
+    {
-      popUpShow: {
+      text: '最近三个月',
-        /** 导入 -- 家配 */
+      value: () => {
-        UploadPackageDelivery: false,
+        const end = new Date();
+        const start = new Date();
+        start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+        return [start, end];
       },
-    };
     },
-  computed: {
+  ],
-    ...mapGetters(['permission']),
+  /** 列表 */
-    permissionList() {
+  columnList: deepClone(columnList),
-      return {
+  /** 列表数据 */
-        addBtn: this.validData(this.permission.basicdataCategory_add, false),
+  data: [],
-        viewBtn: this.validData(this.permission.basicdataCategory_view, false),
+  /** 页面loading */
-        delBtn: this.validData(this.permission.basicdataCategory_delete, false),
+  loadingObj: {
-        editBtn: this.validData(this.permission.basicdataCategory_edit, false),
+    /** 列表加载loading */
-      };
+    list: false,
+    pageLoading: false,
   },
-    ids() {
+  /** 列表复选框选中的数据 */
-      let ids = [];
+  selectionList: [],
-      this.selectionList.forEach(ele => {
+  /** 是否显示设置表格 */
-        ids.push(ele.id);
+  drawerShow: false,
-      });
+  /** 分页参数 */
-      return ids.join(',');
+  page: {
+    current: 1,
+    size: 30,
+    total: 0,
   },
+  /** 列表Dom节点 */
+  listNode: '',
+  form: {},
+  popUpShow: {
+    /** 查看二维码 */
+    addVisited: false,
+    /** 上传 */
+    UploadPackageDelivery: false,
   },
-  methods: {
+  fullscreenObj: {
-    nodeClick(data) {
+    addVisited: false,
-      console.log('点击了', data);
-      this.treeId = data.id;
-      this.page.currentPage = 1;
-      this.onLoad(this.page);
   },
-    rowSave(row, done, loading) {
+  title: '新增' as '新增' | '编辑',
-      //判断是否有品类
+});
-      // if(!!this.treeOption.treeLoad()){
+
-      //
+const tableNodeRef = ref();
-      // }else{
+
-      //
+const { search, query, shortcuts, selectionList, drawerShow, page } = toRefs(details);
-      // }
+
-      console.log('row+++', row);
+/** vuex */
-      if (row.type == '1') {
+const permission = computed(() => mapGetters(['permission', 'tagWel', 'tagList']));
-        this.treeId = '';
+console.log('permission :>> ', permission);
+
+onMounted(() => {
+  const timer = setTimeout(() => {
+    details.listNode = document.querySelector('.maboxhi');
+    details.listNode.style.transition = 'all .5s ease-out';
+    clearTimeout(timer);
+  }, 100);
+});
+
+/** 请求页面数据 */
+const onLoad = async (params = {}) => {
+  try {
+    // 开启列表loading动画
+    details.loadingObj.list = true;
+    const submitData = { ...details.page, ...details.query, ...params };
+
+    delete submitData.total;
+
+    // 获取暂存单列表
+    const res = await getList(submitData);
+    console.log('res :>> ', res);
+    const { code, data } = res.data;
+    if (code !== 200) return;
+    details.data = data.records;
+    details.page.total = data.total;
+
+    handleTranslationDataSeclect(details.data, details.columnList);
+
+    return res.data;
+  } catch (error) {
+    console.log('error :>> ', error);
+  } finally {
+    details.loadingObj.list = false;
   }
-      if (!!this.treeId) {
+};
-        row.pid = this.treeId;
+
+const initOnLoad = (params = {}) => {
+  details.page.current = 1;
+  details.page.total = 0;
+  onLoad(params);
+};
+
+initOnLoad();
+
+const handleData = (key, res) => {
+  const { code, data } = res.data;
+  if (code !== 200) return;
+  for (let i = 0; i < details.columnList.length; i++) {
+    const value = details.columnList[i];
+
+    if (value.label === key)
+      return (value.checkarr =
+        getObjType(data) === 'array'
+          ? data.map(val => {
+              val.label = val.dictValue;
+              val.value = val.dictKey;
+              return val;
+            })
+          : []);
   }
-      this.qw = false;
+};
-      add(row).then(
+
-        () => {
+// 获取字典数据
-          this.$message({
+const initData = async () => {
-            type: 'success',
+  try {
-            message: '操作成功!',
+    details.page.current = 1;
-          });
+
-          this.qw = true;
+    details.loadingObj.pageLoading = true;
-          if (!!this.treeId) {
+
-            this.onLoad(this.page);
+    await Promise.all([
+      // 车辆来源
+      getDictionaryBiz('category').then(res => handleData('类型', res)),
+      onLoad(false),
+    ]);
+
+    await nextTick();
+    handleTranslationDataSeclect(details.data, details.columnList);
+    console.log('details.columnList :>> ', details.columnList);
+  } catch (error) {
+    console.log('error :>> ', error);
+  } finally {
+    details.loadingObj.pageLoading = false;
   }
-          done();
+};
-        },
+
-        error => {
+initData();
-          loading();
+
-          window.console.log(error);
+/** 搜索 */
+const searchChange = () => {
+  const { time } = details.query;
+  if (time?.length) {
+    [details.query.taskTimeStart, details.query.taskTimeEnd] = time;
+  } else {
+    delete details.query.taskTimeStart;
+    delete details.query.taskTimeEnd;
   }
-      );
+
-    },
+  initOnLoad();
-    rowUpdate(row, index, done, loading) {
+};
-      this.qw = false;
+
-      update(row).then(
+/** 清空表单 */
-        () => {
+const searchReset = () => {
-          this.onLoad(this.page);
+  details.query = {};
-          this.$message({
+  details.page.current = 1;
-            type: 'success',
+  handleClearTableQuery(details.columnList);
-            message: '操作成功!',
+  initOnLoad();
-          });
+};
-          this.qw = true;
+
-          done();
+/** 展开列表控件 */
-        },
+const showdrawer = (_flag?: boolean) => {
-        error => {
+  details.drawerShow = _flag;
-          loading();
+};
-          console.log(error);
+
+/** 是否开启搜索区 */
+const searchHide = () => {
+  details.search = !details.search;
+
+  setNodeHeight(tableNodeRef.value.$el, '', true);
+};
+
+/** 表格表头输入框搜索 */
+const inputsc = (index, col) => {
+  handleInputQuery(index, col, details.query);
+  initOnLoad();
+};
+
+/** 表格表头时间选择 */
+const timesc = (index, row) => {
+  console.log(index, row);
+  if (!!index) {
+    index = dayjs(index).format('YYYY-MM-DD');
+  }
+  details.query[row.prop] = index;
+  if (!index) {
+    delete details.query[row.prop];
   }
-      );
+  initOnLoad();
+};
+
+/** 表格表头下拉框选择 */
+const selectsc = (index, colors) => {
+  handleSelectQuery(index, colors, details.query);
+  initOnLoad();
+};
+
+/** 表格表头复选框选择 */
+const selectionChange = (list: any) => {
+  details.selectionList = list;
+};
+
+/** 每页数量改变执行的回调 */
+const sizeChange = (size: number) => {
+  details.page.size = size;
+  initOnLoad();
+};
+
+/** 页码改变执行的回调 */
+const currentChange = current => {
+  details.page.current = current;
+  onLoad();
+};
+
+/** 查看详情 */
+const viewDetails = ({ row }) => {
+  $router.push({
+    path: '/warehouse/prewarehousing/PreStoragePackage',
+    query: {
+      waybillNumber: row.waybillNumber,
+      distrCarNumber: row.distrCarNumber,
+      orderCode: row.orderCode,
     },
-    rowDel(row) {
-      this.$confirm('确定将选择数据删除?', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning',
-      })
-        .then(() => {
-          return remove(row.id);
-        })
-        .then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: 'success',
-            message: '操作成功!',
-          });
   });
-    },
+};
-    handleDelete() {
+
-      if (this.selectionList.length === 0) {
+/** 导出表格数据 */
-        this.$message.warning('请选择至少一条数据');
+const handleExportData = () => {
-        return;
+  exportExcel(details.columnList, details.data, '产品 - ' + new Date().getTime());
+};
+
+/**
+ * 是否开启全屏
+ * @params(_type) 开启或关闭
+ */
+const handleFullScrean = (_type: 'open' | 'close', _name: string) => {
+  let _node: any = '';
+  if (_name) _node = document.querySelector(`.${_name} .maboxhi`);
+
+  switch (_name) {
+    case 'packageOrderListlVisited':
+      details.fullscreenObj.packageOrderListlVisited =
+        !details.fullscreenObj.packageOrderListlVisited;
+
+      if (_type === 'close') {
+        if (_node) setNodeHeight(_node, '500px');
+      } else {
+        if (_node) setNodeHeight(_node, '800px');
+      }
+      break;
+
+    default:
+      details.fullscreenObj[_name] = !details.fullscreenObj[_name];
+      break;
+  }
+};
+
+/** 新增 */
+const handleAdd = () => {
+  details.form = {};
+  details.title = '新增';
+  details.popUpShow.addVisited = true;
+};
+
+/** 编辑 */
+const handleEdit = ({ row }) => {
+  details.title = '编辑';
+
+  for (let i = 0; i < details.columnList.length; i++) {
+    const value = details.columnList[i];
+
+    if (!value.isTitleSearch) continue;
+    const _key = value.prop.replace('Name', '');
+
+    details.form[_key] = row[_key];
+  }
+
+  details.form.id = row.id;
+  details.popUpShow.addVisited = true;
+};
+
+/** 提交 */
+const handleSubmit = () => {
+  ruleFormRef.value.validate(async valid => {
+    if (!valid) return;
+    try {
+      details.popUpShow.addVisited = false;
+      details.loadingObj.pageLoading = true;
+
+      const submitData = { ...details.form };
+
+      const res = await submit(submitData);
+
+      const { code, data } = res.data;
+
+      if (code !== 200) return;
+
+      ElMessage.success('操作成功');
+      onLoad();
+    } catch (error) {
+      console.log('error :>> ', error);
+    } finally {
+      details.loadingObj.pageLoading = false;
     }
-      this.$confirm('确定将选择数据删除?', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning',
-      })
-        .then(() => {
-          return remove(this.ids);
-        })
-        .then(() => {
-          this.onLoad(this.page);
-          this.$message({
-            type: 'success',
-            message: '操作成功!',
-          });
-          this.$refs.crud.toggleSelection();
   });
-    },
-    handleExport() {
-      let downloadUrl = `/blade-basicdataCategory/basicdataCategory/export-basicdataCategory?${
-        this.website.tokenHeader
-      }=${getToken()}`;
-      const { name, type } = this.query;
-      let values = {
-        name_: name,
-        type_: type,
 };
-      this.$confirm('是否导出数据?', '提示', {
+
-        confirmButtonText: '确定',
+/** 删除 */
-        cancelButtonText: '取消',
+const handleDelete = ({ row }) => {
+  ElMessageBox.confirm('确认删除', '提示', {
     type: 'warning',
-      }).then(() => {
+  }).then(async () => {
-        NProgress.start();
+    try {
-        exportBlob(downloadUrl, values).then(res => {
+      details.loadingObj.pageLoading = true;
-          downloadXls(res.data, `品类${dateNow()}.xlsx`);
+
-          NProgress.done();
+      const res = await remove(row.id);
-        });
+      const { code, msg } = res.data;
-      });
+      if (code !== 200) return;
-    },
+      ElMessage.success(msg);
-    beforeOpen(done, type) {
+      onLoad();
-      if (['edit', 'view'].includes(type)) {
+    } catch (error) {
-        getDetail(this.form.id).then(res => {
+      console.log('error :>> ', error);
-          this.form = res.data.data;
+    } finally {
-          this.form.type=String(this.form.type)
+      details.loadingObj.pageLoading = false;
-        });
     }
-      done();
+  });
-    },
-    searchReset() {
-      this.query = {};
-      this.onLoad(this.page);
-    },
-    searchChange(params, done) {
-      this.query = params;
-      this.page.currentPage = 1;
-      this.onLoad(this.page, params);
-      done();
-    },
-    selectionChange(list) {
-      this.selectionList = list;
-    },
-    selectionClear() {
-      this.selectionList = [];
-      this.$refs.crud.toggleSelection();
-    },
-    currentChange(currentPage) {
-      this.page.currentPage = currentPage;
-    },
-    sizeChange(pageSize) {
-      this.page.pageSize = pageSize;
-    },
-    refreshChange() {
-      this.onLoad(this.page, this.query);
-    },
-    onLoad(page, params = {}) {
-      console.log(this.query,';this.query');
-      
-      this.loading = true;
-      const { name, type } = this.query;
-      let values = {
-        name_like: name,
-        type: type,
 };
-      console.log('查询条件', values);
+
-      getList(page.currentPage, page.pageSize, values).then(res => {
+/** 批量删除 */
-        const data = res.data.data;
+const handleBatchDelete = () => {
-        this.page.total = data.total;
+  if (details.selectionList.length === 0) return ElMessage.warning('请选择需要删除的数据');
-        this.data = data.records;
+
-        this.loading = false;
+  ElMessageBox.confirm('确认删除', '提示', {
-        this.selectionClear();
+    type: 'warning',
+  }).then(async () => {
+    try {
+      details.loadingObj.pageLoading = true;
+
+      const res = await remove(details.selectionList.map(val => val.id).join(','));
+      const { code, msg } = res.data;
+      if (code !== 200) return;
+      ElMessage.success(msg);
+      onLoad();
+    } catch (error) {
+      console.log('error :>> ', error);
+    } finally {
+      details.loadingObj.pageLoading = false;
+    }
   });
-    },
+};
+
+const handleUpload = () => {
+  details.popUpShow.UploadPackageDelivery = true;
+};
+
 /** 下载模板 */
-    async handleDownloadTemplate() {
+const handleDownloadTemplate = async () => {
   try {
-        console.log('this.$refs :>> ', this.$refs);
+    myUpload.value.details.loadingObj.UploadLoadong = true;
-        this.$refs.myUpload.details.loadingObj.UploadLoadong = true;
 
     const res = await getDownTemplate();
 
@@ -360,29 +648,25 @@ export default {
 
     if (status !== 200) return;
 
-        downloadXls(data, '产品导入模板');
+    downloadXls(data, '产品导入模板.xlsx');
 
     console.log('res :>> ', res);
   } catch (error) {
     console.log('error :>> ', error);
   } finally {
-        this.$refs.myUpload.details.loadingObj.UploadLoadong = false;
+    myUpload.value.details.loadingObj.UploadLoadong = false;
   }
-    },
-  },
 };
 </script>
 
 <style scoped lang="scss">
-:deep(.no-print) {
+// 日期选择器
-  margin-left: auto;
+:deep(.el-date-editor.el-input) {
-}
+  height: 100% !important;
-:deep(.el-form-item__label) {
+  width: 100% !important;
-  width: auto !important;
-}
-:deep(.no-print) {
-  .el-button {
-    margin-right: 0;
 }
+
+:deep(.el-range-editor.el-input__wrapper) {
+  height: 100% !important;
 }
 </style>