进销存升级app 1.工作台图标替换

gaoluyang

8 小时以前 e7d45b61ad438bb96c0d0d7f17923f024a1e6aaf

 src/pages/indexItem.vue

@@ -14,11 +14,8 @@
          <up-grid-item v-for="(item, index) in commonItems"
                        :key="index"
                        @click="handleCommonItemClick(item)">
            <view class="icon-container"
                  :style="{ background: item.bgColor }">
              <up-icon :name="item.icon"
                       :size="58"
                       color="#ffffff"></up-icon>
            <view class="icon-container">
              <image :src="item.icon" class="item-icon"></image>
            </view>
            <text class="item-label">{{item.label}}</text>
          </up-grid-item>
@@ -35,331 +32,94 @@
  import PageHeader from "@/components/PageHeader.vue";

  const userStore = useUserStore();
  const kaoqin = reactive([
    {
      icon: "/static/images/icon/gongchuguanli@2x.png",
      label: "公出管理",
    },
    {
      icon: "/static/images/icon/qingjiaguanli@2x.png",
      label: "请假管理",
    },
    {
      icon: "/static/images/icon/chuchaiguanli@2x.png",
      label: "出差管理",
    },
  ]);
  const caiwu = reactive([
    {
      icon: "/static/images/icon/baoxiaoguanli.png",
      label: "报销管理",
    },
    {
      icon: "/static/images/icon/caigouguanli.png",
      label: "采购审批",
    },
    {
      icon: "/static/images/icon/baojiaguanli.png",
      label: "报价审批",
    },
    {
      icon: "/static/images/icon/chukuguanli@2x.png",
      label: "发货审批",
    },
  ]);
  // 考勤财务合并菜单（考勤3个 + 财务4个 = 7个）
  const kaoqinCaiwu = reactive([
    {
      icon: "/static/images/icon/gongchuguanli@2x.png",
      label: "公出管理",
    },
    {
      icon: "/static/images/icon/qingjiaguanli@2x.png",
      label: "请假管理",
    },
    {
      icon: "/static/images/icon/chuchaiguanli@2x.png",
      label: "出差管理",
    },
    {
      icon: "/static/images/icon/baoxiaoguanli.png",
      label: "报销管理",
    },
    {
      icon: "/static/images/icon/caigouguanli.png",
      label: "采购审批",
    },
    {
      icon: "/static/images/icon/baojiaguanli.png",
      label: "报价审批",
    },
    {
      icon: "/static/images/icon/chukuguanli@2x.png",
      label: "发货审批",
    },
  ]);

  const huiyi = reactive([
    {
      icon: "/static/images/icon/huiyishezhi@2x.png",
      label: "会议设置",
    },
    {
      icon: "/static/images/icon/huiyiliebiao@2x.png",
      label: "会议列表",
    },
    {
      icon: "/static/images/icon/huiyishenqing@2x.png",
      label: "会议申请",
    },
    {
      icon: "/static/images/icon/huiyishenpi@2x.png",
      label: "会议审批",
    },
    {
      icon: "/static/images/icon/huiyifabu@2x.png",
      label: "会议发布",
    },
    {
      icon: "/static/images/icon/huiyizongjie@2x.png",
      label: "会议总结",
    },
    {
      icon: "/static/images/icon/huiyikanban@2x.png",
      label: "会议看板",
    },
  ]);
  const operationType = ref("");
  const commonItems = ref([]);

  // 路由映射配置
  const routeMapping = {
    "销售台账": "/pages/sales/salesAccount/index",
    "开票登记": "/pages/sales/invoicingRegistration/index",
    "开票台账": "/pages/sales/invoiceLedger/index",
    "回款登记": "/pages/sales/receiptPayment/index",
    "回款流水": "/pages/sales/receiptPaymentHistory/index",
    "客户往来": "/pages/sales/receiptPaymentLedger/index",
    "采购台账": "/pages/procurementManagement/procurementLedger/index",
    "来票登记": "/pages/procurementManagement/invoiceEntry/index",
    "来票台账": "/pages/procurementManagement/procurementInvoiceLedger/index",
    "付款登记": "/pages/procurementManagement/paymentEntry/index",
    "付款流水": "/pages/procurementManagement/receiptPaymentHistory/index",
    "供应商往来": "/pages/procurementManagement/paymentLedger/index",
    "公出管理": "/pages/cooperativeOffice/collaborativeApproval/index1",
    "请假管理": "/pages/cooperativeOffice/collaborativeApproval/index2",
    "出差管理": "/pages/cooperativeOffice/collaborativeApproval/index3",
    "报销管理": "/pages/cooperativeOffice/collaborativeApproval/index4",
    "采购审批": "/pages/cooperativeOffice/collaborativeApproval/index5",
    "报价审批": "/pages/cooperativeOffice/collaborativeApproval/index6",
    "发货审批": "/pages/cooperativeOffice/collaborativeApproval/index7",
    "协同审批": "/pages/cooperativeOffice/collaborativeApproval/index",
    "会议设置": "/pages/managementMeetings/meetingSettings/index",
    "会议列表": "/pages/managementMeetings/meetingList/index",
    "会议申请": "/pages/managementMeetings/meetApplication/index",
    "会议审批": "/pages/managementMeetings/meetExamine/index",
    "会议发布": "/pages/managementMeetings/meetPublish/index",
    "会议总结": "/pages/managementMeetings/meetSummary/index",
    "会议看板": "/pages/managementMeetings/meetingBoard/index",
    "通知公告": "/pages/cooperativeOffice/noticeManagement/index",
    "知识库": "/pages/managementMeetings/knowledgeBase/index",
    "用印管理": "/pages/managementMeetings/sealManagement/index",
    "规章制度": "/pages/managementMeetings/rulesRegulationsManagement/index",
    "客户拜访": "/pages/cooperativeOffice/clientVisit/index",
    "生产订单": "/pages/productionManagement/productionOrder/index",
    "生产派工": "/pages/productionManagement/productionDispatching/index",
    "工序排产": "/pages/productionManagement/processScheduling/index",
    "生产核算": "/pages/productionManagement/productionAccounting/index",
    "设备台账": "/pages/equipmentManagement/ledger/index",
    "设备报修": "/pages/equipmentManagement/repair/index",
    "设备保养": "/pages/equipmentManagement/upkeep/index",
    "设备巡检": "/pages/inspectionUpload/index",
    "分析追溯": "/pages/equipmentManagement/faultAnalysis/index",
    "智能派单": "/pages/equipmentManagement/smartDispatch/index",
    "作业指导": "/pages/equipmentManagement/sop/index",
    "结果验证": "/pages/equipmentManagement/verification/index",
  };

  // 菜单配置
  const menuConfig = {
    "考勤管理": [
      { icon: "/static/images/icon/gongchuguanli.svg", label: "公出管理" },
      { icon: "/static/images/icon/qingjiaguanli.svg", label: "请假管理" },
      { icon: "/static/images/icon/chuchaiguanli.svg", label: "出差管理" },
    ],
    "会议管理": [
      { icon: "/static/images/icon/huiyishezhi.svg", label: "会议设置" },
      { icon: "/static/images/icon/huiyiliebiao.svg", label: "会议列表" },
      { icon: "/static/images/icon/huiyishenqing.svg", label: "会议申请" },
      { icon: "/static/images/icon/huiyishenpi.svg", label: "会议审批" },
      { icon: "/static/images/icon/huiyifabu.svg", label: "会议发布" },
      { icon: "/static/images/icon/huiyizongjie.svg", label: "会议总结" },
      { icon: "/static/images/icon/huiyikanban.svg", label: "会议看板" },
    ],
    "协同审批": [
      { icon: "/static/images/icon/gongchuguanli.svg", label: "公出管理" },
      { icon: "/static/images/icon/qingjiaguanli.svg", label: "请假管理" },
      { icon: "/static/images/icon/chuchaiguanli.svg", label: "出差管理" },
      { icon: "/static/images/icon/baoxiaoguanli.svg", label: "报销管理" },
      { icon: "/static/images/icon/caigouguanli.svg", label: "采购审批" },
      { icon: "/static/images/icon/baojiaguanli.svg", label: "报价审批" },
      { icon: "/static/images/icon/chukuguanli.svg", label: "发货审批" },
    ],
  };

  // 处理常用功能点击
  const handleCommonItemClick = item => {
    // 根据不同的功能项进行跳转
    switch (item.label) {
      case "销售台账":
        uni.navigateTo({
          url: "/pages/sales/salesAccount/index",
        });
        break;
      case "开票登记":
        uni.navigateTo({
          url: "/pages/sales/invoicingRegistration/index",
        });
        break;
      case "开票台账":
        uni.navigateTo({
          url: "/pages/sales/invoiceLedger/index",
        });
        break;
      case "回款登记":
        uni.navigateTo({
          url: "/pages/sales/receiptPayment/index",
        });
        break;
      case "回款流水":
        uni.navigateTo({
          url: "/pages/sales/receiptPaymentHistory/index",
        });
        break;
      case "客户往来":
        uni.navigateTo({
          url: "/pages/sales/receiptPaymentLedger/index",
        });
        break;
      case "采购台账":
        uni.navigateTo({
          url: "/pages/procurementManagement/procurementLedger/index",
        });
        break;
      case "来票登记":
        uni.navigateTo({
          url: "/pages/procurementManagement/invoiceEntry/index",
        });
        break;
      case "来票台账":
        uni.navigateTo({
          url: "/pages/procurementManagement/procurementInvoiceLedger/index",
        });
        break;
      case "付款登记":
        uni.navigateTo({
          url: "/pages/procurementManagement/paymentEntry/index",
        });
        break;
      case "付款流水":
        uni.navigateTo({
          url: "/pages/procurementManagement/receiptPaymentHistory/index",
        });
        break;
      case "供应商往来":
        uni.navigateTo({
          url: "/pages/procurementManagement/paymentLedger/index",
        });
        break;
      case "公出管理":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index1",
        });
        break;
      case "请假管理":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index2",
        });
        break;
      case "出差管理":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index3",
        });
        break;
      case "报销管理":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index4",
        });
        break;
      case "采购审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index5",
        });
        break;
      case "报价审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index6",
        });
        break;
      case "发货审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index7",
        });
        break;
      case "会议设置":
        uni.navigateTo({
          url: "/pages/managementMeetings/meetingSettings/index",
        });
        break;
      case "会议列表":
        uni.navigateTo({
          url: "/pages/managementMeetings/meetingList/index",
        });
        break;
      case "会议申请":
        uni.navigateTo({
          url: "/pages/managementMeetings/meetApplication/index",
        });
        break;
      case "会议审批":
        uni.navigateTo({
          url: "/pages/managementMeetings/meetExamine/index",
        });
        break;
      case "会议发布":
        uni.navigateTo({
          url: "/pages/managementMeetings/meetPublish/index",
        });
        break;
      case "会议总结":
        uni.navigateTo({
          url: "/pages/managementMeetings/meetSummary/index",
        });
        break;
      case "会议看板":
        uni.navigateTo({
          url: "/pages/managementMeetings/meetingBoard/index",
        });
        break;
      case "通知公告":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/noticeManagement/index",
        });
        break;
      case "知识库":
        uni.navigateTo({
          url: "/pages/managementMeetings/knowledgeBase/index",
        });
        break;
      case "用印管理":
        uni.navigateTo({
          url: "/pages/managementMeetings/sealManagement/index",
        });
        break;
      case "规章制度":
        uni.navigateTo({
          url: "/pages/managementMeetings/rulesRegulationsManagement/index",
        });
        break;

      case "协同审批":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/collaborativeApproval/index",
        });
        break;
      case "客户拜访":
        uni.navigateTo({
          url: "/pages/cooperativeOffice/clientVisit/index",
        });
        break;
      case "生产订单":
        uni.navigateTo({
          url: "/pages/productionManagement/productionOrder/index",
        });
        break;
      case "生产派工":
        uni.navigateTo({
          url: "/pages/productionManagement/productionDispatching/index",
        });
        break;
      case "工序排产":
        uni.navigateTo({
          url: "/pages/productionManagement/processScheduling/index",
        });
        break;
      case "生产核算":
        uni.navigateTo({
          url: "/pages/productionManagement/productionAccounting/index",
        });
        break;
      case "设备台账":
        uni.navigateTo({
          url: "/pages/equipmentManagement/ledger/index",
        });
        break;
      case "设备报修":
        uni.navigateTo({
          url: "/pages/equipmentManagement/repair/index",
        });
        break;
      case "设备保养":
        uni.navigateTo({
          url: "/pages/equipmentManagement/upkeep/index",
        });
        break;
      case "设备巡检":
        uni.navigateTo({
          url: "/pages/inspectionUpload/index",
        });
        break;
      case "分析追溯":
        uni.navigateTo({
          url: "/pages/equipmentManagement/faultAnalysis/index",
        });
        break;
      case "智能派单":
        uni.navigateTo({
          url: "/pages/equipmentManagement/smartDispatch/index",
        });
        break;
      case "作业指导":
        uni.navigateTo({
          url: "/pages/equipmentManagement/sop/index",
        });
        break;
      case "结果验证":
        uni.navigateTo({
          url: "/pages/equipmentManagement/verification/index",
        });
        break;
      default:
        uni.showToast({
          title: `点击了${item.label}`,
          icon: "none",
        });
    const url = routeMapping[item.label];
    if (url) {
      uni.navigateTo({ url });
    } else {
      uni.showToast({
        title: `点击了${item.label}`,
        icon: "none",
      });
    }
  };
  // 返回上一页
