no message

src/components/certificateDialog.vue

@@ -0,0 +1,140 @@
+<template>
+  <u-popup mode="center" round="10" :show="isShow" :closeOnClickOverlay="false">
+    <view class="dialog">
+      <view class="close">
+        <u-icon
+          name="close"
+          color="#9E9E9E"
+          size="24"
+          @tap="closeDialog"
+        ></u-icon>
+      </view>
+      <view class="top">
+        <image
+          src="@/static/images/dialog/insurance-icon2.png"
+          mode="widthFix"
+        ></image>
+      </view>
+
+      <block v-if="type === 1">
+        <view class="title">证件过期提示</view>
+        <view class="text" v-if="day > 0"
+          >您的{{ name
+          }}{{ day }}天后即将过期，请及时上传最新证件，以免影响接单！</view
+        >
+        <view class="text" v-else
+          >您的{{ name }}已过期{{
+            Math.abs(day)
+          }}天，请及时上传最新证件，以免影响接单！</view
+        >
+      </block>
+
+      <block v-if="type === 2">
+        <view class="title">证件复审提示</view>
+        <view class="text" v-if="day > 0"
+          >您的{{ name
+          }}{{
+            day
+          }}天后即将过复审日期，请及时上传最新证件，以免影响接单！</view
+        >
+        <view class="text" v-else
+          >您的{{ name }}复审日期已过期{{
+            Math.abs(day)
+          }}天，请及时上传最新证件，以免影响接单！</view
+        >
+      </block>
+
+      <view class="btn">
+        <u-button
+          text="去上传"
+          shape="circle"
+          type="primary"
+          @click="clickButton()"
+        >
+        </u-button>
+      </view>
+    </view>
+  </u-popup>
+</template>
+
+<script>
+export default {
+  props: {
+    isShow: {
+      type: Boolean,
+      default: false,
+    },
+    type: {
+      type: Number,
+      default: 0, // 1=证件快过期提示 2=复审快过期提示
+    },
+  },
+
+  data() {
+    return {
+      name: '',
+      day: '',
+    };
+  },
+
+  onLoad() {},
+
+  methods: {
+    initData() {
+      const userInfo = this.$store.state.userInfo;
+      this.name = userInfo.certExpireName;
+      this.day = userInfo.certExpireDay;
+    },
+
+    closeDialog() {
+      this.$emit('close');
+    },
+
+    clickButton() {
+      this.$emit('handle');
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.dialog {
+  width: 640rpx;
+  background: #ffffff;
+  border-radius: 20rpx;
+  overflow: hidden;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 0 70rpx 70rpx;
+  box-sizing: border-box;
+  .close {
+    position: absolute;
+    right: 40rpx;
+    top: 40rpx;
+  }
+  .top {
+    margin-top: 30rpx;
+    image {
+      width: 390rpx;
+      height: 220rpx;
+    }
+  }
+  .title {
+    font-size: 44rpx;
+    font-weight: 500;
+  }
+  .text {
+    text-align: center;
+    font-size: 32rpx;
+    color: $sec-font;
+    line-height: 48rpx;
+    margin-top: 30rpx;
+  }
+  .btn {
+    width: 100%;
+    margin-top: 60rpx;
+  }
+}
+</style>

src/components/insuranceDialog.vue

@@ -0,0 +1,122 @@
+<template>
+  <u-popup mode="center" round="10" :show="isShow" :closeOnClickOverlay="false">
+    <view class="dialog">
+      <view class="close" v-if="type === 3">
+        <u-icon
+          name="close"
+          color="#9E9E9E"
+          size="24"
+          @tap="closeDialog"
+        ></u-icon>
+      </view>
+      <view class="top">
+        <image
+          src="@/static/images/dialog/insurance-icon1.png"
+          mode="widthFix"
+          v-if="type === 3"
+        ></image>
+        <image
+          src="@/static/images/dialog/insurance-icon2.png"
+          mode="widthFix"
+          v-if="type === 2"
+        ></image>
+      </view>
+      <view class="title">保险购买提示</view>
+      <view class="text" v-if="type === 3"
+        >距离保险期还有{{ day }}天，请及时续保，以免影响接单!</view
+      >
+      <view class="text" v-if="type === 2"
+        >保险已过期，为了您的安全保障，请及时续保，以免影响接单!</view
+      >
+      <view class="btn">
+        <u-button
+          text="去续保"
+          shape="circle"
+          type="primary"
+          @click="clickButton()"
+        >
+        </u-button>
+      </view>
+    </view>
+  </u-popup>
+</template>
+
+<script>
+export default {
+  props: {
+    isShow: {
+      type: Boolean,
+      default: false,
+    },
+    type: {
+      type: Number,
+      default: 0, // 2=保险过期提示 3=保险快到期提示
+    },
+  },
+
+  data() {
+    return {
+      day: 0,
+    };
+  },
+
+  onLoad() {},
+
+  methods: {
+    initData() {
+      const userInfo = this.$store.state.userInfo;
+      this.day = userInfo.limitInsureDay;
+    },
+
+    closeDialog() {
+      this.$emit('close');
+    },
+
+    clickButton() {
+      this.$emit('handle');
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.dialog {
+  width: 640rpx;
+  background: #ffffff;
+  border-radius: 20rpx;
+  overflow: hidden;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 0 70rpx 70rpx;
+  box-sizing: border-box;
+  .close {
+    position: absolute;
+    right: 40rpx;
+    top: 40rpx;
+  }
+  .top {
+    margin-top: 30rpx;
+    image {
+      width: 390rpx;
+      height: 220rpx;
+    }
+  }
+  .title {
+    font-size: 44rpx;
+    font-weight: 500;
+  }
+  .text {
+    text-align: center;
+    font-size: 32rpx;
+    color: $sec-font;
+    line-height: 48rpx;
+    margin-top: 30rpx;
+  }
+  .btn {
+    width: 100%;
+    margin-top: 60rpx;
+  }
+}
+</style>

src/components/protocolDialog.vue

@@ -0,0 +1,147 @@
+<template>
+  <u-popup mode="center" round="10" :show="isShow" :closeOnClickOverlay="false">
+    <view class="dialog">
+      <view class="close">
+        <u-icon
+          name="close-circle"
+          color="#ffffff"
+          size="40"
+          @tap="closeDialog"
+        ></u-icon>
+      </view>
+      <view class="top">
+        <image
+          src="@/static/images/dialog/protocol-bg.png"
+          class="bg"
+          mode="widthFix"
+        ></image>
+        <view class="title">电子协议签约提示</view>
+      </view>
+      <view class="box">
+        <view class="icon">
+          <image
+            src="@/static/images/dialog/protocol-icon1.png"
+            mode="widthFix"
+          ></image>
+        </view>
+        <view class="text"
+          >您的电子协议已过期，逾期不签约将影响登录使用，是否现在去签约？</view
+        >
+        <view class="link">请先阅读《服务人员承揽协议》</view>
+      </view>
+      <view class="btn">
+        <u-button
+          text="去签约"
+          shape="circle"
+          color="linear-gradient(172deg, #7FDAFF 0%, #6DA7FF 100%);"
+          @click="clickButton()"
+        >
+        </u-button>
+      </view>
+    </view>
+  </u-popup>
+</template>
+
+<script>
+export default {
+  props: {
+    isShow: {
+      type: Boolean,
+      default: false,
+    },
+  },
+
+  data() {
+    return {};
+  },
+
+  onLoad() {},
+
+  methods: {
+    closeDialog() {
+      this.$emit('close');
+    },
+
+    clickButton() {
+      this.$emit('handle');
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.dialog {
+  width: 640rpx;
+  background: #ffffff;
+  border-radius: 20rpx;
+  position: relative;
+  .close {
+    position: absolute;
+    right: 0;
+    top: -100rpx;
+    width: 640rpx;
+    display: flex;
+    justify-content: flex-end;
+    padding-bottom: 20rpx;
+  }
+  .top {
+    position: relative;
+    height: 312rpx;
+    .bg {
+      width: 640rpx;
+      height: 312rpx;
+    }
+    .title {
+      position: absolute;
+      top: 50rpx;
+      left: 0;
+      width: 640rpx;
+      text-align: center;
+      font-size: 44rpx;
+      color: #ffffff;
+    }
+  }
+  .box {
+    width: 560rpx;
+    background: #ffffff;
+    border-radius: 20rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    margin-top: -140rpx;
+    position: relative;
+    margin-left: 40rpx;
+    padding: 0 20rpx;
+    box-sizing: border-box;
+    .icon {
+      width: 184rpx;
+      height: 184rpx;
+      border-radius: 50%;
+      box-shadow: 0px 8px 32px 2px rgba(58, 171, 250, 0.3);
+      margin-top: -40rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: #ffffff;
+      image {
+        width: 126rpx;
+        margin-left: -10rpx;
+      }
+    }
+    .text {
+      font-size: 32rpx;
+      line-height: 48rpx;
+      text-align: center;
+      margin-top: 30rpx;
+    }
+    .link {
+      color: $theme-color;
+      text-align: center;
+      margin-top: 30rpx;
+    }
+  }
+  .btn {
+    padding: 40rpx;
+  }
+}
+</style>