Initial commit

pages/login/login.vue

@@ -0,0 +1,187 @@
+<template>
+  <view class="content">
+    <u-loading-page bg-color="#a7a7a7" :loading="loading"></u-loading-page>
+    <!-- <view class="bt1 door" @tap="showBtn = true"></view>
+    <view class="bt2 door" v-if="showBtn" @tap="showUser = true"></view> -->
+    <image class="logo" src="/static/logo.png"></image>
+    <view class="helloTip"> Hello! </view>
+    <view class="helloText"> 欢迎使用广交投氢能车辆运营监控 </view>
+    <view class="remarkText"> 此小程序仅限氢能车辆运营方内部人员使用 </view>
+    <view style="width: 80%; margin-top: 80rpx">
+      <!-- <u-subsection
+        mode="subsection"
+        :list="list"
+        :current="current"
+        @change="sectionChange"
+        :fontSize="30"
+        style="margin-bottom: 20rpx"
+      ></u-subsection> -->
+      <!-- <view v-if="current == 0">
+        <login-user></login-user>
+      </view>
+      -->
+    </view>
+    <view class="loginBlock">
+      <view class="helloText"> 欢 迎 登 录 </view>
+      <view>
+        <login-user></login-user>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import loginUser from "./user-login/index.vue";
+// import loginDriver from "./driver-login/index.vue";
+export default {
+  options: {
+    styleIsolation: "shared", // 解除样式隔离
+  },
+  components: {
+    loginUser,
+    // loginDriver,
+  },
+  data() {
+    return {
+      loading: false,
+      current: 0,
+      list: ["广交投员工", "司机"],
+      showUser: false,
+      showBtn: false,
+    };
+  },
+  onReady() {
+    // this.getToDo();
+    const tempIds = ["7NTdeu2Sft31k4wtCGVEjvfvvG3MDxAtUW3g17vv48E"];
+    wx.getSetting({
+      withSubscriptions: true,
+      success(res) {
+        // console.log(res.authSetting);
+        // console.log(res.subscriptionsSetting);
+        if (res.subscriptionsSetting[tempIds[0]] !== "accept") {
+          uni.showModal({
+            title: "授权提示",
+            content: "同意订阅通知消息吗?",
+            success: (res) => {
+              console.log(res);
+              if (res.confirm) {
+                uni.requestSubscribeMessage({
+                  tmplIds: tempIds, // 需要下发的订阅消息模板id数组
+                  success(res) {
+                    console.log(res);
+                    if (res[tempIds[0]] === "accept") {
+                      console.log("用户同意订阅");
+                    }
+                  },
+                });
+              }
+            },
+          });
+        }
+        // res.subscriptionsSetting = {
+        //   mainSwitch: true, // 订阅消息总开关
+        //   itemSettings: {   // 每一项开关
+        //     SYS_MSG_TYPE_INTERACTIVE: 'accept', // 小游戏系统订阅消息
+        //     SYS_MSG_TYPE_RANK: 'accept'
+        //     zun-LzcQyW-edafCVvzPkK4de2Rllr1fFpw2A_x0oXE: 'reject', // 普通一次性订阅消息
+        //     ke_OZC_66gZxALLcsuI7ilCJSP2OJ2vWo2ooUPpkWrw: 'ban',
+        //   }
+        // }
+      },
+    });
+  },
+  methods: {
+    sectionChange(index) {
+      this.current = index;
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.content {
+  display: flex;
+  flex-direction: column;
+  height: 100vh;
+  padding: 40rpx;
+  background: linear-gradient(0deg, #b6e2fb, #2890e5);
+  justify-content: center;
+  position: relative;
+  font-family: MiSans-Semibold, MiSans-Demibold, "Segoe UI", Tahoma, Geneva,
+    Verdana, sans-serif;
+}
+.helloTip {
+  font-size: 100rpx;
+  color: #fff;
+  font-weight: bold;
+  margin-top: -200rpx;
+}
+.helloText {
+  margin-top: 20rpx;
+  margin-bottom: 20rpx;
+  font-size: 46rpx;
+  color: #fff;
+  font-weight: 400;
+}
+.remarkText {
+  margin-top: 10rpx;
+  margin-bottom: 20rpx;
+  font-size: 36rpx;
+  color: #b54b45;
+  font-weight: 400;
+}
+.loginBlock {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  width: 685rpx;
+  height: 664rpx;
+  padding: 0 30rpx;
+  box-sizing: border-box;
+  //   background-image: url("../../static/login_bg.png");
+  background-size: cover;
+  background-color: #fff;
+  //   background: #ffffff;
+  border-radius: 20rpx;
+  .helloText {
+    color: #017043;
+    text-align: center;
+    font-weight: bold;
+  }
+}
+.logo {
+  position: absolute;
+  height: 76rpx;
+  /* width: 568rpx ; */
+  top: 40rpx;
+  right: 40rpx;
+  // margin-left: auto;
+  // margin-right: auto;
+  // margin-bottom: 50rpx;
+}
+// .door {
+//   width: 20px;
+//   height: 20px;
+//   background: green;
+// }
+// .bt1 {
+//   position: absolute;
+//   top: 10px;
+//   left: 10px;
+//   opacity: 0;
+// }
+// .bt2 {
+//   position: absolute;
+//   bottom: 10px;
+//   left: 10px;
+//   opacity: 0;
+// }
+.title {
+  font-size: 36rpx;
+  color: #8f8f94;
+}
+
+.login-btn {
+  margin: 30rpx 0rpx;
+}
+</style>