@@ -371,27 +131,14 @@
    // 设置用户信息
    userStore.getInfo();
  });
  const operationType = ref("");
  onLoad(options => {
    if (options.label) {
      // 处理 URL 参数可能包含其他查询参数的情况（如：协同审批?approveType=6）
      // 只提取 label 参数的值，去除可能附加的查询参数
      let labelValue = options.label;
      // 如果 label 包含 ? 符号，只取 ? 之前的部分
      if (labelValue.includes("?")) {
        labelValue = labelValue.split("?")[0];
      }
      operationType.value = labelValue;
      if (operationType.value === "考勤管理") {
        commonItems.value = kaoqin;
      } else if (operationType.value === "会议管理") {
        commonItems.value = huiyi;
      } else if (operationType.value === "财务管理") {
        commonItems.value = caiwu;
      } else if (operationType.value === "协同审批") {
        commonItems.value = kaoqinCaiwu;
        operationType.value = "协同审批";
      }
      commonItems.value = menuConfig[labelValue] || [];
    }
    console.log(operationType.value);
    console.log(commonItems.value);
@@ -487,7 +234,7 @@
  .bg-img {
    width: 100%;
    height: 8.75rem;
    background-image: url("../static/images/banner/backview.png");
    background-image: url("../static/images/banner/backview.svg");
    background-size: cover;
    border-radius: 0.75rem;
    position: relative;
@@ -810,68 +557,27 @@
  }

  .icon-container {
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 0.75rem;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.375rem;
    box-shadow: 0 0.1875rem 0.75rem rgba(0, 0, 0, 0.12);
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
    animation: fadeInScale 0.5s ease both;
  }

    &::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: linear-gradient(
        135deg,
        rgba(255, 255, 255, 0.1) 0%,
        transparent 50%,
        rgba(255, 255, 255, 0.05) 100%
      );
      opacity: 0;
      transition: opacity 0.3s ease;
    }
  .item-icon {
    width: 36px;
    height: 36px;
    display: block;
  }

    &::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      border-radius: 0.75rem;
      background: linear-gradient(
        45deg,
        transparent,
        rgba(255, 255, 255, 0.2),
        transparent
      );
      opacity: 0;
      transition: opacity 0.3s ease;
    }

    &:hover {
      transform: translateY(-0.1875rem) scale(1.02);
      box-shadow: 0 0.5rem 1.5625rem rgba(0, 0, 0, 0.18);

      &::before,
      &::after {
        opacity: 1;
      }
    }

    &:active {
      transform: scale(0.97);
      box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.18);
    }
  .icon-container:active {
    transform: scale(0.94);
  }

  .item-label {
@@ -1080,32 +786,36 @@
  }

  .icon-container {
    width: 3.25rem;
    height: 3.25rem;
    border-radius: 0.75rem;
    width: 36px;
    height: 36px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 0.375rem;
    box-shadow: 0 0.1875rem 0.75rem rgba(0, 0, 0, 0.12);
    transition: all 0.2s ease;
    position: relative;
    overflow: hidden;
    animation: fadeInScale 0.5s ease both;
  }

    &:hover {
      transform: translateY(-0.1875rem) scale(1.02);
      box-shadow: 0 0.5rem 1.5625rem rgba(0, 0, 0, 0.18);
    }
  .item-icon {
    width: 36px;
    height: 36px;
    display: block;
  }

    &:active {
      transform: scale(0.97);
      box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.18);
    }
  .icon-container:active {
    transform: scale(0.97);
  }

  .item-label {
    font-size: 0.8125rem;
    font-size: 12px;
    color: #555555;
    text-align: center;
    display: block;
    line-height: 1.4;
    font-weight: 500;
    margin-top: 0.25rem;
    margin-bottom: 0.625rem;
  }