添加部分按钮权限和首页部分接口

src/api/waybill/ChangeOrder.js

@@ -7,7 +7,7 @@ import request from '@/axios';
  */
 export const postFindUpdateWaybillList = data => {
   return request({
-    url: '/api/logpm-trunkline/openOrder/findUpdateWaybillList ',
+    url: '/api/logpm-trunkline/openOrder/findUpdateWaybillList',
     method: 'post',
     data,
   });

src/api/wel/index.js

@@ -0,0 +1,92 @@
+import request from '@/axios';
+
+/**
+ * 库位数据
+ * @param {Object} data
+ * @returns
+ */
+export const postAllocationData = data => {
+  return request({
+    url: '/api/logpm-report-zhy/warehouseIndex/allocationData',
+    method: 'post',
+    data,
+  });
+};
+
+/**
+ * 当前在库数据
+ * @param {Object} data
+ * @returns
+ */
+export const postHandOrderData = data => {
+  return request({
+    url: '/api/logpm-report-zhy/warehouseIndex/handOrderData',
+    method: 'post',
+    data,
+  });
+};
+
+/**
+ * 开单数据
+ * @param {Object} data
+ * @returns
+ */
+export const postOpenOrderData = data => {
+  return request({
+    url: '/api/logpm-report-zhy/warehouseIndex/openOrderData',
+    method: 'post',
+    data,
+  });
+};
+
+/**
+ * 开单收入数据
+ * @param {Object} data
+ * @returns
+ */
+export const postOpenOrderIncome = data => {
+  return request({
+    url: '/api/logpm-report-zhy/warehouseIndex/openOrderIncome',
+    method: 'post',
+    data,
+  });
+};
+
+/**
+ * 干线车次数据
+ * @param {Object} data
+ * @returns
+ */
+export const postTrunklineCarsData = data => {
+  return request({
+    url: '/api/logpm-report-zhy/warehouseIndex/trunklineCarsData',
+    method: 'post',
+    data,
+  });
+};
+
+/**
+ * 干线发运数据
+ * @param {Object} data
+ * @returns
+ */
+export const postTrunklineHandOrderData = data => {
+  return request({
+    url: '/api/logpm-report-zhy/warehouseIndex/trunklineHandOrderData',
+    method: 'post',
+    data,
+  });
+};
+
+/**
+ * 卸车异常数据
+ * @param {Object} data
+ * @returns
+ */
+export const postUnloadAbnormalData = data => {
+  return request({
+    url: '/api/logpm-report-zhy/warehouseIndex/unloadAbnormalData',
+    method: 'post',
+    data,
+  });
+};

src/views/distribution/inventory/BookingNote.vue

@@ -908,13 +908,20 @@
           <div class="submitDataContainer">
             <el-button
               type="primary"
-              v-if="!query.checkUserId"
+              v-if="BookingNote_audit && !query.checkUserId"
               icon="el-icon-position"
               @click="handleAudit"
             >
               审 核
             </el-button>
-            <el-button type="primary" icon="el-icon-edit" @click="handleEdit"> 修 改</el-button>
+            <el-button
+              type="primary"
+              v-if="BookingNote_edit"
+              icon="el-icon-edit"
+              @click="handleEdit"
+            >
+              修 改</el-button
+            >
             <el-button type="primary" icon="el-icon-printer" @click="handlePrint"> 打 印</el-button>
             <el-button type="primary" icon="el-icon-close" @click="back()"> 关 闭</el-button>
           </div>
@@ -1383,6 +1390,16 @@ const {
 const permission = computed(() => mapGetters(['permission', 'tagWel', 'tagList']));
 console.log('permission :>> ', permission);
 
+// 修改按钮
+const BookingNote_edit = computed(() => {
+  return $store.getters.permission.BookingNote_edit;
+});
+
+// 审核按钮
+const BookingNote_audit = computed(() => {
+  return $store.getters.permission.BookingNote_audit;
+});
+
 // 合计费用
 const totalCost = computed(() => {
   console.log('details.pageInfo :>> ', details.pageInfo);

src/views/waybill/TemporaryStorageList.vue

@@ -44,24 +44,49 @@
             <div class="avue-crud__header">
               <!-- 头部左侧按钮模块 -->
               <div class="avue-crud__left">
-                <el-button type="primary" icon="el-icon-plus" @click="handleCreateOrder"
+                <!-- 订单转运单 -->
+                <el-button
+                  type="primary"
+                  icon="el-icon-plus"
+                  v-if="permissionObj.TemporaryStorageList_orderTransitionWaybill"
+                  click="handleCreateOrder"
                   >订单转运单
                 </el-button>
-                <el-button type="primary" icon="Edit" @click="editClientInfo">
+
+                <!-- 修改客户信息 -->
+                <el-button
+                  type="primary"
+                  icon="Edit"
+                  v-if="permissionObj.TemporaryStorageList_editClientInfo"
+                  @click="editClientInfo"
+                >
                   修改客户信息
                 </el-button>
-                <el-button type="primary" icon="Delete" @click="handleDelete">删除</el-button>
 
+                <!-- 删除 -->
+                <el-button
+                  type="primary"
+                  icon="Delete"
+                  v-if="permissionObj.TemporaryStorageList_delete"
+                  @click="handleDelete"
+                >
+                  删除
+                </el-button>
+
+                <!-- 开标签 -->
                 <el-button
                   type="primary"
                   icon="Plus"
-                  v-if="details.orderStatus === 'haveData'"
+                  v-if="permissionObj.TemporaryStorageList_openLabel"
                   @click="handleOpenAddTagDlog"
                   >开标签</el-button
                 >
+
+                <!-- 批量开标签导入 -->
                 <el-button
                   type="primary"
                   icon="Upload"
+                  v-if="permissionObj.TemporaryStorageList_batchOpenLableUpload"
                   @click="
                     () => {
                       details.popUpShow.UploadBatch = true;
@@ -71,10 +96,12 @@
                 >
                   批量开标签导入
                 </el-button>
+
+                <!-- 欧派数据导入 -->
                 <el-button
                   type="primary"
                   icon="Upload"
-                  v-if="details.orderStatus === 'haveData'"
+                  v-if="permissionObj.TemporaryStorageList_opInfoUpload"
                   @click="
                     () => {
                       details.popUpShow.UploadPackageDelivery = true;
@@ -85,7 +112,14 @@
                   欧派数据导入
                 </el-button>
 
-                <el-button type="primary" icon="Rank" @click="handleFreeze">冻结</el-button>
+                <!-- 冻结 -->
+                <el-button
+                  type="primary"
+                  icon="Rank"
+                  v-if="permissionObj.TemporaryStorageList_freeze"
+                  @click="handleFreeze"
+                  >冻结</el-button
+                >
               </div>
               <!-- 头部右侧按钮模块 -->
               <div class="avue-crud__right">
@@ -117,7 +151,7 @@
             <template #default="slotProps">
               <template v-if="slotProps.scope.column.label === '操作'">
                 <el-text
-                  v-if="details.orderStatus === 'haveData'"
+                  v-if="permissionObj.TemporaryStorageList_packageDetail"
                   @click="handleShowPackageOrderList(slotProps.scope)"
                 >
                   包明细
@@ -815,6 +849,50 @@ const details = reactive<any>({
   orderStatus: 'haveData' as 'haveData' | 'notHaveData',
 });
 
+/** 权限按钮 */
+const permissionObj = reactive({
+  /** 订单转运单 */
+  TemporaryStorageList_orderTransitionWaybill: computed(() => {
+    return $store.getters.permission.TemporaryStorageList_orderTransitionWaybill;
+  }),
+  /** 修改客户信息 */
+  TemporaryStorageList_editClientInfo: computed(() => {
+    return $store.getters.permission.TemporaryStorageList_editClientInfo;
+  }),
+  /** 删除 */
+  TemporaryStorageList_delete: computed(() => {
+    return $store.getters.permission.TemporaryStorageList_delete;
+  }),
+  /** 开标签 */
+  TemporaryStorageList_openLabel: computed(() => {
+    return (
+      $store.getters.permission.TemporaryStorageList_openLabel && details.orderStatus === 'haveData'
+    );
+  }),
+  /** 批量开标签导入 */
+  TemporaryStorageList_batchOpenLableUpload: computed(() => {
+    return $store.getters.permission.TemporaryStorageList_batchOpenLableUpload;
+  }),
+  /** 欧派数据导入 */
+  TemporaryStorageList_opInfoUpload: computed(() => {
+    return (
+      $store.getters.permission.TemporaryStorageList_opInfoUpload &&
+      details.orderStatus === 'haveData'
+    );
+  }),
+  /** 冻结 */
+  TemporaryStorageList_freeze: computed(() => {
+    return $store.getters.permission.TemporaryStorageList_freeze;
+  }),
+  /** 包明细 */
+  TemporaryStorageList_packageDetail: computed(() => {
+    return (
+      $store.getters.permission.TemporaryStorageList_packageDetail &&
+      details.orderStatus === 'haveData'
+    );
+  }),
+});
+
 const handleRules = () => {
   details.addTagFormRules = {};
 

src/views/waybill/WarehousingByTrainNumber.vue

@@ -32,7 +32,11 @@
         <div class="avue-crud__header">
           <!-- 头部左侧按钮模块 -->
           <div class="avue-crud__left">
-            <el-button type="primary" icon="Van" @click="handleBatchPutInStorage"
+            <el-button
+              type="primary"
+              icon="Van"
+              v-if="permissionObj.WarehousingByTrainNumber_batchIncoming"
+              @click="handleBatchPutInStorage"
               >批量入库</el-button
             >
           </div>
@@ -65,7 +69,11 @@
             >
               入库
             </el-text>
-            <el-text @click="handleGoDetails(slotProps.scope)">包明细</el-text>
+            <el-text
+              v-if="permissionObj.WarehousingByTrainNumber_packageDetail"
+              @click="handleGoDetails(slotProps.scope)"
+              >包明细</el-text
+            >
           </template>
         </template>
       </tablecmt>
@@ -112,10 +120,12 @@ import {
 } from '@/utils/util';
 import { columnList } from '@/option/waybill/WarehousingByTrainNumber';
 import { useRouter } from 'vue-router';
+import { useStore } from 'vuex';
 import { ElMessage, ElMessageBox } from 'element-plus';
 
 // 获取路由实例
 const $router = useRouter();
+const $store = useStore();
 
 // 表格实例
 const tableNodeRef = ref();
@@ -198,6 +208,19 @@ const details = reactive<any>({
   listNode: '',
   form: {},
 });
+
+/** 权限按钮 */
+const permissionObj = reactive({
+  /** 订单转运单 */
+  WarehousingByTrainNumber_batchIncoming: computed(() => {
+    return $store.getters.permission.WarehousingByTrainNumber_batchIncoming;
+  }),
+  /** 包明细 */
+  WarehousingByTrainNumber_packageDetail: computed(() => {
+    return $store.getters.permission.WarehousingByTrainNumber_packageDetail;
+  }),
+});
+
 /** 渲染数据 */
 const renderData = shallowRef([]);
 

src/views/waybill/WaybillOrderList.vue

@@ -55,13 +55,43 @@
         <!-- 头部左侧按钮模块 -->
         <div class="avue-crud__left">
           <el-button type="primary" icon="Printer" @click="batchPrint">打 印</el-button>
-          <el-button type="primary" icon="Edit" @click="editOrder">改 单</el-button>
+          <el-button
+            type="primary"
+            v-if="permissionObj.WaybillOrderList_edit"
+            icon="Edit"
+            @click="editOrder"
+            >改 单</el-button
+          >
           <!-- <el-button type="primary" icon="Plus" @click="searchChange">加入挑单夹</el-button> -->
           <!-- <el-button type="primary" icon="Location" @click="searchChange">运单跟踪</el-button> -->
-          <el-button type="primary" icon="Delete" @click="handleBatchDelete">批量作废</el-button>
-          <el-button type="primary" icon="Rank" @click="handleBatchFreeze">冻 结</el-button>
-          <el-button type="primary" icon="Refresh" @click="handleBatchRecover">恢 复</el-button>
-          <el-button type="primary" icon="Download" @click="handleExport">导 出</el-button>
+          <el-button
+            type="primary"
+            icon="Delete"
+            v-if="permissionObj.WaybillOrderList_edit"
+            @click="handleBatchDelete"
+            >批量作废</el-button
+          >
+          <el-button
+            type="primary"
+            icon="Rank"
+            v-if="permissionObj.WaybillOrderList_freeze"
+            @click="handleBatchFreeze"
+            >冻 结</el-button
+          >
+          <el-button
+            type="primary"
+            icon="Refresh"
+            v-if="permissionObj.WaybillOrderList_recover"
+            @click="handleBatchRecover"
+            >恢 复</el-button
+          >
+          <el-button
+            type="primary"
+            icon="Download"
+            v-if="permissionObj.WaybillOrderList_export"
+            @click="handleExport"
+            >导 出</el-button
+          >
         </div>
         <!-- 头部右侧按钮模块 -->
         <div class="avue-crud__right">
@@ -104,8 +134,18 @@
               slotProps.scope.row.freezeStatus + '' !== '1'
             "
           >
-            <el-text @click="handleViewOrderDetails(slotProps.scope)"> 查看订单 </el-text>
-            <el-text @click="handleUploadReceipt(slotProps.scope)"> 上传回单 </el-text>
+            <el-text
+              @click="handleViewOrderDetails(slotProps.scope)"
+              v-if="permissionObj.WaybillOrderList_view"
+            >
+              查看订单
+            </el-text>
+            <el-text
+              @click="handleUploadReceipt(slotProps.scope)"
+              v-if="permissionObj.WaybillOrderList_uploadReceipt"
+            >
+              上传回单
+            </el-text>
           </template>
         </template>
       </tablecmt>
@@ -368,6 +408,38 @@ const {
 const permission = computed(() => mapGetters(['permission', 'tagWel', 'tagList']));
 console.log('permission :>> ', permission);
 
+/** 权限按钮 */
+const permissionObj = reactive({
+  /** 改单 */
+  WaybillOrderList_edit: computed(() => {
+    return $store.getters.permission.WaybillOrderList_edit;
+  }),
+  /** 批量作废 */
+  WaybillOrderList_batchCancellation: computed(() => {
+    return $store.getters.permission.WaybillOrderList_batchCancellation;
+  }),
+  /** 冻结 */
+  WaybillOrderList_freeze: computed(() => {
+    return $store.getters.permission.WaybillOrderList_freeze;
+  }),
+  /** 恢复 */
+  WaybillOrderList_recover: computed(() => {
+    return $store.getters.permission.WaybillOrderList_recover;
+  }),
+  /** 导出 */
+  WaybillOrderList_export: computed(() => {
+    return $store.getters.permission.WaybillOrderList_export;
+  }),
+  /** 查看订单 */
+  WaybillOrderList_view: computed(() => {
+    return $store.getters.permission.WaybillOrderList_view;
+  }),
+  /** 上传回单 */
+  WaybillOrderList_uploadReceipt: computed(() => {
+    return $store.getters.permission.WaybillOrderList_uploadReceipt;
+  }),
+});
+
 onMounted(() => {
   const timer = setTimeout(() => {
     details.listNode = document.querySelector('.maboxhi');

src/views/wel/index1.vue

@@ -1,952 +0,0 @@
-<template>
-  <div class="main_container">
-    <!-- 开单数据 && 开单收入 -->
-    <div class="flex mb10 row_first">
-      <!-- 开单数据 -->
-      <div class="mr10 box1 view_box">
-        <!-- 标题 -->
-        <div class="align_center mb20">
-          <img class="mr10 img_13pt" src="@/static/icon_data.png" alt="" />
-
-          <div class="title">开单数据</div>
-        </div>
-
-        <!-- 数据 -->
-        <div class="border pd10">
-          <div class="height40pt flex-c-sb border-bottom">
-            <div class="align_center">
-              <img class="mr10 img_16pt" src="@/static/icon_storage.png" alt="" />
-
-              <div>总计</div>
-            </div>
-
-            <div class="align_center">
-              <span class="data mr10">123</span>
-              <span>单</span>
-            </div>
-          </div>
-
-          <div class="height40pt flex-c-sb border-bottom">
-            <div class="align_center">
-              <img class="mr10 img_16pt" src="@/static/icon_month.png" alt="" />
-
-              <div>当月</div>
-            </div>
-
-            <div class="align_center">
-              <span class="data mr10">123</span>
-              <span>单</span>
-            </div>
-          </div>
-
-          <div class="height40pt flex-c-sb">
-            <div class="align_center">
-              <img class="mr10 img_16pt" src="@/static/icon_day.png" alt="" />
-
-              <div>当日</div>
-            </div>
-
-            <div class="align_center">
-              <span class="data mr10">123</span>
-              <span>单</span>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <!-- 开单收入 -->
-      <div class="flex1 box2 view_box">
-        <!-- 标题 -->
-        <div class="align_center mb20">
-          <img class="mr10 img_13pt" src="@/static/icon_money.png" alt="" />
-
-          <div class="title">开单收入</div>
-        </div>
-
-        <div class="flex">
-          <!-- 统计数据 -->
-          <div class="border flexnone totol pd10">
-            <!-- 总计 -->
-            <div class="height40pt flex-c-sb border-bottom">
-              <div class="align_center">
-                <img class="mr10 img_16pt" src="@/static/icon_storage.png" alt="" />
-
-                <div>总计</div>
-              </div>
-
-              <div class="align_center">
-                <span class="data mr10">123</span>
-                <span>元</span>
-              </div>
-            </div>
-
-            <div class="monthData flex-c-sb">
-              <!-- 当月 -->
-              <div class="flex1">
-                <div class="align_center">
-                  <img class="mr10 img_16pt" src="@/static/icon_month.png" alt="" />
-
-                  <div>当月</div>
-                </div>
-
-                <div class="align_center">
-                  <span class="data mr10">123</span>
-                  <span>元</span>
-                </div>
-              </div>
-
-              <!-- 当日 -->
-              <div class="flex1 border-left">
-                <div class="align_center">
-                  <img class="mr10 img_16pt" src="@/static/icon_day.png" alt="" />
-
-                  <div>当日</div>
-                </div>
-
-                <div class="align_center">
-                  <span class="data mr10">123</span>
-                  <span>元</span>
-                </div>
-              </div>
-            </div>
-          </div>
-
-          <!-- 详情数据 -->
-          <div class="detailsData flex1 ml10">
-            <div class="flex-c-sb">
-              <div class="item flex1 mr10">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>干线 - 月</div>
-              </div>
-
-              <div class="item flex1 mr10">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>仓储 - 月</div>
-              </div>
-
-              <div class="item flex1 mr10">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>配送 - 月</div>
-              </div>
-
-              <div class="item flex1 mr10">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>提货 - 月</div>
-              </div>
-
-              <div class="item flex1">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>安装 - 月</div>
-              </div>
-            </div>
-            <div class="flex-c-sb mt10">
-              <div class="item flex1 mr10">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>干线 - 日</div>
-              </div>
-
-              <div class="item flex1 mr10">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>仓储 - 日</div>
-              </div>
-
-              <div class="item flex1 mr10">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>配送 - 日</div>
-              </div>
-              <div class="item flex1 mr10">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>提货 - 日</div>
-              </div>
-
-              <div class="item flex1">
-                <div>
-                  <span class="data mr5px">123123</span>
-                  <span>元</span>
-                </div>
-
-                <div>安装 - 日</div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- 当前所在库位数据 && 库位数据 -->
-    <div class="flex mb10 row_second">
-      <!-- 当前所在库位数据 -->
-      <div class="mr10 box1 view_box">
-        <!-- 标题 -->
-        <div class="align_center mb20">
-          <img class="mr10 img_13pt" src="@/static/icon_data.png" alt="" />
-
-          <div class="title">当前在库数据</div>
-        </div>
-
-        <!-- 数据 -->
-        <div class="border data_container pd10 flex">
-          <div class="item">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>总数</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>零担</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>三方中转</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>商配</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>市配</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>自提</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>已打托</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <!-- 库位数据 -->
-      <div class="flex1 box2 view_box">
-        <!-- 标题 -->
-        <div class="align_center mb20">
-          <img class="mr10 img_13pt" src="@/static/icon_money.png" alt="" />
-
-          <div class="title">库位数据</div>
-        </div>
-
-        <div class="border data_container pd10 flex">
-          <div class="item">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>总数</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">个</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>已上架</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">个</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>空置</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">个</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>已上架</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-
-          <div class="item border-left">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>未上架</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">件</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- 干线待发运在库数据 && 干线车次统计 && 异常数据 -->
-    <div class="flex mb10 row_third">
-      <!-- 当前所在库位数据 -->
-      <div class="mr10 box1 flex1 view_box">
-        <!-- 标题 -->
-        <div class="align_center mb20">
-          <img class="mr10 img_13pt" src="@/static/icon_data.png" alt="" />
-
-          <div class="title">干线待发运在库数据</div>
-        </div>
-
-        <!-- 数据 -->
-        <div class="border pd10 flex-c-sb">
-          <div class="text_center">
-            <div class="data_box orange mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">单</div>
-            </div>
-            <div class="">
-              <span>运单总数</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box orange mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">件</div>
-            </div>
-            <div class="">
-              <span>在库总件数</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box orange mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">kg</div>
-            </div>
-            <div class="">
-              <span>在库总重量</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box orange mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">m³</div>
-            </div>
-            <div class="">
-              <span>在库总方数</span>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <!-- 干线车次统计 -->
-      <div class="mr10 flex1 box2 view_box">
-        <!-- 标题 -->
-        <div class="align_center mb20">
-          <img class="mr10 img_13pt" src="@/static/icon_money.png" alt="" />
-
-          <div class="title">干线车次统计</div>
-        </div>
-
-        <div class="border pd10 flex-c-sb">
-          <div class="text_center">
-            <div class="data_box mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">车</div>
-            </div>
-            <div class="">
-              <span>总车次</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">车</div>
-            </div>
-            <div class="">
-              <span>在途</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">车</div>
-            </div>
-            <div class="">
-              <span>作业</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">车</div>
-            </div>
-            <div class="">
-              <span>卸车完成</span>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <!-- 异常数据 -->
-      <div class="flex1 box2 view_box">
-        <!-- 标题 -->
-        <div class="flex-c-sb mb20">
-          <div class="align_center">
-            <img class="mr10 img_13pt" src="@/static/icon_money.png" alt="" />
-
-            <div class="title">异常数据</div>
-          </div>
-
-          <div class="align_center">
-            <div :class="{ button: true, active: isActive }" @click="isActive = !isActive">
-              当天
-            </div>
-            <div :class="{ button: true, active: !isActive }" @click="isActive = !isActive">
-              当月
-            </div>
-          </div>
-        </div>
-
-        <div class="abnormal_container flex-c-sb">
-          <div class="abnormal_item green">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>发起数</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">单</span>
-            </div>
-          </div>
-
-          <div class="abnormal_item blue">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>待处理</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">单</span>
-            </div>
-          </div>
-
-          <div class="abnormal_item red">
-            <div class="align_center">
-              <img class="dataIcon mr5px" src="@/static/icon_money_day.png" alt="" />
-              <span>异常率</span>
-            </div>
-            <div class="mt10">
-              <span class="data mr5px">16899</span>
-              <span class="">%</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-
-    <!-- 当前配送数据 && 签收数据 -->
-    <div class="flex mb10 row_fourthly">
-      <!-- 当前配送数据 -->
-      <div class="mr10 box1 view_box" style="width: 40%">
-        <!-- 标题 -->
-        <div class="flex-c-sb mb20">
-          <div class="align_center">
-            <img class="mr10 img_13pt" src="@/static/icon_data.png" alt="" />
-
-            <div class="title">当前配送数据</div>
-          </div>
-
-          <div class="align_center">
-            <div :class="{ button: true, active: isActive }" @click="isActive = !isActive">
-              市配
-            </div>
-            <div :class="{ button: true, active: !isActive }" @click="isActive = !isActive">
-              商配
-            </div>
-          </div>
-        </div>
-
-        <!-- 数据 -->
-        <div class="border pd10 flex-c-sb">
-          <div class="text_center">
-            <div class="data_box blue mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">单</div>
-            </div>
-            <div class="">
-              <span>配送计划总数</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box blue mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">件</div>
-            </div>
-            <div class="">
-              <span>总作业</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box blue mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">kg</div>
-            </div>
-            <div class="">
-              <span>总重量</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box blue mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">m³</div>
-            </div>
-            <div class="">
-              <span>总方数</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box blue mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">件</div>
-            </div>
-            <div class="">
-              <span>在途件数</span>
-            </div>
-          </div>
-        </div>
-      </div>
-
-      <!-- 签收数据 -->
-      <div class="flex1 box2 view_box">
-        <!-- 标题 -->
-        <div class="align_center mb20">
-          <img class="mr10 img_13pt" src="@/static/icon_money.png" alt="" />
-
-          <div class="title">签收数据</div>
-        </div>
-
-        <div class="border pd10 flex-c-sb">
-          <div class="text_center">
-            <div class="data_box mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">件</div>
-            </div>
-            <div class="">
-              <span>已签收</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box orange mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">件</div>
-            </div>
-            <div class="">
-              <span>未签收</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box blue mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">%</div>
-            </div>
-            <div class="">
-              <span>签收率</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box purple mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">件</div>
-            </div>
-            <div class="">
-              <span>文员签收数</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box purple mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">%</div>
-            </div>
-            <div class="">
-              <span>文员签收率</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box red mb10">
-              <div class="data mr5px">16899</div>
-              <div class="">件</div>
-            </div>
-            <div class="">
-              <span>超时签收</span>
-            </div>
-          </div>
-
-          <div class="text_center">
-            <div class="data_box red mb10">
-              <div class="data mr5px">168991</div>
-              <div class="">%</div>
-            </div>
-            <div class="">
-              <span>签收超时率</span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-<script setup>
-import { ref, onMounted } from 'vue';
-
-const isActive = ref(false);
-</script>
-
-<style scoped lang="scss">
-.main_container {
-  font-size: 14px;
-  background: #f5f5f6;
-  padding: 0 5px;
-}
-
-.view_box {
-  padding: 10px;
-  padding-top: 8px;
-  background: #fff;
-  border-radius: 5px;
-
-  .title {
-    font-weight: bold;
-    font-size: 18px;
-    line-height: 18px;
-  }
-
-  .img_16pt {
-    width: 20px;
-    height: 20px;
-  }
-}
-
-.mb20 {
-  margin-bottom: 20px;
-}
-
-.pd10 {
-  padding: 0 10px;
-}
-
-.align_center {
-  display: flex;
-  align-items: center;
-}
-
-// 开单数据
-.height40pt {
-  height: 60px;
-}
-
-// 数据样式
-.data {
-  font-weight: bold;
-  color: #000;
-  font-family: DIN-Bold;
-  font-size: 20px;
-}
-
-.border {
-  border: 1pt solid #f5f5f6;
-  border-radius: 5px;
-  box-sizing: border-box;
-}
-
-.border-bottom {
-  border-bottom: 1pt solid #f5f5f6;
-  box-sizing: border-box;
-}
-
-.border-left {
-  border-left: 1px solid #f5f5f6;
-  box-sizing: border-box;
-}
-
-// 第一排
-.row_first {
-  & > div {
-    height: 100%;
-  }
-
-  .box1 {
-    height: 100%;
-    width: 340px;
-    box-sizing: border-box;
-    flex: none;
-  }
-
-  // 开单收入
-  .box2 {
-    height: 100%;
-
-    // 统计数据
-    .totol {
-      width: 460px;
-
-      .monthData {
-        height: 120px;
-
-        & > div {
-          height: 80%;
-          flex-direction: column;
-          display: flex;
-          justify-content: space-around;
-          padding: 0 10px;
-          box-sizing: border-box;
-        }
-      }
-    }
-
-    // 详情数据
-    .detailsData {
-      .item {
-        background: #f2f7fb;
-        border-radius: 5px;
-        height: 85px;
-        box-sizing: border-box;
-        padding: 10px;
-        color: #a4b0c2;
-        display: flex;
-        justify-content: space-between;
-        flex-direction: column;
-      }
-    }
-  }
-}
-
-// 第二排
-.row_second {
-  .dataIcon {
-    height: 14px;
-    width: 14px;
-  }
-
-  .data_container {
-    height: 100px;
-    box-sizing: border-box;
-    padding: 20px 0;
-  }
-
-  .item {
-    width: 137px;
-    height: 100%;
-    padding: 0 20px;
-    box-sizing: border-box;
-    flex: none;
-  }
-}
-
-// 第三排
-.row_third {
-  @extend .row_second;
-  .abnormal_container {
-    height: 100px;
-  }
-
-  .abnormal_item {
-    box-sizing: border-box;
-    padding: 20px;
-    width: 160px;
-    color: #7b8ba4;
-
-    &.red {
-      background: #ffeeed;
-
-      .data {
-        color: #ff5d52;
-      }
-    }
-
-    &.blue {
-      background: #e9f4ff;
-
-      .data {
-        color: #2693ff;
-      }
-    }
-
-    &.green {
-      background: #e5f8f3;
-
-      .data {
-        color: #00c090;
-      }
-    }
-  }
-
-  .button {
-    padding: 0px 10px;
-    height: 18px;
-    line-height: 18px;
-    background: #fff;
-    border: 1px solid #f5f5f6;
-    border-radius: 2px;
-    color: #000;
-    font-size: 12px;
-    transition: all 0.3s;
-    cursor: pointer;
-    &.active {
-      color: #fff;
-      background: #2693ff;
-      border-color: #2693ff;
-    }
-  }
-}
-
-// 第四排
-.row_fourthly {
-  @extend .row_third;
-
-  .item {
-    width: 150px;
-  }
-}
-
-.data_box {
-  padding: 16px;
-  min-width: 80px;
-  word-break: break-all;
-  background-color: #e5f8f3;
-  border-radius: 4px;
-  border-bottom: 5px solid #00c090;
-
-  &.orange {
-    background: #fff4ec;
-    border-color: #ff9545;
-  }
-
-  &.blue {
-    background-color: #f2f7fb;
-    border-color: #2693ff;
-  }
-
-  &.red {
-    background: #ffeeed;
-    border-color: #ff5d52;
-  }
-
-  &.purple {
-    background: #f0eff8;
-    border-color: #6b60c2;
-  }
-}
-
-.mr5px {
-  margin-right: 5px;
-}
-
-.text_center {
-  text-align: center;
-}
-</style>
-<style lang="scss" scope>
-@import '../../styles/flowStyle.scss';
-
-#avue-view {
-  background-color: #fff;
-}
-</style>

src/views/wel/index2.vue

@@ -0,0 +1,248 @@
+<template>
+  <div class="bx" v-if="indexState">
+    <div class="left">
+      <div class="tptitl">
+        <img src="./static/topicon.png" />
+        <span>发货操作</span>
+      </div>
+      <div class="onebx1">
+        <div class="item1">
+          <img src="./static/1.png" />
+          <span>提货</span>
+        </div>
+        <div class="item2">
+          <img src="./static/2.png" />
+          <span>预开单</span>
+        </div>
+        <div class="item3">
+          <img src="./static/3.png" />
+          <span>创建运单</span>
+        </div>
+        <div class="item4">
+          <img src="./static/4.png" />
+          <span>补录运单</span>
+        </div>
+        <div class="item5">
+          <img src="./static/5.png" />
+          <span>短驳发车</span>
+        </div>
+        <div class="item6">
+          <img src="./static/6.png" />
+          <span>外部中转</span>
+        </div>
+        <div class="item7">
+          <img src="./static/7.png" />
+          <span>库存管理</span>
+        </div>
+        <div class="item8">
+          <img src="./static/8.png" />
+          <span>车辆配载</span>
+        </div>
+        <img class="upimg" src="./static/up.png" />
+        <img class="rigth1" src="./static/rigth.png" />
+        <img class="rigth2" src="./static/rigth.png" />
+        <img class="rigth3" src="./static/rigth.png" />
+        <img class="rigth4" src="./static/rigth.png" />
+        <img class="rigthall" src="./static/rigthall.png" />
+      </div>
+    </div>
+    <div class="ztjk">
+      <img src="./static/9.png" />
+      <span>到货操作</span>
+    </div>
+    <div class="rigth">
+      <div class="tptitl">
+        <img src="./static/topicon.png" />
+        <span>到货操作</span>
+      </div>
+      <div class="onebx1">
+        <div class="item1">
+          <img src="./static/10.png" />
+          <span>到站卸车</span>
+        </div>
+        <div class="item2">
+          <img src="./static/11.png" />
+          <span>库存管理</span>
+        </div>
+        <div class="item3">
+          <img src="./static/12.png" />
+          <span>短驳接收</span>
+        </div>
+        <div class="item4">
+          <img src="./static/13.png" />
+          <span>外部中转</span>
+        </div>
+        <div class="item5">
+          <img src="./static/14.png" />
+          <span>送货</span>
+        </div>
+        <div class="item6">
+          <img src="./static/15.png" />
+          <span>中转签收</span>
+        </div>
+        <div class="item7">
+          <img src="./static/16.png" />
+          <span>送货签收</span>
+        </div>
+        <div class="item8">
+          <img src="./static/17.png" />
+          <span>自提签收</span>
+        </div>
+        <img class="upimg" src="./static/down.png" />
+        <img class="rigth1" src="./static/rigth.png" />
+        <img class="rigth2" src="./static/rigth.png" />
+        <img class="rigth3" src="./static/rigth.png" />
+        <img class="rigth4" src="./static/rigth.png" />
+        <img class="rigthall" src="./static/rigthall2.png" />
+        <img class="leftall" src="./static/leftall.png" />
+      </div>
+    </div>
+    <div class="buts">
+      <div class="tptitl">
+        <img src="./static/topicon.png" />
+        <span>回单管理</span>
+      </div>
+      <div class="onebx1">
+        <div class="item1">
+          <img src="./static/18.png" />
+          <span>回单回收</span>
+        </div>
+        <div class="item2">
+          <img src="./static/19.png" />
+          <span>回单寄出</span>
+        </div>
+        <div class="item3">
+          <img src="./static/20.png" />
+          <span>回单接收</span>
+        </div>
+        <div class="item4">
+          <img src="./static/21.png" />
+          <span>回单发放</span>
+        </div>
+        <img class="left1" src="./static/rigth.png" />
+        <img class="left2" src="./static/rigth.png" />
+        <img class="left3" src="./static/rigth.png" />
+      </div>
+    </div>
+    <div class="el-gl">
+      <div>公告栏</div>
+    </div>
+  </div>
+  <div v-else class="el_Hwlogo">
+    <div class="content">
+      <img src="/public/img/p-logo.png" alt="" />
+      <div class="info">
+        <div class="name">{{ name }}</div>
+        <div class="slogan">您好！欢迎使用货无忧</div>
+        <div class="title">成都数联物科信息技术有限公司</div>
+        <div class="time">{{ currentTime }}</div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup>
+import { ref, onMounted } from 'vue';
+const indexState = ref(false);
+const currentTime = ref('0000年00月00日00时00分00秒');
+const name = ref('');
+name.value = JSON.parse(localStorage.getItem('TWMS-userInfo')).content.real_name;
+setInterval(() => {
+  const now = new Date();
+  const year = now.getFullYear();
+  const month = String(now.getMonth() + 1).padStart(2, '0');
+  const day = String(now.getDate()).padStart(2, '0');
+  const hours = String(now.getHours()).padStart(2, '0');
+  const minutes = String(now.getMinutes()).padStart(2, '0');
+  const seconds = String(now.getSeconds()).padStart(2, '0');
+  currentTime.value = `${year}年${month}月${day}日${hours}时${minutes}分${seconds}秒`;
+}, 1000);
+</script>
+<style scoped lang="scss">
+.info {
+  display: flex;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  .name {
+    font-size: 40px;
+    color: #d3832a;
+    font-weight: bold;
+  }
+  .slogan {
+    font-size: 3em;
+  }
+  .time {
+    display: flex;
+    margin-top: 10px;
+    justify-content: flex-end;
+  }
+  .title {
+    display: flex;
+    margin-top: 10px;
+    justify-content: flex-end;
+  }
+}
+.el_Hwlogo {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  span {
+    color: #d3832a;
+  }
+  img {
+    width: 300px;
+    height: 300px;
+  }
+  .content {
+    display: flex;
+    flex-direction: row;
+    flex-wrap: wrap;
+    align-items: center;
+    justify-content: center;
+  }
+}
+.el-gl {
+  font-weight: 500;
+  text-align: center;
+  position: absolute;
+  right: 10px;
+  top: 10px;
+  width: 15%;
+  background-color: #fff;
+  border-radius: 32px;
+  padding: 5px;
+  box-sizing: border-box;
+  border: 1px solid #f1eeee69;
+  box-shadow: 4px 6px 0 #d3dff6, 1px 1px 9px #d3dff6;
+  height: 762px;
+}
+</style>
+<style lang="scss" scope>
+@import '../../styles/flowStyle.scss';
+
+#avue-view {
+  background-color: #fff;
+}
+</style>
+<script>
+import { mapGetters } from 'vuex';
+export default {
+  name: 'wel',
+  data() {
+    return {
+      activeNames: ['1', '2', '3', '5'],
+      logActiveNames: ['29'],
+    };
+  },
+  computed: {
+    ...mapGetters(['userInfo']),
+  },
+  methods: {
+    handleChange(val) {
+      window.console.log(val);
+    },
+  },
+};
+</script>