feat:添加全局过期提醒

22caeeae · maolipeng · c01f938d · 22caeeae · 22caeeae · 22caeeae
Commit 22caeeae authored Jun 18, 2021 by maolipeng
8 changed files
--- a/src/common/js/axios.ts
+++ b/src/common/js/axios.ts
@@ -7,11 +7,12 @@
 * @Copyright: 杭州杰竞科技有限公司 版权所有
 */
 import axios, { AxiosInstance, AxiosRequestConfig, AxiosResponse, AxiosPromise, AxiosError } from 'axios';
-import { message } from 'antd';
+import { message, Modal } from 'antd';
 import { BASIC_HOST, TIME_OUT, USER_TYPE, VERSION, PROJECT } from '@/domains/basic-domain/constants';
 import User from './user';
+import { content } from 'html2canvas/dist/types/css/property-descriptors/content';
 interface FetchParams {
  url: string,
@@ -88,8 +89,15 @@ class Axios {
      })
      instance.interceptors.response.use((response: AxiosResponse): AxiosResponse | AxiosPromise => {
-        const { message: ResMessage, success, resultMsg, resultCode } = response.data;
+        const { message: ResMessage, success, resultMsg, code: resultCode } = response.data;
-        if (success || resultCode === 0) {
+        //服务到期code
+        if (resultCode === "10001") {
+          Modal.warning({
+            title:"服务已到期",
+            content: "当前企业购买的小麦企学院服务已到期，如需继续使用学院功能，请尽快续费购买",
+            okText: "我知道了"
+          })
+        } else if (success || resultCode === 0) {
          return response;
        } else if (!options.reject) {
          message.error(ResMessage || resultMsg);

--- a/src/data-source/base/request-apis.ts
+++ b/src/data-source/base/request-apis.ts
@@ -7,6 +7,7 @@
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import Service from "@/common/js/service";
+import User from "@/common/js/user";
 export function sendLoginAuthCode(params: object) {
  return Service.Hades("anon/hades/sendLoginAuthCode", params);
@@ -47,6 +48,9 @@ export function getEnterpriseUser(params: object) {
 export function getWXWorkLoginNoCheck(params: object) {
  return Service.Hades('anon/hades/getWXWorkLoginNoCheck', params);
 }
+export function getLesseeVersionMsg() {
+  return Service.Hades("public/hades/getLesseeVersionMsg",{enterpriseId:User.getEnterpriseId()})
+}
 export const getOssClient = (
  data: object,
  instId: string,

--- a/src/data-source/store/request-apis.ts
+++ b/src/data-source/store/request-apis.ts
@@ -7,6 +7,7 @@
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
 import Service from "@/common/js/service";
+import User from "@/common/js/user"
 export function getEmployeeList(params: object) {
  return Service.Hades("public/hades/getStoreUserPage", params);
@@ -76,3 +77,4 @@ export function getStoreDetail(params: object) {
 }
--- a/src/domains/basic-domain/baseService.ts
+++ b/src/domains/basic-domain/baseService.ts
@@ -7,7 +7,7 @@
 * @@Copyrigh: © 2020 杭州杰竞科技有限公司 版权所有
 */
-import { getUserStore, getUserPermission ,logout,getStoreUser,sendBizAuthCode,editUserPhone,checkBizAuthCode,sendNewPhoneAuthCode,sendLoginAuthCode,login,getLastedVersion, getEnterpriseUser,getWXWorkLoginNoCheck} from '@/data-source/base/request-apis';
+import { getUserStore, getUserPermission ,logout,getStoreUser,sendBizAuthCode,editUserPhone,checkBizAuthCode,sendNewPhoneAuthCode,sendLoginAuthCode,login,getLastedVersion, getEnterpriseUser,getWXWorkLoginNoCheck,getLesseeVersionMsg} from '@/data-source/base/request-apis';
 export default class StoreService {
    // 获取员工列表 
@@ -55,5 +55,8 @@ export default class StoreService {
  static getWXWorkLoginNoCheck(params: any){
    return getWXWorkLoginNoCheck(params);
  }
+  //获取企业配置的版本信息
+  static getLesseeVersionMsg() {
+    return getLesseeVersionMsg();
+  }
 }
\ No newline at end of file
--- a/src/modules/college-manage/UserManagePage.less
+++ b/src/modules/college-manage/UserManagePage.less
@@ -22,5 +22,70 @@
    background: #E9EFFF;
    border-radius: 2px;
    margin-bottom: 13px;
+    .always {
+      display: inline-block;
+      font-size: 14px;
+      line-height: 32px;
+      font-weight: 400;
+      color: #666666;
+      margin-left: 16px;
+      .renew-text {
+        display: inline-block;
+        color: #2966FF;
+        cursor: pointer;
+        .renew-popover {
+          display: none;
+          position: absolute;
+          z-index: 1000;
+          width: 276px;
+          height: 294px;
+          transform: translate(-98px,13px);
+          box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.06);
+          background-color: white;
+          background-image: url(https://image.xiaomaiketang.com/xm/CZ4a752jzi.png);
+          background-repeat: no-repeat;
+          background-size: cover;
+          text-align: center;
+          font-size: 14px;
+          font-weight: 400;
+          color: #333333;
+          line-height: 22px;
+          box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.06);
+          .popover-arrow {
+            position: absolute;
+            display: block;
+            width: 8.48528137px;
+            height: 8.48528137px;
+            background: 0 0;
+            border-style: solid;
+            border-width: 4.24264069px;
+            left: 50%;
+            transform: translateX(-50%) rotate(45deg);
+            top: -4px;
+            border-top-color: #fff;
+            border-right-color: transparent;
+            border-bottom-color: transparent;
+            border-left-color: #fff;
+            box-shadow: -2px -2px 5px #0000000f;
+          }
+          .qrcode {
+            width: 182px;
+            height: 204px;
+            background-color: white;
+            margin: 28px auto 16px auto;
+            img {
+              width: 150px;
+              height: 150px;
+              margin: 16px 16px 8px 16px;
+            }
+          }
+        }
+        &:hover .renew-popover {
+          display: block;
+        }
+      }
+    }
  }
 }
\ No newline at end of file
--- a/src/modules/college-manage/UserManagePage.tsx
+++ b/src/modules/college-manage/UserManagePage.tsx
@@ -11,7 +11,7 @@ import React, { useEffect, useState } from "react";
 import { withRouter } from "react-router-dom";
 import _ from "underscore";
 import { PageControl } from "@/components";
-import { Table, Input, DatePicker, Select, Button, message } from "antd";
+import { Table, Input, DatePicker, Select, Button, message, Tooltip } from "antd";
 import StoreService from "@/domains/store-domain/storeService";
 import User from "@/common/js/user";
 import ChooseMembersModal from "./modal/ChooseMembersModal";
@@ -24,10 +24,35 @@ const { RangePicker } = DatePicker;
 declare var window: any;
-function LimitTip() {
+function LimitTip(props:{total:number,uplimit?:number}) {
+  const [isOver, setIsOver] = useState(true)
  return (
    <div className="limit-tip">
+      <div className="always">本学院学员共<span style={{color:"#333333",fontWeight:"bold"}}>{props.total}</span>人
+      <Tooltip overlayStyle={{maxWidth:"587px",width:"587px"}} placement="topLeft" arrowPointAtCenter title={()=>{ return (<div><div>1、数据为当前学院的员工数，若学员存在多个学院，企业人数只统计为1人；</div><div>2、若一个学员既用「企业微信」登录学习又用「微信」登录学习，企业人数将统计为2人。</div></div>)}}>
+        <span className="icon iconfont" style={{cursor:"pointer",marginLeft:"4px",color:"#bfbfbf"}}>&#59449;</span>
+      </Tooltip>
+      {
+        isOver ? (
+          <>
+          <div style={{marginLeft:"14px",display:"inline-block"}}>当前企业使用人数已达到上限 (<span style={{color:"#333333",fontWeight:"bold"}}>{props.uplimit}</span>人)，将无法添加新员工、新学员，如需增加人数限制，请联系小麦企学院服务平台。</div>
+          <div className="renew-text">立即续费<span className="icon iconfont" style={{fontSize:"10px"}}>&#59291;</span>
+          <div className="renew-popover">
+          <div className="popover-arrow"><span className="popover-arrow-content"></span></div>
+              <div className="qrcode">
+                <img src="https://cdn.xiaomai5.com/qixueyuankehu.png" alt=""></img>
+                <div className="des">微信/企业微信扫码续费</div>
+              </div>
+              <div className="phone"><svg style={{position:"relative",top:"2px",marginRight:"4px"}} viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M512.651 3.78c-281.433 0-509.21 228.324-509.21 509.209 0 281.43 228.325 509.203 509.21 509.203 281.427 0 509.202-228.317 509.202-509.203 0.55-280.885-227.775-509.21-509.202-509.21z m198.205 743.553c-36.14 36.136-169.737 1.641-302.24-130.312-131.953-131.959-165.902-266.104-129.768-301.695 31.211-31.21 68.99-85.417 125.939-14.782 56.943 70.629 29.016 90.34-3.291 122.647-22.449 22.448 24.642 79.392 73.37 128.125 49.283 48.73 105.678 95.818 128.126 73.368 32.306-32.305 52.017-60.23 122.646-3.288 71.182 56.949 16.426 95.276-14.782 125.937z" p-id="4409" fill="#999999"></path></svg>
+              咨询电话：19157875632</div>
+            </div>
+          </div>
+          </>
+        ) : ("")
+      }
+      </div>
    </div>
  )
 }
@@ -205,7 +230,7 @@ function UserManagePage() {
            }}
          >添加学员</Button>
        }
-        <LimitTip />
+        <LimitTip total={total}/>
        <div className="box-body">
          <Table
            size={"middle"}

--- a/src/modules/home/Home.jsx
+++ b/src/modules/home/Home.jsx
@@ -270,7 +270,7 @@ class Home extends React.Component {
            <span className="icon iconfont" style={{color:"#FF4F4F",marginRight:"8px"}}>&#xe61d;</span>温馨提示：企业使用人数已达上限，将无法新增员工、学员，如需增加人数限制，请联系小麦企学院服务平台。
            <div className="renew-btn">立即续费
            <div className="renew-popover">
-            <div class="popover-arrow"><span class="-popover-arrow-content"></span></div>
+            <div className="popover-arrow"><span class="popover-arrow-content"></span></div>
              <div className="qrcode">
                <img src="https://cdn.xiaomai5.com/qixueyuankehu.png" alt=""></img>
                <div className="des">微信/企业微信扫码续费</div>

--- a/src/modules/root/CollegeManagePage.jsx
+++ b/src/modules/root/CollegeManagePage.jsx
@@ -51,6 +51,7 @@ export default class CollegeManagePage extends React.Component {
  componentDidMount() {
    this.getStoreList();
    this.getEnterpriseUser();
+    this.getVersion()
  }
  getEnterpriseUser() {
@@ -64,6 +65,13 @@ export default class CollegeManagePage extends React.Component {
      this.setState({ name, avatar, isAdmin })
    });
  }
+  getVersion() {
+    BaseService.getLesseeVersionMsg()
+    .then(res=> {
+      console.log(res)
+    })
+  }
  getStoreList() {
    const { enterpriseId } = this.state;