添加组件及页面

2026-01-21 17:05:30 +08:00
parent a89e69c381
commit 7ff1a911dd
54 changed files with 1078 additions and 1009 deletions
--- a/miniprogram/pages/index/index.ts
+++ b/miniprogram/pages/index/index.ts
@@ -1,8 +1,6 @@
-// pages/index/index.ts
-
-import { menuConfig } from "@/utils/menuConfig";
-import { Subscribe } from "@/utils/subscribe";
-import { getDataSet, toObject } from "@/utils/util";
+import { loginStatus, post } from '@/utils/https';
+import { menuConfig } from '@/utils/menuConfig';
+import { getDataSet, toArray, toObject } from '@/utils/util';

 // const app = getApp();
 // const Storage = app.Storage;
@@ -11,94 +9,50 @@ Page({
   * 页面的初始数据
   */
  data: {
+    isLogin: false,
+    loading: true,
    BGColors: [
-      "linear-gradient( 135deg, #FDEB71 10%, #F8D800 100%)",
-      "linear-gradient( 135deg, #ABDCFF 10%, #0396FF 100%)",
-      "linear-gradient( 135deg, #FEB692 10%, #EA5455 100%)",
-      "linear-gradient( 135deg, #CE9FFC 10%, #7367F0 100%)",
-      "linear-gradient( 135deg, #90F7EC 10%, #32CCBC 100%)",
-      "linear-gradient( 135deg, #FFF6B7 10%, #F6416C 100%)",
-      "linear-gradient( 135deg, #81FBB8 10%, #28C76F 100%)",
-      "linear-gradient( 135deg, #E2B0FF 10%, #9F44D3 100%)",
-      "linear-gradient( 135deg, #F97794 10%, #623AA2 100%)",
-      "linear-gradient( 135deg, #FCCF31 10%, #F55555 100%)",
-      "linear-gradient( 135deg, #F761A1 10%, #8C1BAB 100%)",
-      "linear-gradient( 135deg, #43CBFF 10%, #9708CC 100%)",
-      "linear-gradient( 135deg, #5EFCE8 10%, #736EFE 100%)",
-      "linear-gradient( 135deg, #FAD7A1 10%, #E96D71 100%)",
-      "linear-gradient( 135deg, #FFD26F 10%, #3677FF 100%)",
-      "linear-gradient( 135deg, #A0FE65 10%, #FA016D 100%)",
-      "linear-gradient( 135deg, #FFDB01 10%, #0E197D 100%)",
-      "linear-gradient( 135deg, #FEC163 10%, #DE4313 100%)",
-      "linear-gradient( 135deg, #92FFC0 10%, #002661 100%)",
-      "linear-gradient( 135deg, #EEAD92 10%, #6018DC 100%)",
-      "linear-gradient( 135deg, #F6CEEC 10%, #D939CD 100%)",
-      "linear-gradient( 135deg, #52E5E7 10%, #130CB7 100%)",
-      "linear-gradient( 135deg, #F1CA74 10%, #A64DB6 100%)",
-      "linear-gradient( 135deg, #E8D07A 10%, #5312D6 100%)",
-      "linear-gradient( 135deg, #EECE13 10%, #B210FF 100%)",
-      "linear-gradient( 135deg, #79F1A4 10%, #0E5CAD 100%)",
-    ],
-    params: {
-      curr_page: 1,
-      page_count: 20,
-    },
-    total: 100,
-    current1: ["checkbox1", "checkbox2"],
-    current2: "checkbox1",
-    options: [
-      { label: "多选", value: "checkbox1" },
-      { label: "多选", value: "checkbox2" },
-      {
-        label:
-          "多选标题多行多选标题多行多选标题多行多选标题多行多选标题多行多选标题多行",
-        value: "checkbox3",
-        maxLabelRow: 2,
-      },
-      {
-        label: "多选",
-        value: "checkbox4",
-        content:
-          "描述信息描述信息描述信息描述信息描述信息描述信息描述信息描述信息描述信息描述信息",
-        maxContentRow: 2,
-      },
-      { label: "多选", value: "checkbox11" },
-      { label: "多选", value: "checkbox21" },
-      {
-        label:
-          "多选标题多行多选标题多行多选标题多行多选标题多行多选标题多行多选标题多行",
-        value: "checkbox31",
-        maxLabelRow: 2,
-      },
-      {
-        label: "多选",
-        value: "checkbox41",
-        content:
-          "描述信息描述信息描述信息描述信息描述信息描述信息描述信息描述信息描述信息描述信息",
-        maxContentRow: 2,
-      },
+      'linear-gradient( 135deg, #FDEB71 10%, #F8D800 100%)',
+      'linear-gradient( 135deg, #ABDCFF 10%, #0396FF 100%)',
+      'linear-gradient( 135deg, #FEB692 10%, #EA5455 100%)',
+      'linear-gradient( 135deg, #CE9FFC 10%, #7367F0 100%)',
+      'linear-gradient( 135deg, #90F7EC 10%, #32CCBC 100%)',
+      'linear-gradient( 135deg, #FFF6B7 10%, #F6416C 100%)',
+      'linear-gradient( 135deg, #81FBB8 10%, #28C76F 100%)',
+      'linear-gradient( 135deg, #E2B0FF 10%, #9F44D3 100%)',
+      'linear-gradient( 135deg, #F97794 10%, #623AA2 100%)',
+      'linear-gradient( 135deg, #FCCF31 10%, #F55555 100%)',
+      'linear-gradient( 135deg, #F761A1 10%, #8C1BAB 100%)',
+      'linear-gradient( 135deg, #43CBFF 10%, #9708CC 100%)',
+      'linear-gradient( 135deg, #5EFCE8 10%, #736EFE 100%)',
+      'linear-gradient( 135deg, #FAD7A1 10%, #E96D71 100%)',
+      'linear-gradient( 135deg, #FFD26F 10%, #3677FF 100%)',
+      'linear-gradient( 135deg, #A0FE65 10%, #FA016D 100%)',
+      'linear-gradient( 135deg, #FFDB01 10%, #0E197D 100%)',
+      'linear-gradient( 135deg, #FEC163 10%, #DE4313 100%)',
+      'linear-gradient( 135deg, #92FFC0 10%, #002661 100%)',
+      'linear-gradient( 135deg, #EEAD92 10%, #6018DC 100%)',
+      'linear-gradient( 135deg, #F6CEEC 10%, #D939CD 100%)',
+      'linear-gradient( 135deg, #52E5E7 10%, #130CB7 100%)',
+      'linear-gradient( 135deg, #F1CA74 10%, #A64DB6 100%)',
+      'linear-gradient( 135deg, #E8D07A 10%, #5312D6 100%)',
+      'linear-gradient( 135deg, #EECE13 10%, #B210FF 100%)',
+      'linear-gradient( 135deg, #79F1A4 10%, #0E5CAD 100%)',
    ],
+    block: [] as any[],
    authInfo: {} as any,
    menuList: [] as any,
  },
+  handleLogin(e: any) {
+    this.setData({ isLogin: e.detail });
+    if (e.detail) {
+      this.init();
+    }
+  },

-  change() {
-    Subscribe.set("isLogin", "hello");
-    // wx.navigateTo({ url: "/pages/my/my" });
-  },
-  changePage(e: any) {
-    this.data.params.curr_page = e.detail.curr_page;
-    this.setData({ params: this.data.params });
-  },
-  changeSelect(e: any) {
-    console.log(e);
-  },
-  navToMy() {
-    wx.navigateTo({ url: "/pages/my/my" });
-  },
  init() {
    this.data.authInfo = {};
-    const companyInfo = toObject(wx.getStorageSync("company_info"));
+    const companyInfo = toObject(wx.getStorageSync('company_info'));
    this.data.menuList.length = 0;
    menuConfig.forEach((el) => {
      const children: any[] = [];
@@ -115,22 +69,41 @@ Page({
        });
      }
    });
-    // this.getIndex();
+    this.getIndex();
    this.setData({
      authInfo: this.data.authInfo,
      menuList: this.data.menuList,
-      hideTabKeys: companyInfo.staff_type == 3 ? ["2"] : [],
+      hideTabKeys: companyInfo.staff_type == 3 ? ['2'] : [],
+    });
+  },
+  getIndex() {
+    post('Index/index', {}).then((res: any) => {
+      const block = toArray(res?.block);
+      if (block.length % 2 != 0) {
+        block.push({ value: '', name: '敬请期待', unit: '' });
+      }
+      this.setData({ block });
    });
  },
  nav(e: any) {
-    const url = getDataSet(e).url;
-    wx.navigateTo({ url });
+    const data = getDataSet(e);
+    wx.navigateTo({ url: data.url });
  },
-
  /**
   * 生命周期函数--监听页面加载
   */
-  onLoad() {},
+  onLoad() {
+    this.setData({ loading: true });
+    loginStatus()
+      .then(() => {
+        this.setData({ isLogin: true, loading: false });
+        this.init();
+      })
+      .catch((err) => {
+        this.setData({ isLogin: false, loading: false });
+        console.log('调用登录状态请求失败', err);
+      });
+  },

  /**
   * 生命周期函数--监听页面初次渲染完成
@@ -142,7 +115,6 @@ Page({
   */
  onShow() {
    wx.hideHomeButton();
-    this.init();
  },

  /**
--- a/miniprogram/pages/index/index.wxml
+++ b/miniprogram/pages/index/index.wxml
@@ -1,38 +1,32 @@
-<page-plugin loading="{{true}}" isLogin="{{true}}" isAuth="{{true}}">
-  <text>pages/index/index.wxml</text>
-  <t-button bind:tap="change">change</t-button>
-  <t-button bind:tap="navToMy">my</t-button>
-  <pagination-plugin
-    curr_page="{{params.curr_page}}"
-    total="{{total}}"
-    page_count="{{params.page_count}}"
-    bind:change="changePage"
-  />
-  <block wx:for="{{ menuList }}" wx:key="index" wx:for-item="item">
-    <view style="display: flex;align-items: center;">
-      <t-icon name="{{ item.icon }}" style="color: {{item.iconColor}};font-size: 1.2em;margin-right: 4px;" />
-      <text style="font-weight: bold;font-size: 1.1em;">{{ item.title }}</text>
-    </view>
-    <view style="display: flex;align-items: center;flex-wrap: wrap;">
-      <block wx:for="{{ item.children }}" wx:key="index" wx:for-item="child">
-        <view class="menu-item" bindtap="nav" data-url="{{ child.url }}">
-          <image class="nav-item-icon" src="/assets/icons/{{child.title}}.svg" mode="aspectFit" />
-          <view>{{ child.title }}</view>
+<page-plugin isAuth="{{true}}" loading="{{loading}}" is-login="{{isLogin}}"
+  bind:handleLogin="handleLogin" hasTabBar="1">
+  <view class="block-box">
+    <block wx:for="{{block}}" wx:key="index">
+      <view class="block-item-box" style="background: {{BGColors[index]}};">
+        <view class="block-item-name">{{item.name}}</view>
+        <view class="block-item-value">
+          <text>{{item.value}}</text>
+          <text>{{item.unit}}</text>
        </view>
-      </block>
+      </view>
+    </block>
+  </view>
+  <block wx:for="{{ menuList }}" wx:key="index" wx:for-item="item">
+    <view class="menu-box">
+      <view class="menu-title">
+        <t-icon name="{{ item.icon }}"
+          style="color: {{item.iconColor}};font-size: 1.2em;margin-right: 8rpx;" />
+        <text style="font-weight: bold;font-size: 1.1em;">{{ item.title }}</text>
+      </view>
+      <view class="menu-children-box">
+        <block wx:for="{{ item.children }}" wx:key="index" wx:for-item="child">
+          <view class="menu-item" bindtap="nav" data-url="{{ child.url }}">
+            <image class="nav-item-icon" src="/assets/icons/{{child.title}}.svg" mode="aspectFit" />
+            <view>{{ child.title }}</view>
+          </view>
+        </block>
+      </view>
    </view>
  </block>
 </page-plugin>
-<tab-bar-plugin active="index" />
-<select-plugin
-  mode="single"
-  value="{{current2}}"
-  options="{{options}}"
-  bind:change="changeSelect"
->
-  <view style="display: block;">下拉选择</view>
-</select-plugin>
-<search-popup>
-  <view slot="content">1111</view>
-</search-popup>
-
+<tab-bar-plugin active="index" />
--- a/miniprogram/pages/index/index.wxss
+++ b/miniprogram/pages/index/index.wxss
@@ -1,14 +1,34 @@
-.container {
-  height: calc(100vh - var(--td-tab-bar-height, 80rpx) - env(safe-area-inset-bottom));
+page {
+  background: #f5f5f5;
+}
+
+.menu-box {
+  background-color: #fff;
+  border-radius: 8rpx;
+  margin-bottom: 32rpx;
+}
+
+.menu-title {
+  display: flex;
+  align-items: center;
+  padding: 16rpx 24rpx;
+  border-bottom: 1rpx solid #ddd;
+}
+
+.menu-children-box {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  padding: 16rpx;
 }

 .menu-item {
  display: inline-flex;
  flex-direction: column;
-  width: clamp(80px, 25%, 120px);
+  width: clamp(80rpx, 25%, 200rpx);
  box-sizing: border-box;
-  padding: 8px;
-  --width: calc((100vw - 16px - 24px) / 4 * 0.4);
+  padding: 16rpx;
+  --width: calc((100vw - 32rpx - 48rpx - 16rpx) / 4 * 0.4);
  justify-content: center;
  align-items: center;
 }
@@ -23,3 +43,41 @@
  display: inline-flex;
  box-sizing: border-box;
 }
+
+.block-box {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  row-gap: 24rpx;
+  column-gap: 24rpx;
+  margin-bottom: 48rpx;
+}
+
+.block-item-box {
+  border-radius: 8rpx;
+  padding: 24rpx;
+  box-sizing: border-box;
+}
+
+.block-item-name {
+  font-size: 1.125em;
+  margin-bottom: 32rpx;
+}
+
+.block-item-value {
+  display: flex;
+  font-size: 1.4em;
+  font-weight: bold;
+  align-items: flex-end;
+  line-height: 1.2;
+  justify-content: flex-end;
+}
+
+.block-item-value text:first-child {
+  line-height: 1;
+}
+
+.block-item-value text:last-child {
+  font-weight: normal;
+  font-size: 0.75em;
+  color: #333;
+}