最新代码

kyy

2 天以前 ab826d12b52265bc4f25044d43a042df2104f972

 pages/BasePages/main.vue

@@ -2,27 +2,24 @@
  <uni-base-page :footer="false">
    <view slot="page">
      <view v-if="loginInfo.hasLogin">
        <!-- 教学视频、公司内部宣传图片等 -->
<!--        <swiper indicator-dots="true" :autoplay="true" :interval="3000">-->
<!--          <swiper-item v-for="(img,key) in imgUrls" :key="key">-->
<!--            <image :src="img"/>-->
<!--          </swiper-item>-->
<!--        </swiper>-->
        <!-- 通报批评、消息预警、公告、报告 -->
        <uni-notice-bar :show-icon="true" :scrollable="true" :speed="30" :single="true"
                        :text="msg"/>
                        :text="msg" class="notice-bar"></uni-notice-bar>
        <!-- 用户系统菜单模块 -->
        <view class="example-body">
          <uni-grid :column="col" :showBorder="false">
          <view class="menu-header">
            <text class="menu-title">系统功能</text>
            <view class="decorative-line"></view>
          </view>
          <uni-grid :column="col" :showBorder="false" class="menu-grid">
            <uni-grid-item v-for="(item, index) in userMenu" :index="index" :key="index" class="grid-item">
              <navigator navigateTo class="grid-item-box" hover-class="none"
                         :url="`../${item.path}`">
                <image v-if="item.icoimg" class="imgMenu" :src="`${item.icoimg}`"></image>
                <image v-else class="imgMenu" src="/static/img/imgMenu/WARBAAHtml.png"></image>
           <!--       <uni-notice-bar v-if="item.pagE_VIEW.length>6" :speed="30"
                                style="padding:0;margin-bottom:0;font-weight: 900;" textSize="13px"
                                background-color="#ffffff" color="#000000" :scrollable="item.pagE_VIEW.length>6"
                                :single="true" :text="item.pagE_VIEW"/>-->
                <view class="icon-container">
                  <image v-if="item.icoimg" class="imgMenu" :src="`${item.icoimg}`"></image>
                  <image v-else class="imgMenu default-icon" src="/static/img/imgMenu/WARBAAHtml.png"></image>
                  <view class="icon-badge" v-if="item.badge">{{ item.badge }}</view>
                </view>
                <text class="text" style="text-align: center;padding:5px 0px 5px 0px">{{ item.pagE_VIEW }}</text>
              </navigator>
            </uni-grid-item>
@@ -30,12 +27,17 @@
        </view>
      </view>
      <view v-if="!loginInfo.hasLogin">
        <view class="title">
          您好 游客。
        </view>
        <view class="ul">
          <view>这是 XXMES 首页。</view>
          <view>在 “我的” 中点击 “登录” 可以 “登录您的账户”</view>
        <view class="guest-container">
          <view class="title">
            您好，游客。
          </view>
          <view class="ul">
            <view>这是 广深MES 首页。</view>
            <view>在 “我的” 中点击 “登录” 可以 “登录您的账户”</view>
          </view>
          <view class="login-prompt">
            <text class="login-note">登录后可访问全部功能</text>
          </view>
        </view>
      </view>
    </view>
@@ -47,7 +49,22 @@
  data() {
    return {
      loginInfo: this.$loginInfo,
      color: this.$defaultColor,
      // 优化后的主题颜色方案，增加层次感
      primaryColor: '#1677FF',
      primaryLight: '#E6F7FF',
      secondaryColor: '#36CFC9',
      successColor: '#52C41A',
      warningColor: '#FAAD14',
      errorColor: '#F5222D',
      // 中性色优化
      neutral1: '#FFFFFF',
      neutral2: '#F7F8FA',
      neutral3: '#E5E6EB',
      neutral4: '#C9CDD4',
      neutral5: '#86909C',
      neutral6: '#4E5969',
      neutral7: '#1F2329',
      
      userMenu: [],
      imgUrls: [
        "../../static/img/SN-GG.png",
@@ -100,8 +117,63 @@
          });
        }
      })
    },
    checkForUpdate() {
      this.$post({
        url: "/Login/getAppUpgradeInfo",
        data: {}
      }).then(res => {
        
        let newVersion = res.data.version;
        let currentVersion = uni.getSystemInfoSync(); // 获取当前 APK 版本号
         
        if (newVersion > currentVersion.appVersion) {
          uni.showModal({
            title: "发现新版本",
            content: "是否下载最新版本?",
            success: (modalRes) => {
              if (modalRes.confirm) {
                this.downloadNewApk(res.data.apkUrl);
              }
            }
          });
          this.updateChecked = true; // 标记更新已检查过
        }
      })
    },

    downloadNewApk(apkUrl) {
      uni.showToast({
        title: "开始下载更新...",
        icon: "none",
        duration: 2000
      });

      uni.downloadFile({
        url: apkUrl,
        success: (res) => {
          if (res.statusCode === 200) {
            plus.runtime.install(res.tempFilePath, {
              force: true
            }, function() {
              console.log("安装成功，重启应用");
            }, function(e) {
              console.error("安装失败:", e);
            });
          }
        },
        fail: (err) => {
          console.error("下载失败:", err);
          uni.showToast({
            title: "下载失败，请检查网络",
            icon: "none",
            duration: 2000
          });
        }
      });
    }
  },

  onLoad() {
    if (!this.loginInfo.hasLogin) {
      uni.showModal({
@@ -130,9 +202,8 @@
      });
    } else {
      this.getMenu(true);
      this.checkForUpdate();
    }


  },
  onShow() {
    this.getIsMsg();
@@ -140,60 +211,217 @@
  onPullDownRefresh() {
    if (this.loginInfo.hasLogin)
      this.getMenu(true);
  },
  }
}
</script>

<style>
/* 全局样式重置 */
page {
  background-color: #F7F8FA;
  color: #1F2329;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu;
  display: flex;
  flex-direction: column;
  height: 100vh;
}

/* 优化后的文本样式 */
.text {
  /* color: #ffffff; */
  /* font-size: 15px; */
  font-weight: 900;
  font-weight: 500;
  color: #4E5969;
  font-size: 24rpx;
  margin-top: 10rpx;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.example-body {
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  padding: 0;
  font-size: 14px;
  /* background-color: #ffffff; */
  padding: 30rpx;
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* 菜单头部样式 */
.menu-header {
  margin-bottom: 30rpx;
  position: relative;
}

.menu-title {
  font-size: 36rpx;
  font-weight: 600;
  color: #1F2329;
  display: inline-block;
  position: relative;
  padding-bottom: 10rpx;
}

.decorative-line {
  height: 4rpx;
  width: 120rpx;
  background: linear-gradient(to right, #1677FF, #36CFC9);
  border-radius: 2rpx;
  margin-top: 10rpx;
}

/* 网格菜单优化 */
.menu-grid {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.grid-item {
   display: flex;
     flex-wrap: wrap;
   height: 100% !important;
    display: flex;
    flex-direction: column;
    align-items: stretch; /* 保证垂直拉伸以适应内容 */
   }
  display: flex;
  flex-wrap: wrap;
  height: 100% !important;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  margin-bottom: 20rpx;
}

.grid-item-box {
  flex: 1;
  /* position: relative;*/
  /* #ifndef APP-NVUE */
  display: flex;
  /* #endif */
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 5px;
  padding: 20rpx;
  background-color: #FFFFFF;
  border-radius: 20rpx;
  box-shadow: 0 6rpx 20rpx rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.grid-item-box::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4rpx;
  background: linear-gradient(to right, #1677FF, #36CFC9);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.grid-item-box:hover {
  transform: translateY(-8rpx);
  box-shadow: 0 12rpx 30rpx rgba(22, 119, 255, 0.15);
}

.grid-item-box:hover::before {
  opacity: 1;
}

/* 图标容器优化 */
.icon-container {
  width: 140rpx;
  height: 140rpx;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 15rpx;
  position: relative;
}

.imgMenu {
  width: 100rpx;
  height: 100rpx;
  border-radius: 50%;
  background-color: #F7F8FA;
  padding: 16rpx;
  box-sizing: border-box;
  transition: transform 0.3s ease;
}

image,
swiper,
.img-view {
.imgMenu.default-icon {
  background-color: #E6F7FF;
  color: #1677FF;
}

.grid-item-box:hover .imgMenu {
  transform: scale(1.1);
}

.icon-badge {
  position: absolute;
  top: -10rpx;
  right: -10rpx;
  width: 30rpx;
  height: 30rpx;
  background-color: #F5222D;
  color: #FFFFFF;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18rpx;
  box-shadow: 0 2rpx 8rpx rgba(245, 34, 45, 0.3);
}

/* 通知栏样式优化 */
.notice-bar {
  background: linear-gradient(90deg, #1677FF, #36CFC9);
  color: #FFFFFF;
  font-weight: 500;
  padding: 20rpx 30rpx;
  border-radius: 10rpx;
  margin-bottom: 20rpx;
  box-shadow: 0 4rpx 12rpx rgba(22, 119, 255, 0.2);
}

/* 未登录状态样式优化 */
.guest-container {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0 40rpx;
}

.title {
  font-size: 36rpx;
  font-weight: 600;
  color: #1F2329;
  margin: 40rpx 0 30rpx;
  text-align: center;
}

.ul {
  background-color: #FFFFFF;
  border-radius: 20rpx;
  padding: 30rpx;
  box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.08);
  width: 100%;
  height: 350rpx;
  margin-bottom: 10rpx;
  max-width: 600rpx;
}

.example-body {
  flex-direction: row;
  justify-content: flex-start;
.ul view {
  font-size: 28rpx;
  color: #4E5969;
  line-height: 1.8;
  margin-bottom: 20rpx;
}

.login-prompt {
  margin-top: 40rpx;
  padding: 15rpx 30rpx;
  background-color: #E6F7FF;
  border-radius: 30rpx;
  font-size: 24rpx;
  color: #1677FF;
}

.login-note {
  font-weight: 500;
}
</style>