111

.gitignore

@@ -0,0 +1,12 @@
+# Dependency directories
+node_modules
+*.log*
+*.lock
+.eslintrc.js
+package-lock.json
+.history
+dist/
+h5/
+dist.zip
+wxAppPatient.zip
+miniprogram_npm

README.md

@@ -0,0 +1 @@
+人工肝病例登记系统-小程序

api/api.js

@@ -0,0 +1,118 @@
+import {request} from '../utils/request.js'
+function addCase(data){ //添加病例
+  return request('/medicalRecord/add','POST',data,true)
+};
+function caseDetail(id){ //病例详情
+    return request('/medicalRecord/getDetail/'+id,'GET',{},true)
+};
+function caseList(data){ //病例列表
+  return request('/medicalRecord/getList','POST',data,true)
+};
+function editCase(data){ //修改病例
+  return request('/medicalRecord/update','POST',data,true)
+};
+function getCaptcha(){ //获取图片验证码
+    return request('/user/getCaptcha','GET')
+};
+
+
+function getDeal(data){ //获取协议
+    return request('/user/getDeal','GET',data)
+};
+function getInfo(data){ //个人中心
+    return request('/user/getInfo','GET',data)
+};
+function getRubric(data){ //操作说明
+    return request('/user/getRubric','GET',data)
+};
+function sendSms(data){ //发送验证码
+    return request('/user/sendSms','POST',data,true)
+};
+function smsLogin(data){ //短信登录
+    return request('/user/smsLogin','POST',data,true)
+};
+function smsRegister(data){ //短信注册
+    return request('/user/smsRegister','POST',data,true)
+};
+function addBank(data){ //添加医生签名
+    return request('/user/addBank','POST',data)
+};
+function getSign(data){ //获取医生签名
+    return request('/user/getSign','GET',data)
+};
+function getOssSign(type){ //获取上传文件 Policy
+    return request('/file/getOSSPolicy/'+type,'GET')
+};
+function getArea(data){//获取省市区
+    return request('/user/areaList','GET',data)
+}
+function getHospital(id){//医院列表
+    return request('/user/hospitalList/'+id,'GET')
+}
+function getOfficeList(data){//科室列表
+    return request('/user/officeList','GET',data)
+}
+function getPosition(){//职称列表
+    return request('/user/positionList','GET',{})
+}
+function uploadImg(data){//上传图片
+    return request('/user/uoloadImg','POST',data)
+}
+function phoneLogin(appid,data){//获取用户绑定手机号信息
+    return request(`/wx/user/${appid}/phone`,'GET',data,true)
+}
+function logout(){
+    return request(`/user/logOut`,'GET')
+}
+function needInfo(mobile){//获取用户绑定手机号信息
+    return request(`/user/getDetail/${mobile}`,'GET',{},true)
+}
+function modifyInfo(data){//修改HCP资料
+    return request(`/user/modify`,'POST',data,true)
+}
+function pwdLogin(data){ //密码登录
+    return request('/user/login','POST',data,true)
+};
+function getPrivacy(){//获取用户绑定手机号信息
+    return request(`/user/getPrivacy`,'GET',{},true)
+}
+function getProjectStatus(){//获取项目项目状态
+    return request(`/user/getProjectStatus`,'GET',{},true)
+}
+
+// function getCaseNum(){//获取项目病例总数
+//     return request(`/user/getCaseNum`,'GET',{},true)
+// }
+// function getCaseSwitch(){//项目病例开关
+//     return request(`/user/getCaseSwitch`,'GET',{},true)
+// }
+
+
+module.exports={
+    addCase,
+    caseDetail,
+    caseList,
+    editCase,
+    getCaptcha,
+    getDeal,
+    getInfo,
+    getRubric,
+    sendSms,
+    smsLogin,
+    smsRegister,
+    addBank,
+    getSign,
+    getOssSign,
+    getArea,
+    getHospital,
+    getOfficeList,
+    getPosition,
+    uploadImg,
+    phoneLogin,
+    logout,
+    needInfo,
+    modifyInfo,
+    pwdLogin,
+    getPrivacy,
+    getProjectStatus
+  }

api/auth.js

@@ -0,0 +1,22 @@
+function auth(){  //鉴权
+    return new Promise((resolve,reject)=>{
+      wx.login({
+        success(res){
+          if(res.errMsg=="login:ok"){
+            resolve(res.code)
+         }else{
+          wx.showToast({
+            title:res.errMsg,
+            icon:'error'
+          })
+         }
+        },
+        fail(err){
+          reject(err)
+        }
+      })
+    })
+  }
+  module.exports = {
+    auth
+  }

app.js

@@ -0,0 +1,12 @@
+// app.js
+import { hostConfig} from "./utils/config"
+import router from './utils/router.js'
+App({
+  onLaunch: function () {
+  },
+  method: router,
+  hostConfig: hostConfig,
+  globalData: {
+    height: 0
+  }
+});

app.json

@@ -0,0 +1,49 @@
+{
+    "pages": [
+        "pages/index/index",
+        "pages/personCenter/personCenter"
+    ],
+    "subpackages": [
+        {
+            "root": "case",
+            "pages": [
+                "pages/mobileLogin/mobileLogin",
+                "pages/createCase/createCase",
+                "pages/register/register",
+                "pages/agreement/agreement",
+                "pages/signcanvas/signcanvas",
+                "pages/improveInfo/improveInfo",
+                "pages/pwdLogin/pwdLogin",
+                "pages/privacy/privacy",
+                "pages/bankCard/bankCard",
+                "pages/paintCanvas/paintCanvas"
+            ]
+        }
+    ],
+    "tabBar": {
+        "custom": true,
+        "color": "#000000",
+        "selectedColor": "#3881F7",
+        "backgroundColor": "#fff",
+        "list": [
+            {
+                "pagePath": "pages/index/index",
+                "text": "病例列表"
+            },
+            {
+                "pagePath": "pages/personCenter/personCenter",
+                "text": "个人中心"
+            }
+        ]
+    },
+    "window": {
+        "backgroundColor": "#F6F6F6",
+        "backgroundTextStyle": "light",
+        "navigationBarBackgroundColor": "#F6F6F6",
+        "navigationBarTitleText": "人工肝病例登记系统",
+        "navigationBarTextStyle": "black"
+    },
+    " __usePrivacyCheck__": true,
+    "sitemapLocation": "sitemap.json",
+    "lazyCodeLoading": "requiredComponents"
+}

app.wxss

@@ -0,0 +1,35 @@
+
+page{
+     width: 100%;
+     height:100vh;
+    display: flex;
+    flex-direction: column;
+   
+    font-family: PingFang SC;
+}
+.container {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  box-sizing: border-box;
+} 
+
+button {
+  background: initial;
+}
+
+button:focus{
+  outline: 0;
+}
+
+button::after{
+  border: none;
+}
+.nonedata{
+  min-height:350rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+}
+

case/pages/agreement/agreement.js

@@ -0,0 +1,154 @@
+// case/pages/agreement/agreement.js
+import {getDeal,getRubric,getSign} from "../../../api/api"
+import { throttle } from "../../../utils/util"
+const dayjs = require("../../../utils/dayjs");
+const app = getApp()
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+    node:'',
+    type:'',
+    year:'',
+    month:'',
+    day:'',
+    signImg:'',
+    navName:'项目协议'
+    },
+    handleGetDeal(name,mobile,bankName,bankCardNo,idCardNo){
+        getDeal().then(res=>{
+             let deal=res.replace(/\$\{name\}/g,name).replace(/\$\{mobile\}/g,mobile).replace(/\$\{bankName\}/g,bankName).replace(/\$\{bankCardNo\}/g,bankCardNo).replace(/\$\{idCardNo\}/g,idCardNo);
+          this.setData({
+               node:deal
+          })
+        })
+    },
+    handleFetRubric(){
+        getRubric().then(res=>{
+            this.setData({
+                node:res
+           })
+        })
+    },
+    goSign:throttle(function(){
+        let tokenStr=''
+        const { envVersion } = wx.getAccountInfoSync().miniProgram;
+        if(envVersion=="develop" || envVersion=="trial"){
+          tokenStr="DEV_CASE_TOKEN"
+        }else{
+          tokenStr="PROD_CASE_TOKEN"
+        }
+        let token = wx.getStorageSync(tokenStr);
+        if(token){
+            app.method.navigateTo({
+                url: '/case/pages/bankCard/bankCard',
+                complete:function(err){
+                   console.log(err)
+                }
+              })
+        }else{
+            app.method.navigateTo({
+                url: '/case/pages/mobileLogin/mobileLogin?redirectUrl='+encodeURIComponent('case/pages/agreement/agreement'),
+                complete:function(err){
+                   console.log(err)
+                }
+              })  
+        }
+       
+    }),
+    handleGetSign(){
+        getSign().then(res=>{
+            if(res && res.signImg){
+                let {signImg,createTime,bankCardNo,bankName,idCardNo,mobile,name}=res;
+                this.handleGetDeal(name,mobile,bankName,bankCardNo,idCardNo);
+               this.setData({
+                signImg:signImg,
+                year:dayjs(createTime).format("YYYY"),
+                month:dayjs(createTime).format("M"),
+                day:dayjs(createTime).format("D"),
+               })
+            }else{
+                this.handleGetDeal('','','','','');
+            }
+        }).catch(error=>{
+          
+             if(error.code==30007){
+                app.method.navigateTo({
+                    url: '/case/pages/mobileLogin/mobileLogin?redirectUrl='+encodeURIComponent('case/pages/agreement/agreement'),
+                    complete:function(err){
+                       console.log(err)
+                    }
+                  })  
+               
+             }
+        })
+      },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+        if(options.type=="description"){
+            this.handleFetRubric();
+            this.setData({
+                type:'description',
+                navName:'操作说明'
+            })
+        }else{
+          
+            this.handleGetSign();
+        }
+       
+      
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    // onShareAppMessage() {
+
+    // }
+})

case/pages/agreement/agreement.json

@@ -0,0 +1,6 @@
+{
+    "usingComponents": {
+        "navBar":"../../../components/navBar/navBar"
+    },
+    "navigationStyle":"custom"
+}

case/pages/agreement/agreement.wxml

@@ -0,0 +1,33 @@
+<!--case/pages/agreement/agreement.wxml-->
+<navBar navName="{{navName}}"></navBar>
+<view class="page">
+  
+  <view class="con {{(!type && !signImg)?'active':''}}">
+    <rich-text nodes="{{node}}"></rich-text>
+  </view>
+  <view class="imgbox" wx:if="{{signImg}}">
+    <view class="jiafang">
+       <view>甲方：北京欣欣相照健康科技有限公司</view>
+       <view class="signdate">日期：<text class="signtext">{{year}}</text>年<text class="signtext">{{month}}</text>月<text class="signtext">{{day}}</text>日</view>
+       <image src="../../../static/gdxz.png" mode="" class="company" />
+    </view>
+    <view class="jiafang" style="margin-top: 40rpx;">
+       <view>乙方：北京杏苑爱医科技发展有限公司</view>
+       <view class="signdate">日期：<text class="signtext">{{year}}</text>年<text class="signtext">{{month}}</text>月<text class="signtext">{{day}}</text>日</view>
+       <image src="../../../static/xinlin.png" mode="" class="company company2" />
+    </view>
+    <view class="yifang" style="margin-top: 40rpx;">
+       <view>丙方：</view>
+       <view class="signdate">日期：<text class="signtext">{{year}}</text>年<text class="signtext">{{month}}</text>月<text class="signtext">{{day}}</text>日</view>
+       <image src="{{signImg}}" mode="" class="signimg" />
+    </view>
+    <!-- <image src="../../../static/gdxz.png" mode="" class="company" />
+  
+   <image src="{{signImg}}" mode="" class="signimg" /> -->
+
+  </view>
+  <!-- wx:if="{{!type && !signImg}}" -->
+  <view class="btnbox" wx:if="{{!type && !signImg}}">
+    <view class="btn" bind:tap="goSign">同意签署</view>
+    </view>
+</view>

case/pages/agreement/agreement.wxss

@@ -0,0 +1,92 @@
+/* case/pages/agreement/agreement.wxss */
+.page{
+    background: #F7F9F9;
+    flex:1;
+    display: flex;
+    position: relative;
+    flex-direction: column;
+    margin-top: 172rpx;
+}
+.con{
+    flex:1;
+    padding:10rpx 32rpx 0;
+    margin-bottom: 20rpx;
+}
+.con.active{
+    margin-bottom: 150rpx;   
+}
+.btnbox{
+    z-index:999;
+    padding:0 32rpx;
+    background-color: #fff;
+    position: fixed;
+    box-sizing: border-box;
+    bottom:0;
+    height: 130rpx;
+    width:100%;
+}
+.btnbox .btn{
+    margin-top: 15rpx;
+    width:100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 32rpx;
+   font-weight: 500;
+   color: #FFFFFF;
+    height: 88rpx;
+   background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+   border-radius: 8rpx;
+}
+.imgbox{
+    margin:30rpx 32rpx 60rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    justify-content: space-between;
+}
+.company{
+    z-index:99;
+    top:-55rpx;
+    position: absolute;
+    width:220rpx;
+    right:206rpx;
+    height:220rpx;
+}
+.signimg{
+    top:-40rpx;
+    left:80rpx;
+    position: absolute;
+    width:160rpx;
+    height:120rpx;
+}
+.signbox{
+    display: flex;
+    align-items: center;
+    justify-content: flex-start;
+}
+.jiafang{
+    position: relative;
+    flex:1;
+    font-size:28rpx;
+    margin-bottom:50rpx;
+}
+.yifang{
+    font-size:small;
+    flex:1;
+    font-size:28rpx;
+    display: flex;
+    justify-content: space-between;
+    align-items: flex-start;
+    flex-direction: column;
+    position: relative;
+}
+.signdate{
+    margin-top: 40rpx;
+}
+.company2{
+    top:-90rpx;
+    right:280rpx;
+    width:280rpx;
+    height:300rpx;
+}

case/pages/bankCard/bankCard.js

@@ -0,0 +1,322 @@
+// case/pages/improveInfo/improveInfo.js
+// case/pages/register/register.js
+import {throttle} from "../../../utils/util"
+import {hostConfig} from "../../../utils/config"
+import {getArea,addBank} from "../../../api/api"
+const host=hostConfig().host;
+const app=getApp();
+Page({
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        showSuccess:false,
+        img_host:app.hostConfig().imghost,
+        showArea:false,
+        cityName:'',
+        areaColumns:[
+            {
+                values: [1,2],
+                className: 'column1',
+            },
+            {
+                values: [3,4],
+                className: 'column2',
+                defaultIndex: 0
+            },
+            {
+                values: [3,4],
+                className: 'column3',
+                defaultIndex: 0
+            },
+            ],
+            showArea:false,
+        bankCardNo:'',
+        bankName:'',
+        cityId:'',
+        countyId:'',
+        provId:'',
+        name:'',
+        idCardNo:'',
+        signImg:'',
+    },
+    opeArea(){
+        this.setData({
+           showArea:true
+        })
+    },
+    openOffice(){
+      this.setData({
+          showOffice:true,
+      })
+    },
+    openPosition(){
+        this.setData({
+            showPosition:true,
+        })
+      },
+    onChange(e){
+        const {value} = e.detail;
+
+        const {id}=e.currentTarget.dataset;
+        // console.log(value,id)
+        this.setData({
+            [id]: value
+        });
+    },
+    onChangeArea(event){
+        const { picker, value, index } = event.detail;
+        const provinceId=value[0].id;
+        const cityId=value[1].id;
+        if(index==0){
+            this.handleGetArea(provinceId,2);
+        }else if(index==1){
+            this.handleGetArea(cityId,3)
+        }
+    },
+    confirmArea(event){
+        const {value} = event.detail;
+        console.log(value);
+        let provId=value[0].id;
+        let cityId=value[1].id;
+         let countyId=value[2]?value[2].id:value[1].id;
+         let cityName='';
+         for (let i = 0; i <value.length; i++) {
+             if(value[i]){
+                cityName+=value[i].name   
+             };
+           
+         };
+        this.setData({
+            provId:provId,
+            cityId:cityId,
+            countyId:countyId,
+            cityName:cityName,
+            showArea:false
+        });
+       
+    },
+    cancelArea(){
+        this.setData({
+            showArea:false
+        })
+    },
+    confirmHospital(event){
+        let {value}=event.detail;
+        this.setData({
+            showHospital:false,
+            hospital_uuid:value.uuid,
+            hospital_name:value.name
+        })
+    },
+    cancelHospital(){
+        this.setData({
+            showHospital:false
+        })
+    },
+ 
+   
+   
+   
+    handleAddBank:throttle(function(){
+        let {signImg,bankCardNo,bankName,cityId,countyId,idCardNo,name,provId}=this.data;
+        if (!/^([\u4e00-\u9fa5\·]{2,10})$/.test(name)) {
+            wx.showToast({
+              title: `姓名要求在2-10个汉字`,
+              icon: 'none',
+            });
+            return false;
+          };
+          if (!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(idCardNo)){
+            wx.showToast({
+              title: `请输入有效的身份证号`,
+              icon: 'none',
+            });
+            return false;
+          };
+          if(!provId){
+            wx.showToast({
+                title: `请选择开户行所在城市`,
+                icon: 'none',
+              });
+              return false;
+          }
+          if(!bankName){
+            wx.showToast({
+                title: `请输入开户行`,
+                icon: 'none',
+              });
+              return false;
+          }
+          if(!this.luhnCheck(bankCardNo)){
+            wx.showToast({
+                title: `请输入有效银行卡号`,
+                icon: 'none',
+              });
+              return false;
+          };
+          if(!signImg){
+            wx.showToast({
+                title: `请添加签名`,
+                icon: 'none',
+              });
+              return false;
+          }
+        addBank({
+            signImg,
+            bankCardNo,
+            bankName,
+            cityId,
+            countyId,
+            idCardNo,
+            name,
+            provId
+        }).then(res=>{
+            wx.showToast({
+              title: '绑定成功',
+              icon:'none',
+              duration:2000,
+              success:function(){
+                let timer=setTimeout(()=>{
+                    wx.switchTab({
+                        url: '/pages/index/index',
+                      })
+                    clearTimeout(timer)
+                 },1000)
+              }
+            })
+        })
+     }),
+     luhnCheck(cardNumber) {  
+        var sum = 0;  
+        var shouldDouble = false;  
+        var digit;  
+      
+        // 去除任何非数字字符  
+        cardNumber = cardNumber.replace(/\D/g, '');  
+      
+        // 从右向左遍历数字  
+        for (var i = cardNumber.length - 1; i >= 0; i--) {  
+            digit = parseInt(cardNumber.charAt(i), 10);  
+      
+            if (shouldDouble) {  
+                if ((digit *= 2) > 9) digit -= 9;  
+            }  
+      
+            sum += digit;  
+            shouldDouble = !shouldDouble;  
+        }  
+      
+        // 如果校验和能被10整除，则卡号有效  
+        return (sum % 10) === 0;  
+    },
+    goSign:throttle(function(){
+        app.method.navigateTo({
+            url:'/case/pages/signcanvas/signcanvas'
+        })
+    }),
+    handleGetArea(id,type){
+       getArea({
+           parent:id
+       }).then(res=>{
+           if(type==1){
+            let obj='areaColumns[0].values';
+            this.setData({
+                [obj]:res
+            }) 
+            this.handleGetArea(res[0].id,2)
+           }else if(type==2){
+            let obj='areaColumns[1].values';
+            this.setData({
+                [obj]:res
+            })
+            this.handleGetArea(res[0].id,3)
+           }else{
+            let obj='areaColumns[2].values';
+            this.setData({
+                [obj]:res
+            }) 
+          
+           }
+         
+       }).catch(error=>{
+           console.log(error)
+       })
+    },
+     handleGetOffice(){
+        getOfficeList({}).then(res=>{
+            this.setData({
+                officeColumns:res
+            })
+        }).catch(error=>{
+            console.log(error)
+        })
+     },
+     handleGetPosition(){
+        getPosition().then(res=>{
+            this.setData({
+                positionColumns:res
+            })
+            this.handleNeedInfo();
+        })
+     },
+    
+   
+  
+   
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+        this.handleGetArea('',1); 
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+       
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    // onShareAppMessage() {
+
+    // }
+})

case/pages/bankCard/bankCard.json

@@ -0,0 +1,16 @@
+{
+    "usingComponents": {
+        "navBar":"../../../components/navBar/navBar",
+        "dialog":"../../../components/dialog/dialog",
+        "van-popup": "@vant/weapp/popup/index",
+        "van-icon": "@vant/weapp/icon/index",
+        "van-picker": "@vant/weapp/picker/index",
+        "van-field": "@vant/weapp/field/index",
+        "van-cell": "@vant/weapp/cell/index",
+        "van-button": "@vant/weapp/button/index",
+        "van-image": "@vant/weapp/image/index",
+        "van-uploader": "@vant/weapp/uploader/index",
+         "van-cell-group": "@vant/weapp/cell-group/index"
+    },
+    "navigationStyle":"custom"
+}

case/pages/bankCard/bankCard.wxml

@@ -0,0 +1,51 @@
+<!--case/pages/bankCard/bankCard.wxml-->
+<navBar navName="绑定银行卡"></navBar>
+<view class="page">
+    <view class="content">
+        <view class="tip">请确定开户人姓名与真实姓名一致</view>
+    <view >
+        <van-cell-group class="group" >
+        <van-field value="{{ name }}" label="姓名" placeholder="请输入您的真实姓名"  input-align="right" placeholder-style="color:#999;font-size:15px" bind:change="onChange" data-id="name"  extra-event-params/>
+        <van-field value="{{ idCardNo }}" label="身份证号" placeholder="请输入您的身份证号"  input-align="right" placeholder-style="color:#999;font-size:15px" bind:change="onChange" data-id="idCardNo"  extra-event-params/>
+       
+        
+      
+      
+    </van-cell-group>
+    <view style="margin-top: 40rpx;">
+        <van-cell-group class="group" >
+            <van-field value="{{cityName}}"   label="所在城市" placeholder="请选择开户行所在城市" right-icon="arrow" placeholder-style="color:#999;font-size:15px"
+        input-align="right" bind:tap="opeArea" readonly/>
+        <van-field value="{{ bankName }}"  
+        placeholder-style="color:#999;font-size:15px" bind:change="onChange" data-id="bankName"  extra-event-params  label="开户行" placeholder="请输入开户行"  input-align="right"   />
+        <van-field value="{{ bankCardNo }}"  
+        placeholder-style="color:#999;font-size:15px" bind:change="onChange" data-id="bankCardNo"  extra-event-params label="银行卡号" placeholder="请输入银行卡号"  input-align="right"   />
+      
+    </van-cell-group>
+    </view>
+    <view style="margin-top: 40rpx;">
+       <view class="signbox">
+          <view class="signname"><text class="name">签名</text></view>
+          <view class="uploadbox" bind:tap="goSign" wx:if="{{!signImg}}">
+            <van-icon name="plus" size="40px" color="#999"/>
+            <view class="name">添加签名</view>
+          </view>
+          <image  class="uploadbox" src="{{signImg}}" mode="widthFix" wx:else />
+       </view>
+
+    </view>
+   
+     </view>
+    </view>
+     <view class="next">
+            <van-button type="primary" block bind:tap="handleAddBank">提交</van-button>
+        </view>
+</view>
+<van-popup
+  show="{{ showArea }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ areaColumns }}" value-key="name" bind:change="onChangeArea" title="请选择地区" show-toolbar bind:confirm="confirmArea" bind:cancel="cancelArea"/>
+</van-popup>

case/pages/bankCard/bankCard.wxss

@@ -0,0 +1,143 @@
+/* case/pages/bankCard/bankCard.wxss *//* case/pages/improveInfo/improveInfo.wxss */
+/* case/pages/register/register.wxss */
+page{
+    overflow: hidden;
+}
+.page{
+    height:calc(100vh - 172rpx);
+    margin-top: 172rpx;
+    display: flex;
+    flex-direction: column;
+    background-color: #F4F4F4;
+}
+.content{
+    flex:1;
+    overflow: scroll;
+    -webkit-overflow-scrolling: touch;
+}
+.tip{
+    height:80rpx;
+    display: flex;
+    font-size: 28rpx;
+    align-items: center;
+    color:#fff;
+    padding:0 32rpx;
+    background: #3881F7;
+    border-bottom:1px solid #ccc;
+}
+.next{
+    margin: 40rpx 20rpx!important;
+}
+.prev{
+    margin:-20rpx 20rpx 0!important ;   
+}
+.van-field__label{
+    white-space: nowrap;
+}
+.custom-class .van-cell:last-child{
+    background-color: red;
+} 
+.van-cell__title{
+   white-space: nowrap;
+    display: flex;
+    color: #646566;
+    align-items: center;
+}
+.van-image{
+    margin-top: 10rpx;
+}
+.van-cell{
+    display: flex;
+    align-items: center;
+}
+.van-field__label,.van-cell__title{
+    position: relative;
+}
+.signname .name{
+    width: auto;
+    position: relative;
+}
+.van-field__label::after,.cert .van-cell__title::after{
+    content: "*";
+    color:red;
+    position: absolute;
+    top:12rpx;
+    right:-14rpx;
+}
+.signname .name::after{
+    content: "*";
+    color:red;
+    position: absolute;
+    top:4rpx;
+    right:-14rpx;
+}
+.cert .van-cell__title::after{
+    top:4rpx;
+}
+.myclass .van-field__label::after{
+    content: "";
+}
+.upload{
+    opacity:0;
+    position: absolute;
+    z-index:99;
+}
+.cert .van-cell{
+    overflow: hidden;
+}
+.van-button{
+    border-radius: 10rpx!important;
+}
+.imgCode{
+    width:200rpx;
+   height:75.6rpx;
+}
+.custom-class{
+    min-height:43.5px !important;
+}
+.van-field__label{
+    color:#333!important;
+    padding:12rpx 0;
+    font-size: 15px!important;
+}
+.van-cell__title{
+    color:#333!important;
+    font-size: 15px!important;
+}
+.buttonbox{
+    position: absolute;
+    z-index:99;
+    display: flex;
+    width:600rpx;
+    left:50%;
+    transform: translateX(-50%);
+    justify-content: space-between;
+    bottom:50rpx;
+  }
+  .van-button--primary{
+    background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%)!important;
+    border-color:#377FF7!important
+  }
+  .signbox{
+      border: 0.5px solid #ebedf0;
+      border-left: none;
+      border-right: none;
+      padding:10px 16px;
+      background-color: #fff;
+  }
+  .uploadbox{
+      margin-top: 20rpx;
+      width:300rpx;
+      height:300rpx;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      flex-direction: column;
+      font-size: 28rpx;
+      color:#666;
+      border-radius: 10rpx;
+      background-color: #f7f8fa;
+  }
+  .uploadbox .name{
+      margin-top: 10rpx;
+  }

case/pages/createCase/createCase.json

@@ -0,0 +1,17 @@
+{
+    "usingComponents": {
+        "navBar":"../../../components/navBar/navBar",
+        "van-tab": "@vant/weapp/tab/index",
+        "van-tabs": "@vant/weapp/tabs/index",
+        "van-picker": "@vant/weapp/picker/index",
+        "van-icon": "@vant/weapp/icon/index",
+        "van-uploader": "@vant/weapp/uploader/index",
+        "van-popup": "@vant/weapp/popup/index",
+        "dialog":"../../../components/dialog/dialog",
+        "van-datetime-picker": "@vant/weapp/datetime-picker/index",
+        "van-radio": "@vant/weapp/radio/index",
+        "van-field": "@vant/weapp/field/index",
+        "van-radio-group": "@vant/weapp/radio-group/index"
+    },
+    "navigationStyle":"custom"
+}

case/pages/createCase/createCase.wxml

@@ -0,0 +1,454 @@
+<!--case/pages/createCase/createCase.wxml-->
+<!-- <navBar navName="创建病例"></navBar> -->
+<view class="ui-navigatorbar" style="background: #FFFFFF">
+    <van-icon name="arrow-left" bindtap="goBack" class="ui-navigatorbar-back" />
+    <view class="ui-title">{{navName}}</view>
+</view>
+
+<view class="page">
+    <van-tabs active="{{ active }}" wrap-class="tabwrap" use-before-change="{{ true }}" custom-class="tabbox" bind:before-change="onBeforeChange">
+        <van-tab title="基本信息" class="vantab">
+            <view class="basic {{!showSaveBtn?'active':''}}" >
+                <view class="basiccon">
+                    <view class="row">
+                        <view class="left">
+                            患者姓名(首字母大写)<text class="red">*</text>
+                        </view>
+                        <view class="right">
+                            <input type="text" value="{{case.name}}" bindinput="handleIpt" class="ipt" data-id="name" placeholder="请输入" 
+                            placeholder-class="placeholder" disabled="{{!showSaveBtn}}"/>
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">
+                            患者ID号<text class="red">*</text>
+                        </view>
+                        <view class="right">
+                            <input type="text" value="{{case.uid}}" bindinput="handleIpt" class="ipt" data-id="uid" placeholder="请输入" placeholder-class="placeholder" disabled="{{!showSaveBtn}}"/>
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">
+                            性别<text class="red">*</text>
+                        </view>
+                        <view class="right">
+                            <van-radio-group value="{{ case.sex }}" bind:change="onChange" 
+                             disabled="{{!showSaveBtn}}"
+                             direction="horizontal">
+                                <van-radio name="{{1}}">男</van-radio>
+                                <van-radio name="{{2}}">女</van-radio>
+                            </van-radio-group>
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">
+                            年龄<text class="red">*</text>
+                        </view>
+                        <view class="right">
+                            <input type="number" value="{{case.age}}" bindinput="handleIpt" class="ipt" data-id="age" placeholder="请输入" placeholder-class="placeholder" disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">
+                            入院时间<text class="red">*</text>
+                        </view>
+                        <view class="right" bind:tap="openTime">
+                            <input type="text" value="{{case.admissionTime}}" class="ipt" placeholder="请输入" placeholder-class="placeholder" disabled />
+                            <van-icon name="arrow" color="#83858a" size="38rpx" class="righticon" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">
+                            病例类型<text class="red">*</text>
+                        </view>
+                        <view class="right" bind:tap="openType">
+                            <input type="text" value="{{typeName}}" class="ipt" placeholder="请输入" placeholder-class="placeholder" disabled />
+                            <van-icon name="arrow" color="#83858a" size="38rpx" class="righticon" />
+                        </view>
+                    </view>
+                    <view class="row" style="flex-direction: column;">
+                        <view class="left">
+                            病案照片(可上传1-6张)<text class="red">*</text>
+                        </view>
+                        <view class="uploadbox">
+                            <van-uploader file-list="{{ fileList_basic }}" name="basic" 
+                            deletable="{{showSaveBtn}}"
+                            show-upload="{{showSaveBtn}}"
+                            bind:delete="deleteImg" max-count="6" multiple bind:after-read="afterRead" upload-text="上传" upload-icon="{{img_host+'/upload.png'}}" />
+                        </view>
+                    </view>
+                </view>
+                <view class="tip" style="padding-bottom: 130rpx;">注意：“病案首页”需包含患者住院号或姓名</view>
+                <view class="btnbox" wx:if="{{showSaveBtn}}">
+                    <view class="btn" bind:tap="saveBasic">下一步</view>
+                 </view>
+            </view>
+          
+        </van-tab>
+        <van-tab title="临床资料" disabled="{{disable_ziliao}}">
+            <view class="basic {{!showSaveBtn?'active':''}}" >
+         
+                <view class="ziliao"  wx:if="{{active!=0}}" >
+                    <view class="row" style="flex-direction: column;overflow: hidden;position: relative;">
+                        <view class="left" style="font-weight:bold">
+                            病历摘要<text class="red"></text>
+                        </view>
+                        <textarea value="{{case.abstractStr}}" 
+                         disabled="{{!showSaveBtn}}"
+                          class="textArea"
+                          placeholder="请输入病历摘要"
+                          bind:input="onChangeAbstract"
+                          bind:change="onChangeAbstract"
+                          placeholder-style="color:rgba(0,0,0,0.25)"
+                          confirm-type="done"
+                          maxlength="500" 	auto-height="{{true}}"/>
+                          <view class="word">{{wordLength}}/500</view>
+                        <!-- <van-field value="{{case.abstractStr}}" 
+                        name="abstractStr" label="" type="textarea" placeholder="请输入病历摘要" show-word-limit autosize="{{minHeight}}" border="{{ false }}" 
+                        custom-style="font-size:15px;min-height:100px;background:red;word-wrap:break-word;word-break: break-all;" bind:input="onChangeAbstract" maxlength="500" /> -->
+                    </view>
+                 
+                    <view class="row" style="flex-direction: column;" wx:if="{{!(fileList_abstract.length==0 && !showSaveBtn)}}">
+                        <view class="left" style="font-weight:bold">
+                            病历摘要图片(可上传1-6张)<text class="red"></text>
+                        </view>
+                        <view class="uploadbox">
+                            <van-uploader file-list="{{ fileList_abstract }}" name="abstract" multiple max-count="6" 
+                            deletable="{{showSaveBtn}}" 
+                            show-upload="{{showSaveBtn}}"
+                            bind:delete="deleteImg" bind:after-read="afterRead" upload-text="上传" upload-icon="{{img_host+'/upload.png'}}" />
+                        </view>
+                    </view>
+                </view>
+                <view class="btnbox" wx:if="{{showSaveBtn}}">
+                    <view class="btn" bind:tap="saveAbstract">下一步</view>
+                 </view>
+                 <view class="tip" >注意：病历摘要，文字填写或者上传图片，二选一</view>
+            </view>
+        </van-tab>
+        <van-tab title="DPMAS治疗记录" disabled="{{disable_record}}">
+            <view class="basic {{!showSaveBtn?'active':''}}">
+                <view class="recordcon">
+                    <view class="record" wx:for="{{case.dpmas}}" wx:key="index">
+                        <view class="title">
+                            <view class="titlename">
+                                <view class="bar"></view>
+                                <view class="recordtime">第{{index+1}}次治疗</view>
+                            </view>
+                            <van-icon name="delete-o" size="22" bind:tap="confirmDelRecord" data-index="{{index}}" color="#b9bbbb" wx:if="{{index!=0 && showSaveBtn}}" />
+                        </view>
+                        <view class="row">
+                            <view class="left">
+                                治疗时间<text class="red">*</text>
+                            </view>
+                            <view class="right" bind:tap="openDealTime" data-index="{{index}}">
+                                <input type="text" value="{{dpmas_list[index].treatTime}}" class="ipt" placeholder="请选择时间" placeholder-class="placeholder" disabled />
+                                <text wx:if="{{dpmas_list[index].treatTime}}">h</text>
+                                <van-icon name="arrow" color="#83858a" size="38rpx" class="righticon" />
+                            </view>
+                        </view>
+                        <view class="row" style="flex-direction: column;border:none">
+                            <view class="left" style="white-space: normal;display: block;">
+                                治疗凭证，如医嘱、收费明细、处方单(可上传1-3张)<text class="red">*</text>
+                            </view>
+                            <view class="uploadbox">
+                                <van-uploader file-list="{{ dpmas_list[index].fileList}}" bind:delete="deleteImg" multiple max-count="3" name="{{'record'+index}}" 
+                                show-upload="{{showSaveBtn}}"
+                                deletable="{{showSaveBtn}}"
+                                bind:after-read="afterRead" upload-text="上传" upload-icon="{{img_host+'/upload.png'}}" />
+                            </view>
+                        </view>
+                    </view>
+                    <view class="addrecord" bind:tap="addRecord" wx:if="{{showSaveBtn}}">
+                        <van-icon name="plus" size="38rpx" />
+                        <view class="recordText">增加记录</view>
+                    </view>
+                </view>
+                <view class="tip" style="padding-bottom: 120rpx;">
+                    <text>
+                        注意：“DPMAS治疗凭证”照片需包含患者住院号或姓名
+                        1.4次及以上疗程化病例，每次治疗对应一张凭证照片；
+                        2.早前期（INR≤1.5）的病例，上传第一次DPMAS治疗前最新的“INR检验报告单”
+                        3.早前期（INR≤1.5）的病例，DPMAS治疗时间不能晚于INR出报告时间24小时。
+                    </text>
+                </view>
+                <view class="btnbox" wx:if="{{showSaveBtn}}">
+                    <view class="btn" bind:tap="saveRecord">下一步</view>
+                 </view>
+                <!-- <view class="bottom">
+                    <view class="savebtn">保 存</view>
+                </view> -->
+            </view>
+        </van-tab>
+        <van-tab title="实验室检测" disabled="{{disable_check}}">
+            <view class="basic record {{!showSaveBtn?'active':''}}" style="background-color: #fff;">
+                <view class="message"> (早前期为首次治疗前后、4次及以上为疗程化治疗前后)</view>
+                <view class="row">
+                    <view class="left">
+                        治疗前检测时间<text class="red">*</text>
+                    </view>
+                    <view class="right" bind:tap="openHeadTime">
+                        <input type="text" value="{{case.headTime}}" class="ipt" placeholder="请选择时间" placeholder-class="placeholder" disabled />
+                        <text wx:if="{{case.headTime}}">h</text>
+                        <van-icon name="arrow" color="#83858a" size="38rpx" class="righticon" />
+                    </view>
+                </view>
+                <view class="row">
+                    <view class="left">
+                        治疗后检测时间<text class="red">*</text>
+                    </view>
+                    <view class="right" bind:tap="openAfterTime">
+                        <input type="text" value="{{case.afterTime}}" class="ipt" placeholder="请选择时间" placeholder-class="placeholder" disabled />
+                        <text wx:if="{{case.afterTime}}">h</text>
+                        <van-icon name="arrow" color="#83858a" size="38rpx" class="righticon" />
+                    </view>
+                </view>
+                <view class="table">
+                    <view class="t_title">
+                        总胆红素(TB-umol/L)<text class="red">*</text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headTb}}" bindinput="handleIpt" class="ipt" data-id="headTb" 
+                            data-type="number"
+                            placeholder="请输入" placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterTb}}" bindinput="handleIpt" class="ipt" data-id="afterTb" 
+                            data-type="number"
+                            placeholder="请输入" placeholder-class="placeholder"   disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                </view>
+                <!-- <view class="table">
+                    <view class="t_title">
+                        直接胆红素(DB-umol/L)<text class="red"></text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headDb}}" bindinput="handleIpt" class="ipt" data-id="headDb" 
+                            data-type="number" 
+                            placeholder="请输入" placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterDb}}" bindinput="handleIpt" class="ipt" data-id="afterDb" 
+                            data-type="number" placeholder="请输入" placeholder-class="placeholder"  disabled="{{!showSaveBtn}}"  />
+                        </view>
+                    </view>
+                </view> -->
+                <!-- <view class="table">
+                    <view class="t_title">
+                        间接胆红素(IB-umol/L)<text class="red"></text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headIb}}" bindinput="handleIpt" class="ipt" data-id="headIb" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterIb}}" bindinput="handleIpt" class="ipt" data-id="afterIb" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                </view> -->
+                <view class="table">
+                    <view class="t_title">
+                        谷丙转氨酶(ALT-U/L)<text class="red">*</text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headAlt}}" bindinput="handleIpt" class="ipt" data-id="headAlt" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterAlt}}" bindinput="handleIpt" class="ipt" data-id="afterAlt" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}"  />
+                        </view>
+                    </view>
+                </view>
+                <view class="table">
+                    <view class="t_title">
+                        谷草转氨酶(AST-U/L)<text class="red">*</text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headAst}}" bindinput="handleIpt" class="ipt" data-id="headAst" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterAst}}" bindinput="handleIpt" class="ipt" data-id="afterAst" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}"/>
+                        </view>
+                    </view>
+                </view>
+                <view class="table">
+                    <view class="t_title">
+                        国际标准化比值(INR)<text class="red">*</text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headInr}}" bindinput="handleIpt" class="ipt" data-id="headInr" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterInr}}" bindinput="handleIpt" class="ipt" data-id="afterInr" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                </view>
+                <view class="table">
+                    <view class="t_title">
+                        白蛋白(ALB-g/L)<text class="red"></text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headAlb}}" bindinput="handleIpt" class="ipt" data-id="headAlb" 
+                            data-type="number"
+                            placeholder="请输入" placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterAlb}}" bindinput="handleIpt" class="ipt" data-id="afterAlb" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"   disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                </view>
+                <view class="table">
+                    <view class="t_title">
+                        凝血酶原活动度(PTA-%)<text class="red"></text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headPta}}" bindinput="handleIpt" class="ipt" data-id="headPta" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterPta}}" bindinput="handleIpt" class="ipt" data-id="afterPta" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                </view>
+               
+              
+                
+                <view class="table">
+                    <view class="t_title">
+                        白介素6(IL-6-ng/L)<text class="red"></text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headIl6}}" bindinput="handleIpt" class="ipt" data-id="headIl6" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}"  />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterIl6}}" bindinput="handleIpt" class="ipt" data-id="afterIl6" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                </view>
+                <view class="table">
+                    <view class="t_title">
+                        肿瘤坏死因子α(TNF-α-μg/L)<text class="red"></text>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗前</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.headTnf}}" bindinput="handleIpt" class="ipt" data-id="headTnf" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                    <view class="row">
+                        <view class="left">治疗后</view>
+                        <view class="right">
+                            <input type="digit" value="{{case.afterTnf}}" bindinput="handleIpt" class="ipt" data-id="afterTnf" placeholder="请输入" 
+                            data-type="number"
+                            placeholder-class="placeholder"  disabled="{{!showSaveBtn}}" />
+                        </view>
+                    </view>
+                </view>
+                <view class="row" style="flex-direction: column;border:none;padding-bottom:120rpx;">
+                    <view class="left">
+                        检查报告单(可上传1-6张)<text class="red">*</text>
+                    </view>
+                    <view class="red rederror">至少包含国际标准化比值 （INR）治疗前结果报告</view>
+                    <view class="uploadbox">
+                        <van-uploader file-list="{{ fileList_check }}" multiple bind:delete="deleteImg" max-count="6" name="check" 
+                        show-upload="{{showSaveBtn}}"
+                        deletable="{{showSaveBtn}}" bind:after-read="afterRead" upload-text="上传" upload-icon="{{img_host+'/upload.png'}}" />
+                    </view>
+                </view>
+                <view class="btnbox" wx:if="{{showSaveBtn}}">
+                    <view class="btn" bind:tap="save">提交</view>
+                 </view>
+            </view>
+        </van-tab>
+    </van-tabs>
+    <!-- <view class="btnbox">
+        <view class="btn" bind:tap="save">保存</view>
+    </view> -->
+</view>
+<van-popup show="{{ showTime }}" round position="bottom" custom-style="height: 50%" bind:close="cancelDate" bind:cancel="cancelDate">
+    <van-datetime-picker bind:confirm="confirmDate" title="{{time_title}}" bind:cancel="cancelDate" type="{{time_type}}" value="{{ currentDate }}" bind:input="onInput" max-date="{{ maxDate }}" min-date="{{ minDate }}" formatter="{{ formatter }}" />
+</van-popup>
+
+
+<dialog showDialog="{{showAttention}}" showCancel="{{false}}" bind:confirm="onConfirmAttention" title="注意" confirmText="马上去完善" message="信息并未完善，请继续填写"></dialog>
+<dialog showDialog="{{showTip}}" showCancel="{{false}}" bind:confirm="onConfirmTip" title="注意" confirmText="确定" message="所提交病例治疗时间需要在2024年度"></dialog>
+<dialog showDialog="{{showDel}}" showCancel="{{true}}" bind:confirm="onConfirmDel" bind:cancel="onCancelDel" title="删除记录" confirmText="确定" message="确定删除此条治疗记录吗？"></dialog>
+<dialog showDialog="{{showDraft}}" title="注意" message="是否保存草稿？" confirmText="保存" bind:confirm="onConfirmDraft" bind:cancel="onCancelDraft">
+</dialog>
+<dialog showDialog="{{showUseDraft}}" title="提示" message="加载上次草稿？" showCancel="{{false}}" confirmText="确定" bind:confirm="onConfirmUseDraft" bind:cancel="onCancelUseDraft">
+</dialog>
+<van-popup show="{{ showType }}" round position="bottom" custom-style="height: 50%">
+    <van-picker columns="{{ columns }}" default-index="{{case.caseType}}" title="请选择病例类型" bind:cancel="onCancelType" show-toolbar bind:confirm="onConfirmType" />
+
+</van-popup>

case/pages/createCase/createCase.wxss

@@ -0,0 +1,351 @@
+/* case/pages/createCase/createCase.wxss */
+page{
+    overflow: hidden;
+}
+.page{
+    overflow: hidden;
+    background: #F7F9F9;
+    flex:1;
+    display: flex;
+    flex-direction: column;
+    margin-top: 172rpx;
+}
+.van-tab__pane{
+    flex:1;
+  }
+  .tabbox{
+    flex:1;
+  width:100%;
+    height:100%;
+  }
+  
+  .van-tabs{
+    width:100%;
+  }
+  
+.van-tabs__line{
+    width: 40rpx!important;
+     height: 8rpx!important;
+    background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+}
+.van-tabs__wrap{
+    padding-bottom: 10rpx;
+    border-bottom: 1rpx solid #E3E4E5;
+}
+.basic{
+    position: relative;
+  height:calc( 100vh - 172rpx - 100rpx);
+  overflow-y: scroll;
+  margin-bottom: 120rpx;
+  -webkit-overflow-scrolling: touch;
+}
+.basic.active{
+    margin-bottom:0rpx;
+}
+.basic .row{
+    margin:0 32rpx;
+    padding:32rpx 0;
+    display: flex;
+    border-bottom: 1rpx solid rgba(0,0,0,0.1);
+    justify-content: space-between;
+}
+.basic .row:last-child{
+    border-bottom: none;
+}
+.basic .row .ipt{
+    text-align: right;
+}
+.placeholder{
+    font-size: 32rpx;
+    font-weight: 400;
+    color: rgba(0,0,0,0.25);
+}
+.basic .row .left{
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+}
+.basic .row .right{
+    display: flex;
+    align-items: center;  
+}
+.basic .row .left .red{
+    margin-top: 8rpx;
+    margin-left: 6rpx;
+    color: #FF4D4F;
+}
+.righticon{
+    margin-top: 4rpx;
+}
+.uploadbox{
+margin-top: 24rpx;
+}
+.basic .tip{
+    line-height: 44rpx;
+    margin:0 32rpx;
+    padding:24rpx 0;
+    font-size: 28rpx;
+    font-weight: 400;
+    color: rgba(0,0,0,0.45);
+}
+.recordcon{
+    background-color: #fff;
+    padding-bottom: 28rpx;
+}
+.van-cell {
+    padding:10px 0 !important;
+}
+.van-field__word-limit{
+    color: rgba(0,0,0,0.25)!important;
+}
+
+.record .title{
+    background: #F7F9F9;
+    padding:0 32rpx;
+    height: 92rpx;
+    font-size: 32rpx;
+  font-weight: 500;
+color: rgba(0,0,0,0.85);
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+.titlename{
+    display: flex;
+    align-items: center; 
+}
+.record .bar{
+    margin-right: 12rpx;
+    width: 8rpx;
+height: 32rpx;
+background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+border-radius: 4rpx;
+}
+.basic .record .row{
+    border-bottom: 1rpx solid rgba(0,0,0,0.1);
+}
+.row .time{
+    display: flex;
+    align-items: center;
+    font-size: 32rpx;
+    font-weight: 400;
+    color: rgba(0,0,0,0.85); 
+}
+.addrecord{
+    width:100%;
+
+   
+    display:flex;
+    align-items: center;
+    font-size: 32rpx;
+   text-align: center;
+    color: #3881F7;
+    justify-content: center;
+}
+.recordText{
+    margin-left: 10rpx;
+}
+.savebtn{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 32rpx;
+font-weight: 500;
+color: #FFFFFF;
+height: 88rpx;
+background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+border-radius: 8rpx;
+}
+.bottom{
+    left:32rpx;
+    right:32rpx;
+    position: fixed;
+    bottom:20rpx;
+}
+.record .left{
+    color: rgba(0,0,0,0.65);
+}
+.message{
+    height: 72rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: #3881F7;
+    font-size: 28rpx;
+padding:0 32rpx;
+font-weight: 400;
+color: #FFFFFF; 
+}
+.rederror{
+    font-size: 28rpx;
+    font-weight: 400;
+    color: #FF4D4F; 
+}
+/* .van-uploader__wrapper,.van-uploader__preview-image,.van-uploader__preview{
+    border-radius: 10rpx;
+    overflow: hidden; 
+} */
+.basiccon,.ziliao{
+    background-color: #fff;
+}
+.ziliao{
+    display: block!important;
+}
+.ziliao.notshowArea{
+    display: none!important;
+  }
+.van-tabs__nav{
+    width:800rpx;
+}
+.van-tab{
+  padding:0 30rpx!important;
+  flex:none!important;
+  font-size:30rpx!important
+}
+/* .van-ellipsis{
+    overflow: auto;
+} */
+.van-tabs__scroll{
+    width:750rpx;
+    overflow-x: scroll;
+}
+.van-tab--active{
+    font-weight: 500;
+    color: rgba(0,0,0,0.85)
+}
+.table{
+    margin:24rpx 32rpx 0;
+    overflow: hidden;
+    border-radius: 10rpx; 
+    border: 1rpx solid rgba(0,0,0,0.15)
+}
+.table .row{
+    border-bottom-style: dashed;
+    margin:0 24rpx;
+}
+.t_title{
+    display: flex;
+    align-items: center;
+  
+    padding:0 24rpx;
+    height: 80rpx;
+    font-size: 32rpx;
+font-weight: 500;
+color: #3881F7;
+    background: #EBF3FF;
+}
+.table .red{
+    margin-top: 8rpx;
+    margin-left: 6rpx;
+    color: #FF4D4F;
+}
+.btnbox{
+    position: fixed;
+    bottom:0;
+    z-index:9;
+    height: 120rpx;
+    left:32rpx;
+    right:32rpx;
+}
+.btnbox .btn{
+    width:100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    font-size: 32rpx;
+   font-weight: 500;
+   color: #FFFFFF;
+    height: 88rpx;
+   background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+   border-radius: 8rpx;
+}
+.van-tab--disabled{
+    color:#646566!important;
+}
+/* components/navBar.wxss */
+.ui-navigatorbar {
+    position: fixed;
+    z-index:99;
+    top: 0;
+    width: 750rpx;
+    height: 172rpx;
+    background: #F2F2F2;
+    backdrop-filter: blur(20px);
+    border-bottom: none;
+  }
+  
+  .ui-navigatorbar-back {
+    position: absolute;
+     padding-left:40rpx;
+     padding-right:40rpx;
+   
+    left: 0rpx;
+    font-size: 40rpx;
+    bottom: 20rpx;
+  }
+  
+  .ui-title {
+    position: absolute;
+    width: 350rpx;
+    height: 88rpx;
+    line-height: 56rpx;
+    font-size: 36rpx;
+    white-space: nowrap;
+    color: #000000;
+    bottom: 0;
+    left: 200rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }.van-uploader__preview-delete, .van-uploader__preview-delete:after{
+     
+    width: 18px!important;
+    height: 18px!important; 
+  }
+  .van-uploader__preview-delete-icon{
+      font-size:18px!important;
+      width: 18px;
+     height: 18px;
+     
+  }
+  .van-picker-column__item--selected,.van-picker__confirm{
+    color: #3881F7!important;
+  }
+  .textArea{
+      margin-top: 20rpx;
+      width:100%;
+      max-height: 500rpx!important;
+      font-size: 15px;
+      min-height:50rpx!important;
+      padding-bottom: 30px;
+      display: block!important;
+  }
+
+  .word{
+    white-space: pre-wrap;
+      line-height:48rpx;
+     position: absolute; 
+     bottom:20rpx;
+     color: rgba(0,0,0,0.25);
+     right:10rpx;
+  }
+  .van-picker__cancel, .van-picker__confirm{
+      font-size: 15px!important;
+  }
+  .van-picker__column:nth-child(5){
+      display: none;
+  }
+  .recordtime{
+      font-weight: bold;
+  }
+  .van-radio__icon--disabled{
+    background-color: #fff!important;
+  }
+  .van-radio__icon--disabled.van-radio__icon--checked{
+    color:#fff!important;
+    background-color: #1989fa!important;
+    border-color:#1989fa ;
+  }
+  .van-radio__label--disabled{
+    color:#000!important;
+  }

case/pages/improveInfo/improveInfo.js

@@ -0,0 +1,520 @@
+// case/pages/improveInfo/improveInfo.js
+// case/pages/register/register.js
+import {throttle} from "../../../utils/util"
+import {hostConfig} from "../../../utils/config"
+import {getArea,getHospital,getOfficeList,getPosition,needInfo,modifyInfo} from "../../../api/api"
+import {base64src} from "../../../utils/base64ToImg"
+const host=hostConfig().host;
+const app=getApp();
+Page({
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        showSuccess:false,
+        img_host:app.hostConfig().imghost,
+        showArea:false,
+        areaColumns:[
+            {
+                values: [1,2],
+                className: 'column1',
+            },
+            {
+                values: [3,4],
+                className: 'column2',
+                defaultIndex: 0
+            },
+            ],
+            hospitalColumns:[],
+            officeColumns:[],
+            positionColumns:[],
+            showHospital:false,
+            showOffice:false,
+            showPosition:false,
+        fileList:[],
+        disabled:false,
+        county_id:'',
+        hospital_name:'',
+        hospital_uuid:'',
+        mobile:'',
+        name:'',
+        uuid:'',
+        office_name:'',
+        office_uuid:'',
+        password:'',
+        position_uuid:'',
+        certificate:'',
+        certificate_img:'',
+        codeActive:true,
+        msg:'获取验证码',
+        captchaUuid:'',
+        captchaCode:'',
+        loginDevice:5,
+        imgCode:'',
+        sms:'',
+        timer:null,
+        time:59,
+        smsType:1,
+        showCrop:false,
+        width: 250, //宽度
+        height: 250, //高度
+        max_width: 300,
+        max_height: 300,
+        disable_rotate: true, //是否禁用旋转
+        disable_ratio: false, //锁定比例
+        limit_move: true, //是否限制移动
+    },
+    closeCrop(){
+        this.setData({
+          showCrop:false
+        })
+      },
+      submit() {
+        this.setData({
+          showCrop:false
+        })
+        this.cropper.getImg((obj) => {
+          this.uploadImg(obj)
+        });
+    },
+    cropperload(e) {
+      console.log('cropper加载完成');
+    },
+      initCrop(options){
+      
+        this.cropper = this.selectComponent("#image-cropper");
+    
+        
+    
+        if(options.imgSrc){
+          this.setData({
+            src: options.imgSrc
+        });
+        }
+       
+        // if(!options.imgSrc){
+        //     this.cropper.upload(); //上传图片
+        // }
+      },
+      loadimage(e) {
+        this.cropper.imgReset();
+    },
+    onConfirmSuccess(){
+        this.setData({
+            showSuccess:false
+        })
+        app.method.navigateTo({
+            url:"/case/pages/mobileLogin/mobileLogin"
+          })
+    },
+    opeArea(){
+        this.setData({
+           showArea:true
+        })
+    },
+    openOffice(){
+      this.setData({
+          showOffice:true,
+      })
+    },
+    openPosition(){
+        this.setData({
+            showPosition:true,
+        })
+      },
+    onChange(e){
+        const {value} = e.detail;
+
+        const {id}=e.currentTarget.dataset;
+        // console.log(value,id)
+        this.setData({
+            [id]: value
+        });
+    },
+    onChangeArea(event){
+        const { picker, value, index } = event.detail;
+        const provinceId=value[0].id;
+        this.handleGetArea(provinceId)
+    },
+    confirmArea(event){
+        const {value} = event.detail;
+        const countyId=value[1].id;
+        this.setData({
+            county_id:countyId,
+            showArea:false
+        });
+        this.handleGetHospital(countyId)
+    },
+    cancelArea(){
+        this.setData({
+            showArea:false
+        })
+    },
+    confirmHospital(event){
+        let {value}=event.detail;
+        this.setData({
+            showHospital:false,
+            hospital_uuid:value.uuid,
+            hospital_name:value.name
+        })
+    },
+    cancelHospital(){
+        this.setData({
+            showHospital:false
+        })
+    },
+    confirmOffice(event){
+        let {value}=event.detail;
+
+        this.setData({
+            office_name:value.officeName,
+            office_uuid:value.officeUuid,
+            showOffice:false
+        })
+    },
+    cancelOffice(){
+        this.setData({
+            showOffice:false
+        })
+    },
+    confirmPosition(event){
+        let {value}=event.detail;
+        this.setData({
+            position_uuid:value.uuid,
+            position_name:value.name,
+            showPosition:false
+        })
+    },
+    cancelPosition(){
+        this.setData({
+            showPosition:false
+        })
+    },
+   
+   
+    handleNeedInfo(){
+        let {mobile,positionColumns}=this.data;
+        needInfo(mobile).then(res=>{
+            let {certificate,certificate_img,county_id,hospital_name,hospital_uuid,name,office_name,office_uuid,position_uuid,uuid}=res;
+           let arr= positionColumns.filter((item)=>item.uuid==position_uuid);
+           console.log(arr);
+           this.setData({
+            certificate,
+            county_id,
+            certificate_img,
+            hospital_name,
+            hospital_uuid,
+            name,
+            position_name:arr.length>0?arr[0].name:'',
+            office_name,
+            office_uuid,
+            position_uuid,
+            uuid
+           })
+        })
+    },
+    handleModifyInfo:throttle(function(){
+        let {certificate,certificate_img,county_id,hospital_name,hospital_uuid,name,office_name,office_uuid,position_uuid,uuid}=this.data;
+        if(!(/^[\u4E00-\u9FA5·]{2,20}$/.test(name))){
+            wx.showToast({
+                title: `请输入您的真实姓名`,
+                icon: 'none',
+              });
+              return false;     
+          };
+          if(!hospital_uuid){
+            wx.showToast({
+                title: `请选择医院`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!office_uuid){
+            wx.showToast({
+                title: `请选择科室`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!position_uuid){
+            wx.showToast({
+                title: `请选择职称`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!certificate_img){
+            wx.showToast({
+                title: `请上传执业医师资格证或工作胸牌`,
+                icon: 'none',
+              });
+              return false;     
+          }
+        modifyInfo({
+            certificate,
+            certificate_img,
+            county_id,
+            hospital_name,
+            hospital_uuid,
+            name,
+            office_name,
+            office_uuid,
+            position_uuid,
+            uuid
+        }).then(res=>{
+            this.setData({
+                showSuccess:true,
+            })
+        })
+    }),
+    handleGetArea(id){
+       getArea({
+           parent:id
+       }).then(res=>{
+           if(id){
+                let obj='areaColumns[1].values';
+                this.setData({
+                    [obj]:res
+                })   
+           }else{
+            let obj='areaColumns[0].values';
+            this.setData({
+                [obj]:res
+            }) 
+            this.handleGetArea(res[0].id)
+           }
+         
+       }).catch(error=>{
+           console.log(error)
+       })
+    },
+     handleGetHospital(countyId){
+        getHospital(countyId).then(res=>{
+           this.setData({
+               showHospital:true,
+              hospitalColumns:res.concat({uuid:1,name:'其他医院'})
+           })
+        })
+     },
+     handleGetOffice(){
+        getOfficeList({}).then(res=>{
+            this.setData({
+                officeColumns:res
+            })
+        }).catch(error=>{
+            console.log(error)
+        })
+     },
+     handleGetPosition(){
+        getPosition().then(res=>{
+            this.setData({
+                positionColumns:res
+            })
+            this.handleNeedInfo();
+        })
+     },
+     handleSmsRegister:throttle(function(){
+         let {name,password,hospital_uuid,hospital_name,office_name,office_uuid,position_uuid,certificate,certificate_img,county_id}=this.data;
+          if(!(/^[\u4E00-\u9FA5·]{2,20}$/.test(name))){
+            wx.showToast({
+                title: `请输入您的真实姓名`,
+                icon: 'none',
+              });
+              return false;     
+          }
+        smsRegister({
+          
+            name,
+            hospital_uuid,
+            hospital_name,
+            office_name,
+            office_uuid,
+            county_id,
+            position_uuid,
+            certificate,
+            certificate_img
+        }).then(res=>{
+            this.setData({
+                showSuccess:true,
+            })     
+        })
+     }),
+    handleThrottle:throttle(function(){
+        this.getCode()
+      }),
+      handleGetCaptcha(){
+        getCaptcha().then(res=>{
+            base64src(res.captchaBase64Image,(img)=>{
+              this.setData({
+                imgCode:img,
+                captchaUuid:res.captchaUuid
+              })
+            })
+        })
+      },
+     getCode(){
+      if(this.data.disabled)return;
+      let {mobile,captchaCode,captchaUuid,loginDevice,smsType}=this.data;
+      if(!/^1[3456789]\d{9}$/.test(mobile)){
+        wx.showToast({
+          title: `请输入有效的手机号码！`,
+          icon: 'none',
+        });
+        return false;    
+      };
+      if(!captchaCode){
+        wx.showToast({
+            title: `图形验证码不能为空`,
+            icon: 'none',
+          });
+          return false;   
+      }
+      sendSms({
+        mobile,
+        captchaCode,
+        captchaUuid,
+        smsType,
+        loginDevice
+      }).then((res)=>{
+        let timer=setInterval(() => {
+          if (this.data.time == 0) {   
+            clearInterval(this.data.timer);
+            this.setData({
+              time:59,
+              msg:'重新获取验证码',
+              disabled:false,
+              codeActive:true,
+            })
+          } else {
+            let msg= this.data.time + " s 后重新发送";
+            this.setData({
+              disabled:true,
+              msg:msg,
+              codeActive:false,
+            })
+            let time=this.data.time--;
+            this.setData({
+             msg:time + " s 后重新发送"
+            })
+          }
+        }, 1000);
+    
+        this.setData({
+          timer:timer
+        })
+      }).catch(()=>{
+          this.handleGetCaptcha();
+      });
+      
+    },
+    uploadImg(file){
+        let THIS=this;
+        wx.showLoading({
+            title: '图片上传中',
+            mask: true
+          })
+       
+        // 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
+        wx.uploadFile({
+          url: host+'/user/uoloadImg', // 仅为示例，非真实的接口地址
+          filePath: file.url,
+          name: 'file',
+          formData: file,
+          success(res) {
+            let result=JSON.parse(res.data);
+           
+            if(result.code==200){
+                wx.hideLoading();
+                THIS.setData({ 
+                    certificate_img:result.data
+                 });
+            }else{
+                wx.hideLoading();
+                wx.showToast({
+                  title:result.msg,
+                  icon:'none'
+                })
+            }
+            
+          },
+          complete(res){
+            console.log(res)
+          }
+        });
+    },
+    afterRead(event) {
+        const {
+            file
+          } = event.detail;
+        this.setData({
+            showCrop:true,
+            src:file.url
+          })
+     
+      },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+        if(options.mobile){
+            this.setData({
+                mobile:options.mobile
+            })
+        }
+        //this.handleGetCaptcha();
+        this.handleGetArea('');
+        this.handleGetOffice();
+        this.handleGetPosition();
+        this.initCrop(options);
+       
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+       
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    // onShareAppMessage() {
+
+    // }
+})

case/pages/improveInfo/improveInfo.json

@@ -0,0 +1,17 @@
+{
+    "usingComponents": {
+        "van-overlay": "@vant/weapp/overlay/index",
+        "image-cropper": "../../../components/image-cropper/image-cropper",
+        "dialog":"../../../components/dialog/dialog",
+        "van-popup": "@vant/weapp/popup/index",
+        "van-picker": "@vant/weapp/picker/index",
+        "van-field": "@vant/weapp/field/index",
+        "van-cell": "@vant/weapp/cell/index",
+        "van-button": "@vant/weapp/button/index",
+        "van-image": "@vant/weapp/image/index",
+        "van-uploader": "@vant/weapp/uploader/index",
+         "van-cell-group": "@vant/weapp/cell-group/index"
+        
+    },
+    "navigationBarTitleText": "完善信息"
+}

case/pages/improveInfo/improveInfo.wxml

@@ -0,0 +1,69 @@
+<!--case/pages/improveInfo/improveInfo.wxml-->
+<!--case/pages/register/register.wxml-->
+<view class="page">
+
+     <view >
+        <van-cell-group class="group" >
+        <van-field value="{{ name }}" label="姓名" placeholder="请输入您的真实姓名"  input-align="right" placeholder-style="color:#999;font-size:15px" bind:change="onChange" data-id="name"  extra-event-params/>
+        <van-field value="{{ hospital_name }}"   label="医院" placeholder="请选择医院" right-icon="arrow" placeholder-style="color:#999;font-size:15px"
+        input-align="right" bind:tap="opeArea" readonly/>
+        <van-field value="{{ office_name }}"  
+        placeholder-style="color:#999;font-size:15px"bind:tap="openOffice"  label="科室" placeholder="请选择科室" right-icon="arrow" input-align="right"  readonly />
+        <van-field value="{{ position_name }}"  
+        placeholder-style="color:#999;font-size:15px" bind:tap="openPosition" label="职称" placeholder="请选择职称" right-icon="arrow" input-align="right"  readonly />
+        <van-field value="{{ certificate }}"   placeholder-style="color:#999;font-size:15px" label="执业证号(选填)" placeholder="请输入执业证号"  class="myclass" input-align="right"  />
+        <!-- <van-field value="{{ value }}"   label="执业医师资格证或工作胸牌" placeholder="请输入您的真实姓名" right-icon="arrow" input-align="right" bind:change="onChange" input-align="right" >
+            <view class="right" slot="input">
+                <van-image width="120rpx" height="80rpx" fit="contain" src="https://dev-wx.igandan.com/public/hcpEducation/images/default.png" />
+            </view>
+        </van-field> -->
+        <van-cell title="执业医师资格证或工作胸牌" is-link class="cert">
+            <van-uploader file-list="{{ fileList }}" bind:after-read="afterRead" class="upload"/>
+            <van-image width="120rpx" height="80rpx" fit="contain" src="{{certificate_img?certificate_img:img_host+'/default_register.png'}}"  class="cert"/>
+        </van-cell>
+        <view class="next">
+            <van-button type="primary" block bind:tap="handleModifyInfo">提交</van-button>
+        </view>
+    </van-cell-group>
+     </view>
+</view>
+<van-popup
+  show="{{ showArea }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ areaColumns }}" value-key="name" bind:change="onChangeArea" title="请选择地区" show-toolbar bind:confirm="confirmArea" bind:cancel="cancelArea"/>
+</van-popup>
+<van-popup
+  show="{{ showHospital }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ hospitalColumns }}" value-key="name" title="请选择医院" show-toolbar bind:confirm="confirmHospital" bind:cancel="cancelHospital"/>
+</van-popup>
+<van-popup
+  show="{{ showOffice }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ officeColumns }}" value-key="officeName" title="请选择科室" show-toolbar bind:confirm="confirmOffice" bind:cancel="cancelOffice"/>
+</van-popup>
+<van-popup
+  show="{{ showPosition }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ positionColumns }}" value-key="name" title="请选择职称" show-toolbar bind:confirm="confirmPosition" bind:cancel="cancelPosition"/>
+</van-popup>
+<dialog showDialog="{{showSuccess}}" showCancel="{{false}}" bind:confirm="onConfirmSuccess" title="提示" confirmText="确定" message="完善成功，请等待审核"></dialog>
+<van-overlay show="{{showCrop}}" >
+    <image-cropper id="image-cropper" bindload="cropperload" bindimageload="loadimage" bindtapcut="clickcut" limit_move="{{limit_move}}" disable_rotate="{{disable_rotate}}" width="{{width}}" height="{{height}}" imgSrc="{{src}}" angle="{{angle}}" disable_width="{{disable_width}}" max_width="{{max_width}}" max_height="{{max_height}}" disable_height="{{disable_height}}" disable_ratio="{{disable_ratio}}"></image-cropper>
+   <view class="buttonbox">
+    <button bindtap='closeCrop' type="default" class="button" size="mini">返回</button>
+    <button bindtap='submit' type="primary" class="button" size="mini">确定</button>
+   </view>
+</van-overlay>

case/pages/improveInfo/improveInfo.wxss

@@ -0,0 +1,84 @@
+/* case/pages/improveInfo/improveInfo.wxss */
+/* case/pages/register/register.wxss */
+.next{
+    margin: 40rpx 20rpx!important;
+}
+.prev{
+    margin:-20rpx 20rpx 0!important ;   
+}
+.van-field__label{
+    white-space: nowrap;
+}
+.custom-class .van-cell:last-child{
+    background-color: red;
+} 
+.van-cell__title{
+   white-space: nowrap;
+    display: flex;
+    color: #646566;
+    align-items: center;
+}
+.van-image{
+    margin-top: 10rpx;
+}
+.van-cell{
+    display: flex;
+    align-items: center;
+}
+.van-field__label,.van-cell__title{
+    position: relative;
+}
+.van-field__label::after,.cert .van-cell__title::after{
+    content: "*";
+    color:red;
+    position: absolute;
+    top:12rpx;
+    right:-14rpx;
+}
+.cert .van-cell__title::after{
+    top:4rpx;
+}
+.myclass .van-field__label::after{
+    content: "";
+}
+.upload{
+    opacity:0;
+    position: absolute;
+    z-index:99;
+}
+.cert .van-cell{
+    overflow: hidden;
+}
+.van-button{
+    border-radius: 10rpx!important;
+}
+.imgCode{
+    width:200rpx;
+   height:75.6rpx;
+}
+.custom-class{
+    min-height:43.5px !important;
+}
+.van-field__label{
+    color:#333!important;
+    padding:12rpx 0;
+    font-size: 15px!important;
+}
+.van-cell__title{
+    color:#333!important;
+    font-size: 15px!important;
+}
+.buttonbox{
+    position: absolute;
+    z-index:99;
+    display: flex;
+    width:600rpx;
+    left:50%;
+    transform: translateX(-50%);
+    justify-content: space-between;
+    bottom:50rpx;
+  }
+  .van-button--primary{
+    background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%)!important;
+    border-color:#377FF7!important
+  }

case/pages/login/login.js

@@ -0,0 +1,249 @@
+
+const app = getApp()
+import {phoneLogin} from "../../../api/api"
+import {auth} from "../../../api/auth.js"
+import {throttle} from "../../../utils/util"
+let urlHost=app.hostConfig().agreehost;
+Page({
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    message:'',
+    check: false,
+    mobile:'',
+    showSuccess:false,
+    beforeClose(action){
+    return new Promise((resolve) => {
+      if (action === 'confirm') {
+        resolve(true);
+      } else {
+        // 拦截取消操作
+        resolve(false);
+      }
+  })
+},
+    showEntryTip:false,
+    showEntryTip_second:false,
+    redirecUrl:'',
+    img_host:'https://oss.prod.applets.igandanyiyuan.com/applet/case/static'
+
+  },
+  onConfirmSuccess(){
+      let {mobile}=this.data;
+    this.setData({
+        showSuccess:false
+    })
+    app.method.navigateTo({
+        url:'/case/pages/improveInfo/improveInfo?mobile='+mobile
+    })
+  },
+  onCancelSuccess(){
+    this.setData({
+        showSuccess:false
+    })
+  },
+  handleAgree(){
+    if(!this.data.check){
+      wx.showToast({
+        title: '请同意《肝胆相照用户服务协议》!',
+        icon:'none'
+      })
+      return false
+    };
+  },
+
+  onConfirmEntry(){
+    this.setData({
+      showEntryTip:false
+    })
+    //wx.setStorageSync('hasEntry', true);
+  },
+  onCloseEntry(){
+    this.setData({
+       showEntryTip:true,
+      showEntryTip_second:true
+    })
+  },
+  onConfirmEntry_second(){
+    this.setData({
+      showEntryTip_second:false,
+    });
+    //wx.setStorageSync('hasEntry', true);
+   
+  },
+  onCloseEntry_second(){
+     wx.exitMiniProgram({success: (res) => {}})
+     this.setData({
+      showEntryTip_second:false,
+      showEntryTip:false,
+    });
+    
+   },
+   goRegister:throttle(function(){
+       app.method.navigateTo({
+           url:'/case/pages/register/register'
+       })
+   }),
+  getPhoneNumber:throttle(function(e) {
+      console.log(e.detail)
+    if (e.detail.errMsg == 'getPhoneNumber:ok'){
+         auth().then(res => {
+        phoneLogin('wx415cbcf96f4a3b27',{
+            code:e.detail.code
+        }).then((data)=>{
+            const { envVersion } = wx.getAccountInfoSync().miniProgram;
+            let token=''
+            if(envVersion=="develop" || envVersion=="trial"){
+                token="DEV_CASE_TOKEN"
+            }else{
+                token="PROD_CASE_TOKEN"
+            }
+           wx.setStorageSync(token, data.token);
+          let url=this.data.redirectUrl?this.data.redirectUrl:'/pages/index/index';
+        
+          if(url.indexOf('login')!=-1 || url.indexOf('mobileLogin')!=-1){
+            wx.reLaunch({
+                url:'/pages/index/index'
+            })
+          }else{
+            wx.reLaunch({
+              url:url
+            })
+          } 
+        }).catch(error=>{
+            if(error.code==10007){
+               this.setData({
+                 showSuccess:true,
+                 message:error.msg,
+                 mobile:error.data
+               })
+            }
+        })
+      });
+    }else if(e.detail.errMsg == 'getPhoneNumber:fail user deny'){
+      console.log('您拒绝手机号授权')
+    }else{
+      wx.showToast({
+        title: '手机号授权失败',
+        icon:'none'
+      })
+    }
+  }),
+  goMobile(){
+    let url='/case/pages/mobileLogin/mobileLogin'; 
+    let redirectUrl=this.data.redirectUrl?this.data.redirectUrl:'/pages/index/index';
+    app.method.navigateTo({
+      url: url+"?redirectUrl="+encodeURIComponent(redirectUrl)
+    })
+  },
+  goAgreement:throttle(function(event){
+    let id=event.currentTarget.dataset.id;
+    app.method.navigateTo({
+      url:"/case/pages/linkPage/linkPage?url="+encodeURIComponent(urlHost+'/basic/file/agreement.htm?id='+id)
+    })
+  }),
+  checkboxChange(event) {
+    this.setData({
+      check:  event.detail
+    })
+
+  },
+  getRedirect(urlParams){
+  
+    let url=decodeURIComponent(urlParams);
+    let index=url.indexOf("redirectUrl=");
+    let cur_url=''
+    if(index!=-1){
+      cur_url=url.substring(index+12,index.length);
+     // console.log(cur_url)
+      this.getRedirect(cur_url);
+    }else{
+      cur_url=url;
+    }   
+    return decodeURIComponent(cur_url); 
+    
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+    this.setData({
+      beforeClose: this.data.beforeClose.bind(this),
+  })
+    if(options.redirectUrl){ 
+        //console.log(decodeURIComponent(options.redirectUrl))
+      this.setData({
+        redirectUrl:"/"+decodeURIComponent(options.redirectUrl)
+      })
+    }
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    this.setData({
+      img_host:app.hostConfig().imghost
+    });
+    wx.getPrivacySetting({
+      success: res => {
+        console.log(res) // 返回结果为: res = { needAuthorization: true/false, privacyContractName: '《xxx隐私保护指引》' }
+        if (res.needAuthorization) {
+          // 需要弹出隐私协议
+          this.setData({
+            showEntryTip:true
+          })
+        } else {
+          this.setData({
+            showEntryTip:false
+          })
+          // 用户已经同意过隐私协议，所以不需要再弹出隐私协议，也能调用已声明过的隐私
+        }
+      },
+      fail: () => {},
+      complete: () => {}
+    })
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  
+})

case/pages/login/login.json

@@ -0,0 +1,10 @@
+{
+  "usingComponents": {
+    "dialog":"../../../components/dialog/dialog",
+    "van-overlay": "@vant/weapp/overlay/index",
+    "van-checkbox": "@vant/weapp/checkbox/index",
+    "van-checkbox-group": "@vant/weapp/checkbox-group/index",
+    "van-dialog": "@vant/weapp/dialog/index"
+  },
+  "navigationBarTitleText": "登录"
+}

case/pages/login/login.wxml

@@ -0,0 +1,70 @@
+<!--pages/login/login.wxml-->
+<view class="contain">
+   <view class="zhuce" bind:tap="goRegister">注册</view>
+   <view class="logobox">
+     <image src="https://img.applets.igandanyiyuan.com/applet/patient/static/logo.png"></image>
+     <text class="desc">你好！欢迎登录人工肝病例登记系统</text>
+   </view>
+   <view class="btnbox_shouquan">
+    <button type="primary"  bindtap="handleAgree" wx:if="{{check==0}}">手机号快捷登录</button>
+      <button type="primary" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber" wx:else>手机号快捷登录</button>
+      <view class="checkbox">
+         <view> 
+            <van-checkbox value="{{ check }}" bind:change="checkboxChange"></van-checkbox>
+         </view>
+         <text>我已阅读并同意协议<text class="navigator" bindtap="goAgreement" data-id="3">《肝胆相照用户注册及服务协议》、</text><text class="navigator" bindtap="goAgreement" data-id="2">《隐私协议》、</text><text class="navigator" bindtap="goAgreement"  data-id="1">《风险告知书》</text></text>
+      </view>
+   </view>
+   <view class="footer" bindtap="goMobile">输入手机号登录</view>
+</view>
+
+<van-overlay show="{{ showEntryTip }}" zIndex="9999">
+ <view class="wrapper">
+  <view class="privacyBox">
+  <view class="title">温馨提示</view>
+  <view class="entrymsg">
+    <view> 亲爱的用户，感谢您信任并使用人工肝病例登录系统！我们依据最新法律法规的要求，制定了<text class="navigator" bindtap="goAgreement" data-id="2">《隐私协议》</text>。请您仔细阅《隐私协议》，并确认了解我们对您的个人信息处理原则。</view>
+    <view>如您同意《隐私协议》，请点击“同意”开始使用我们的产品和服务。</view>
+  </view>
+<view class="btnbox">
+   <view class="cancel" bindtap="onCloseEntry">不同意</view>
+  <button id="agree-btn" 
+  plain
+  class="confirm" 
+  open-type="agreePrivacyAuthorization" bindagreeprivacyauthorization="onConfirmEntry">同意并继续</button>
+</view>
+</view>
+ </view>
+</van-overlay> 
+
+<van-overlay show="{{ showEntryTip_second }}" zIndex="99999">
+ <view class="wrapper">
+  <view class="privacyBox">
+  <view class="title">温馨提示</view>
+<view class="entrymsg" >
+ <view> 很抱歉，如您不同意《隐私协议》，可能无法继续正常使用我们的服务，请您先同意哦~</view>
+</view>
+<view class="btnbox">
+   <view class="cancel" bindtap="onCloseEntry_second">不同意</view>
+  <button id="agree-btn" 
+  plain
+  class="confirm" 
+  bindtap="onConfirmEntry_second">好的</button>
+</view>
+</view>
+ </view>
+</van-overlay> 
+
+<!-- <van-dialog
+  title="温馨提示"
+  show="{{ showEntryTip_second }}"
+  message="很抱歉，如您不同意《隐私协议》，可能无法继续正常使用我们的服务，请您先同意哦~"
+  show-cancel-button
+  confirm-button-text="好的"
+  cancel-button-text="不同意"
+  confirm-button-color="#3CC7C0"
+  bind:confirm="onConfirmEntry_second"
+  bind:cancel="onCloseEntry_second"
+>
+</van-dialog> -->
+<dialog showDialog="{{showSuccess}}"  bind:confirm="onConfirmSuccess" bind:cancel="onCancelSuccess" title="提示" confirmText="完善" message="{{message}}"></dialog>

case/pages/login/login.wxss

@@ -0,0 +1,108 @@
+/* pages/login/login.wxss */
+.contain {
+    padding: 0 30rpx 0rpx;
+    height: 100%;
+    overflow: hidden;
+    position: relative;
+}
+.logobox{display: flex;flex-direction: column;margin-top: 122rpx;}
+.logobox image{width: 275rpx;height:56rpx}
+.logobox .desc{font-size: 40rpx;margin-top: 42rpx;}
+.btnbox_shouquan{width:100%;margin-top: 280rpx;}
+.btnbox_shouquan button{display:flex;width:100%;font-size:36rpx;height: 94rpx;background: #09BB07;border-radius: 47rpx;color: #FFFFFF;align-items: center;justify-content: center;font-weight: normal;}
+.checkbox{display: flex;margin-top: 40rpx;font-size: 28rpx;align-items: flex-start;height:40rpx;}
+.checkbox view{
+    /* width: 40rpx;height:40rpx;
+    margin-right:14rpx;border-radius: 50%; */
+    display: flex;align-items: center;
+    position: relative;
+}
+.checkbox .check{width: 40rpx;height:40rpx;opacity: 0;}
+.checkbox  image{
+  left:5rpx;
+  top:4rpx;
+ position: absolute;
+ width: 40rpx;
+ height: 40rpx;
+ z-index:1;
+}
+.navigator{color: #4384FE;white-space:pre-wrap;word-break: break-all;background-color: none;font-size: 28rpx;}
+.footer{
+  height: 60rpx;
+  line-height: 60rpx;
+  width:600rpx;
+  position: absolute;
+  bottom:60rpx;
+  text-align: center;
+  left:50%;
+  transform: translateX(-50%);
+  font-size: 30rpx;
+  font-weight: 400;
+  color: #333333}
+  .entrymsg{
+    -webkit-overflow-scrolling: touch;
+      font-size: 28rpx;
+      line-height: 40rpx;
+      max-height: 60vh;
+      overflow-y: auto;
+      padding: 48rpx;
+      text-align: left;
+  }
+  .navigator{
+    color:#3CC7C0
+  }
+  .wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+  
+  }
+  .privacyBox {
+    width:90%;
+    background-color: #fff;
+    border-radius: 30rpx;
+  }
+  .privacyBox .title{
+    margin: 0;
+    text-align: center;
+    font-weight: 500;
+      line-height:24px;
+      padding-top:24px;
+      text-align: center;
+    font-size:16px;
+  }
+  .privacyBox .btnbox{
+    display: flex;
+    align-items: center;
+    border-top:1rpx solid #efefef;
+    width:100%;
+    font-size: 17px;
+  }
+  .privacyBox .btnbox .cancel{
+    flex:1;
+    height: 50px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .privacyBox .btnbox .confirm{
+    margin: 0;
+    height: 50px;
+    padding: 0;
+    color: #3CC7C0;
+    flex:1; 
+    font-size: 17px;
+    border: none!important;
+    border-left:1rpx solid #efefef!important;
+    display: flex;
+    background-color: none!important;
+    justify-content: center;
+    align-items: center;
+  }
+  .zhuce{
+      position: absolute;
+      color: rgba(0,0,0,0.65);
+      top:20rpx;
+      right:32rpx;
+  }

case/pages/mobileLogin/mobileLogin.js

@@ -0,0 +1,404 @@
+// pages/mobileLogin/mobileLogin.js
+import { smsLogin, sendSms,getCaptcha,phoneLogin} from "../../../api/api"
+const app = getApp();
+import {auth} from "../../../api/auth.js"
+import {throttle} from "../../../utils/util"
+import {base64src} from "../../../utils/base64ToImg"
+let urlHost=app.hostConfig().agreehost;
+Page({
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    showSuccess:false,
+    showEntryTip:false,
+    showEntryTip_second:false,
+    show: false,
+   check:false,
+   sms:'',
+   message:'',
+   disabled:true,
+   isActive:false,
+   codeActive:true,
+   imgCode:'',
+   mobile:'',
+   redirecUrl:'',
+   timer:null,
+   time:59,
+   msg:'获取验证码',
+   captchaUuid:'',
+   captchaCode:'',
+   loginDevice:5,
+   smsType:2,
+   img_host:app.hostConfig().imghost
+  },
+  onConfirmEntry(){
+    this.setData({
+      showEntryTip:false
+    })
+    //wx.setStorageSync('hasEntry', true);
+  },
+  onCloseEntry(){
+    this.setData({
+       showEntryTip:true,
+      showEntryTip_second:true
+    })
+  },
+  onConfirmEntry_second(){
+    this.setData({
+      showEntryTip_second:false,
+    });
+   
+  },
+  onCloseEntry_second(){
+     wx.exitMiniProgram({success: (res) => {}})
+     this.setData({
+      showEntryTip_second:false,
+      showEntryTip:false,
+    });
+    
+   },
+  onConfirmSuccess(){
+    this.setData({
+        showSuccess:false
+    })
+  },
+  onCancelSuccess(){
+    this.setData({
+        showSuccess:false
+    })
+  },
+  checkboxChange(e) {
+    this.setData({
+      check:e.detail
+    })
+  
+  },
+  getPhoneNumber:throttle(function(e) {
+    if (e.detail.errMsg == 'getPhoneNumber:ok'){
+         auth().then(res => {
+        phoneLogin('wx415cbcf96f4a3b27',{
+            code:e.detail.code
+        }).then((data)=>{
+            const { envVersion } = wx.getAccountInfoSync().miniProgram;
+            let token=''
+            if(envVersion=="develop" || envVersion=="trial"){
+                token="DEV_CASE_TOKEN"
+            }else{
+                token="PROD_CASE_TOKEN"
+            }
+           wx.setStorageSync(token, data.token);
+          let url=this.data.redirectUrl?this.data.redirectUrl:'/pages/index/index';
+        
+          if(url.indexOf('login')!=-1 || url.indexOf('mobileLogin')!=-1){
+            wx.reLaunch({
+                url:'/pages/index/index'
+            })
+          }else{
+            wx.reLaunch({
+              url:url
+            })
+          } 
+        }).catch(error=>{
+            if(error.code==10007){
+            console.log(error.msg)
+               this.setData({
+                 showSuccess:true,
+                 message:error.msg,
+                 mobile:error.data
+               })
+            }
+        })
+      });
+    }else if(e.detail.errMsg == 'getPhoneNumber:fail user deny'){
+      console.log('您拒绝手机号授权')
+    }else{
+      wx.showToast({
+        title: '手机号授权失败',
+        icon:'none'
+      })
+    }
+  }),
+  onConfirmSuccess(){
+    let {mobile}=this.data;
+  this.setData({
+      showSuccess:false
+  })
+  app.method.navigateTo({
+      url:'/case/pages/improveInfo/improveInfo?mobile='+mobile
+  })
+},
+onCancelSuccess(){
+    this.setData({
+        showSuccess:false
+    })
+  },
+  handleAgree(){
+    if(!this.data.check){
+      wx.showToast({
+        title: '请同意《用户服务协议》!',
+        icon:'none'
+      })
+      return false
+    };
+  },
+  getUserInfo(event) {
+    this.handlelogin();
+  },
+  onClose() {
+    this.setData({ show: false });
+  },
+  handleThrottle:throttle(function(){
+    this.getCode()
+  }),
+  handleGetCaptcha(){
+    getCaptcha().then(res=>{
+        base64src(res.captchaBase64Image,(img)=>{
+          this.setData({
+            imgCode:img,
+            captchaUuid:res.captchaUuid
+          })
+        })
+    })
+  },
+  goPwdLogin:throttle(function(){
+    app.method.navigateTo({
+    url:'/case/pages/pwdLogin/pwdLogin'
+    })
+}),
+  goRegister:throttle(function(){
+    app.method.navigateTo({
+    url:'/case/pages/register/register'
+    })
+}),
+  getCode(){
+      let {mobile,captchaCode,captchaUuid,loginDevice,smsType}=this.data;
+
+    if(!/^1[3456789]\d{9}$/.test(mobile)){
+      wx.showToast({
+        title: `请输入有效的手机号码！`,
+        icon: 'none',
+      });
+      return false;    
+    };
+    if(!captchaCode){
+        wx.showToast({
+            title: `图形验证码不能为空`,
+            icon: 'none',
+          });
+          return false;   
+      }
+    sendSms({
+      mobile,
+      smsType,
+      captchaCode,
+      captchaUuid,
+      loginDevice
+    }).then((res)=>{
+      let timer=setInterval(() => {
+        if (this.data.time == 0) {   
+          clearInterval(this.data.timer);
+          this.setData({
+            time:59,
+            msg:'重新获取验证码',
+            isActive:false,
+            codeActive:true,
+          })
+        } else {
+          let msg= this.data.time + " s 后重新发送";
+          this.setData({
+            isActive:true,
+            msg:msg,
+            codeActive:false,
+          })
+          let time=this.data.time--;
+          this.setData({
+           msg:time + " s 后重新发送"
+          })
+        }
+      }, 1000);
+  
+      this.setData({
+        timer:timer
+      })
+  
+    }).catch(()=>{
+        this.handleGetCaptcha();
+    });
+    
+  },
+  goLogin(){
+    let THIS=this;
+    if(!this.data.check){
+      wx.showToast({
+        title: '请同意《肝胆相照用户服务协议》!',
+        icon:'none'
+      })
+      return false
+    };
+    if(!/^1[3456789]\d{9}$/.test(this.data.mobile)){
+      wx.showToast({
+        title: `请输入有效的手机号码！`,
+        icon: 'none',
+      });
+      return false;    
+    };
+    if(!this.data.sms){
+      wx.showToast({
+        title: `请输入验证码！`,
+        icon: 'none',
+      });
+      return false;   
+    }
+
+   
+    wx.getSetting({
+      success(res) {
+        // 判断它是否为true
+        if (res.authSetting["scope.userInfo"]) {
+          THIS.handlelogin();
+        } else {
+          THIS.setData({
+            show:true
+          })
+        }
+      }
+    });
+  },
+  
+  handlelogin:throttle(function(){
+    let {sms,mobile }=this.data;
+    smsLogin({
+        sms:sms,
+        mobile
+      }).then((data)=>{
+        const { envVersion } = wx.getAccountInfoSync().miniProgram;
+        let token=''
+        if(envVersion=="develop" || envVersion=="trial"){
+            token="DEV_CASE_TOKEN"
+        }else{
+            token="PROD_CASE_TOKEN"
+        }
+       wx.setStorageSync(token, data.token);
+        let url=this.data.redirectUrl?this.data.redirectUrl:'/pages/index/index';
+        if(url.indexOf('login')!=-1 || url.indexOf('mobileLogin')!=-1 ){
+            wx.reLaunch({
+                url:'/pages/index/index'
+              })
+         
+         }else{
+            wx.reLaunch({
+                url:url
+              })
+        }
+      }).catch(error=>{
+        if(error.code==10007){
+            this.setData({
+              showSuccess:true,
+              message:error.msg,
+              mobile:error.data
+            })
+         }else{
+            this.handleGetCaptcha();
+         }
+      })
+  }),
+  goAgreement:throttle(function(event){
+    app.method.navigateTo({
+      url:"/case/pages/privacy/privacy"
+    })
+  }),
+  inputChange(e){
+    this.setData({
+      [e.target.dataset.id]: e.detail.value
+  });
+    if(e.target.dataset.id=="sms"){
+      if(e.detail.value.trim()){
+          this.setData({
+            disabled: false
+        });
+      }else{
+        this.setData({
+          disabled: true
+      });
+      }
+       
+    }
+  },
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+    this.handleGetCaptcha();
+    if(options.redirectUrl){ 
+      this.setData({
+        redirectUrl:"/"+decodeURIComponent(options.redirectUrl)
+      })
+    }
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+    wx.getPrivacySetting({
+        success: res => {
+          console.log(res) // 返回结果为: res = { needAuthorization: true/false, privacyContractName: '《xxx隐私保护指引》' }
+          if (res.needAuthorization) {
+            // 需要弹出隐私协议
+            this.setData({
+              showEntryTip:true
+            })
+          } else {
+            this.setData({
+              showEntryTip:false
+            })
+            // 用户已经同意过隐私协议，所以不需要再弹出隐私协议，也能调用已声明过的隐私
+          }
+        },
+        fail: () => {},
+        complete: () => {}
+      })
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+    clearInterval(this.data.timer);
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  
+})

case/pages/mobileLogin/mobileLogin.json

@@ -0,0 +1,13 @@
+{
+  "usingComponents": {
+    "navBar":"../../../components/navBar/navBar",
+    "dialog":"../../../components/dialog/dialog",
+    "van-overlay": "@vant/weapp/overlay/index",
+    "van-dialog": "@vant/weapp/dialog/index",
+    "van-checkbox": "@vant/weapp/checkbox/index",
+    "van-checkbox-group": "@vant/weapp/checkbox-group/index",
+    "nav":"../../../components/navBar/navBar"
+  },
+  "navigationStyle":"custom",
+  "navigationBarTitleText": "登录"
+}

case/pages/mobileLogin/mobileLogin.wxml

@@ -0,0 +1,80 @@
+<!--pages/mobileLogin/mobileLogin.wxml-->
+<navBar navName="登录"  myclass="myclass"></navBar>
+<view class="page">
+    <!-- <view class="zhuce" bind:tap="goRegister">注册</view> -->
+    <view class="logobox">
+     <image src="../../../static/title_bg.png" class="logobg"></image>
+     <text class="desc">欢迎登录</text>
+     <text class="desc" style="margin-top: 20rpx;">人工肝病例登记系统</text>
+   </view>
+    <view class="iptbox">
+      <view class="iptcell">
+        <!-- <text>+86</text> -->
+        <input type="number" value="{{mobile}}" placeholder="请输入手机号"  bindinput="inputChange" data-id="mobile"/>
+      </view>
+      <view class="iptcell">
+        <input type="text" placeholder="请输入图形验证码" class="code"  value="{{captchaCode}}" bindinput="inputChange" data-id="captchaCode"/>
+       <image src="{{imgCode}}" mode="aspectFit" class="imgCode" bind:tap="handleGetCaptcha"/>
+      </view>
+      <view class="iptcell">
+        <input type="number" placeholder="请输入短信验证码" class="code"  value="{{sms}}" bindinput="inputChange" data-id="sms"/>
+        <button class="{{codeActive?'active':''}}" plain disabled="{{isActive}}" bindtap="handleThrottle">{{msg}}</button>
+      </view>
+    </view>
+    <view class="buttonbox">
+      <view plain="true" hover-class="none" class="btn" disabled="{{disabled}}" bindtap="goLogin">登录</view>
+     
+   </view>
+   <view class="type">
+     <view class="mobileLogin" bind:tap="goPwdLogin">密码登录</view>
+     <view class="zhuce" bind:tap="goRegister">注册</view>
+   </view>
+   <view class="wechatbox">
+     <view class="chatmsg">- 手机号快捷登录 -</view>
+     <image src="../../../static/wechat.png" mode="" class="wecaht" bind:tap="handleAgree"/>
+     <button type="primary"  class="mobileAuth" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber" wx:if="{{check}}">手机号快捷登录</button >
+   </view>
+   <!-- <view class="zhuce">注册</view> -->
+   <view class="agree">
+    <van-checkbox value="{{ check }}" bind:change="checkboxChange"></van-checkbox>
+    我已阅读并同意<text class="link" bind:tap="goAgreement">《隐私协议》</text>
+   </view>
+</view>
+<dialog showDialog="{{showSuccess}}"  bind:confirm="onConfirmSuccess" bind:cancel="onCancelSuccess" title="提示" confirmText="完善" message="{{message}}"></dialog>
+
+<van-overlay show="{{ showEntryTip }}" zIndex="9999">
+ <view class="wrapper">
+  <view class="privacyBox">
+  <view class="title">温馨提示</view>
+  <view class="entrymsg">
+    <view> 亲爱的用户，感谢您信任并使用人工肝病例登录系统！我们依据最新法律法规的要求，制定了<text class="navigator" bindtap="goAgreement" data-id="2">《隐私协议》</text>。请您仔细阅《隐私协议》，并确认了解我们对您的个人信息处理原则。</view>
+    <view>如您同意《隐私协议》，请点击“同意”开始使用我们的产品和服务。</view>
+  </view>
+<view class="btnbox_xieyi">
+   <view class="cancel" bindtap="onCloseEntry">不同意</view>
+  <button id="agree-btn" 
+  plain
+  class="confirm" 
+  open-type="agreePrivacyAuthorization" bindagreeprivacyauthorization="onConfirmEntry">同意并继续</button>
+</view>
+</view>
+ </view>
+</van-overlay> 
+
+<van-overlay show="{{ showEntryTip_second }}" zIndex="99999">
+ <view class="wrapper">
+  <view class="privacyBox">
+  <view class="title">温馨提示</view>
+<view class="entrymsg" >
+ <view> 很抱歉，如您不同意《隐私协议》，可能无法继续正常使用我们的服务，请您先同意哦~</view>
+</view>
+<view class="btnbox_xieyi">
+   <view class="cancel" bindtap="onCloseEntry_second">不同意</view>
+  <button id="agree-btn" 
+  plain
+  class="confirm" 
+  bindtap="onConfirmEntry_second">好的</button>
+</view>
+</view>
+ </view>
+</van-overlay> 

case/pages/mobileLogin/mobileLogin.wxss

@@ -0,0 +1,304 @@
+/* pages/mobileLogin/mobileLogin.wxss */
+.loginbox {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  margin-top: 80rpx;
+}
+.contain {
+    padding: 0 30rpx 0rpx;
+    height: 100%;
+    overflow: hidden;
+    position: relative;
+}
+.logo {
+  width: 160rpx;
+  height: 196rpx
+}
+
+
+.iptcell {
+  width: 100%;
+  height: 112rpx;
+  align-items: center;
+  white-space: nowrap;
+  display: flex;
+  justify-content: space-between;
+  border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+
+.iptbox {
+  margin-top: 68rpx;
+}
+
+.iptcell input {
+  flex: 1;
+}
+
+.iptcell text {
+  color: rgba(0, 0, 0, 0.9);
+  font-size: 17px;
+}
+
+.iptcell .code {
+  width: 400rpx;
+  margin-left: 0;
+}
+
+.iptcell button {
+  outline: none;
+  white-space: nowrap;
+  padding: 0 10rpx;
+  height: 60rpx;
+  display: flex;
+  width: 220rpx;
+  align-items: center;
+  justify-content: center;
+  color: #3881F7;
+  background-color: transparent;
+  font-size: 26rpx;
+  
+   border: none;
+}
+
+.iptcell button[disabled] {
+  width: 280rpx !important;
+}
+
+/* .iptcell button.active {
+  color: #3CC7C0 !important; 
+   border: 1px solid #3CC7C0 !important; 
+} */
+
+.btnbox {
+ 
+  margin: 40rpx 47rpx 0;
+}
+
+.btnbox button {
+  border: none;
+  outline: none;
+  display: flex;
+  width: 100%;
+  font-size: 36rpx;
+  height: 94rpx;
+  background: #3CC7C0; 
+  border-radius: 47rpx;
+  color: #FFFFFF;
+  align-items: center;
+  justify-content: center;
+  font-weight: normal;
+}
+.btnbox button[disabled]{ 
+  color: #FFFFFF;
+  background: #8addd9;
+}
+.checkbox {
+  display: flex;
+  align-items: flex-start;
+  margin-top: 40rpx;
+  font-size: 28rpx;
+}
+
+.checkbox view {
+  display: flex;
+  align-items: center;
+  position: relative;
+}
+
+.checkbox .check {
+  width: 40rpx;
+  height: 40rpx;
+  opacity: 0;
+}
+
+.checkbox image {
+  left: 5rpx;
+  top: 4rpx;
+  position: absolute;
+  width: 40rpx;
+  height: 40rpx;
+  z-index: -1;
+}
+
+.navigator {
+  color: #4384FE;
+  white-space: pre-wrap;
+  word-break: break-all;
+  background-color: none;
+  font-size: 28rpx;
+}
+.imgCode{
+     width:200rpx;
+    height:75.6rpx;
+}
+page{
+    background-image: linear-gradient( #cdf0ff,#fff 40%);
+}
+.myclass{
+    background-color: transparent!important;
+}
+.page{
+    position: relative;
+    flex:1;
+    display: flex;
+    position: relative;
+    flex-direction: column;
+    margin-top: 172rpx;
+}
+.logobox{display: flex;flex-direction: column;margin: 40rpx 47rpx 0;position: relative;}
+.logobox .desc{
+position: relative;
+z-index: 1;
+    margin-top: 22rpx;
+    font-size: 48rpx;
+font-weight: 500;
+color: rgba(0,0,0,0.85);
+}
+.logobg{
+    left:90rpx;
+    top:76rpx;
+    z-index:0;
+position: absolute;
+ width:228rpx;
+ height:22rpx;   
+}
+.iptbox{
+    margin:70rpx 47rpx 0;
+}
+.buttonbox{
+    margin:64rpx 47rpx 0;
+}
+.btn{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 88rpx;
+    background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+    border-radius: 44rpx;
+    font-size: 32rpx;
+font-weight: 500;
+color: #FFFFFF;
+}
+.iptcell {
+    width: 100%;
+    height: 112rpx;
+    align-items: center;
+    white-space: nowrap;
+    display: flex;
+    justify-content: space-between;
+    border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+.type{
+    margin:24rpx 47rpx 0;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+.mobileLogin,.zhuce{
+    font-size: 28rpx;
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    color: rgba(0,0,0,0.65);  
+}
+.wechatbox{
+    flex:1;
+    position: relative;
+    margin:44rpx 47rpx 100rpx;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+.chatmsg{
+    font-size: 28rpx;
+
+font-weight: 400;
+color: rgba(0,0,0,0.45);
+}
+.wecaht{
+    margin-top: 42rpx;
+  width:88rpx;
+  height:88rpx;  
+}
+
+.agree{
+    position: absolute;
+    bottom:40rpx;
+    margin:54rpx 47rpx 0;
+    display: flex;
+    font-size: 28rpx;
+font-weight: 400;
+display: flex;
+align-items: center;
+color: rgba(0,0,0,0.65);
+}
+.link{
+    color:#3881F7  
+}
+.mobileAuth{
+    top:50%;
+    left:50%;
+    margin-top: -10rpx;
+    transform: translate(-50%);
+    opacity: 0;
+    position: absolute;
+}
+.wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+  
+  }
+  .privacyBox {
+    width:90%;
+    background-color: #fff;
+    border-radius: 30rpx;
+  }
+  .privacyBox .title{
+    margin: 0;
+    text-align: center;
+    font-weight: 500;
+      line-height:24px;
+      padding-top:24px;
+      text-align: center;
+    font-size:16px;
+  }
+  .privacyBox .btnbox_xieyi{
+    display: flex;
+    align-items: center;
+    border-top:1rpx solid #efefef;
+    width:100%;
+    font-size: 17px;
+  }
+  .privacyBox .btnbox_xieyi .cancel{
+    flex:1;
+    height: 50px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .privacyBox .btnbox_xieyi .confirm{
+    margin: 0;
+    height: 50px;
+    padding: 0;
+    color: #3881F7;
+    flex:1; 
+    font-size: 17px;
+    border: none!important;
+    border-left:1rpx solid #efefef!important;
+    display: flex;
+    background-color: none!important;
+    justify-content: center;
+    align-items: center;
+  }
+  .entrymsg{
+    -webkit-overflow-scrolling: touch;
+      font-size: 28rpx;
+      line-height: 40rpx;
+      max-height: 60vh;
+      overflow-y: auto;
+      padding: 48rpx;
+      text-align: left;
+  }

case/pages/paintCanvas/paintCanvas.js

@@ -0,0 +1,222 @@
+import utils from "../../utils/utils";
+// painting-2.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    hasChoosedImg: false,
+    canvasWidth: 0,
+    canvasHeight: 0, // canvas的完整高度
+    canvasHeightLen: 0, // canvas的临时高度（用在操作栏影响画布高度时）
+    windowHeight: 0, // 屏幕高度
+    prevPosition: [0, 0], // 手指触摸的所在位置
+    background: '', // 背景图片，即导入的图片
+
+    btnInfo: [
+      {
+        type: 'width',
+        background: 'url("http://ov8a2tdri.bkt.clouddn.com/wx-app/icon-1.png"); background-size: 30px 30px;'
+      },
+      {
+        type: 'color',
+        background: 'url("http://ov8a2tdri.bkt.clouddn.com/wx-app/icon-2.png") white no-repeat; background-size: 24px 24px;background-position: 3px 3px;'
+      },
+      {
+        type: 'clear',
+        background: 'url("http://img0.imgtn.bdimg.com/it/u=1358545290,3102156418&fm=26&gp=0.jpg") white no-repeat; background-size: 20px 20px;background-position: 5px 5px;'
+      },
+      {
+        type: 'save',
+        background: 'url("http://ov8a2tdri.bkt.clouddn.com/wx-app/icon-6.png") white no-repeat; background-size: 20px 20px;background-position: 5px 5px;'
+      }
+    ],
+    width: false, // 是否开启宽度调整栏
+    color: false, // 是否开启颜色调整栏
+    r: 33,
+    g: 33,
+    b: 33,
+    w: 10,
+    clear: false, // 是否开启清空栏
+    eraser: false, // 是否开启橡皮擦
+    saving: false, // 是否在保存状态
+    scope: false, // 是否有保存图片的权限
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    let that = this;
+    // 获取设备信息，canvas高度用
+    wx.getSystemInfo({
+      success: function(res) {
+        console.log(res);
+        that.setData({
+          canvasWidth: res.windowWidth,
+          canvasHeight: res.windowHeight - 50,
+          windowHeight: res.windowHeight
+        })
+      },
+    })
+    // 选照片
+    this.chooseImg();
+    // 检查权限，保存时提示弹窗用
+    wx.getSetting({
+      success(res) {
+        if (res.authSetting['scope.writePhotosAlbum']) {
+          that.setData({
+            scope: true,
+          })
+        }
+      }
+    })
+  },
+
+  tapBtn: function (e) {
+    utils.tapBtn(e, this, 2);
+  },
+
+  addImg: function (e) {
+    this.chooseImg();
+  },
+
+  chooseImg() {
+    let that = this;
+    wx.chooseImage({
+      success: function (res) {
+        that.setData({
+          hasChoosedImg: true,
+        })
+        wx.getImageInfo({
+          src: res.tempFilePaths[0],
+          success: function (res) {
+            // 获取图片信息，主要为宽高，选择合适的自适应方式（将最大边完整显示）
+            let [height, width] = [that.data.canvasWidth / res.width * res.height, that.data.canvasWidth];
+            if (height > that.data.windowHeight - 50) {
+              height = that.data.windowHeight - 50;
+              width = height / res.height * res.width;
+            }
+            that.setData({
+              canvasHeight: height,
+              canvasWidth: width,
+              background: res.path
+            });
+          }
+        })
+      },
+      fail: function (res) {
+        console.log(res);
+      }
+    })
+  },
+
+  touchStart: function (e) {
+    // 开始画图，隐藏所有的操作栏
+    this.setData({
+      prevPosition: [e.touches[0].x, e.touches[0].y],
+      width: false,
+      color: false,
+      canvasHeightLen: 0
+    })
+  },
+
+  touchMove: function (e) {
+    // 触摸移动，绘制中。。。
+    let ctx = wx.createCanvasContext('myCanvas');
+
+    if (this.data.eraser) {
+      ctx.clearRect(e.touches[0].x, e.touches[0].y, 30, 30);
+      ctx.draw(true);
+    } else {
+      ctx.setStrokeStyle("rgb(" + this.data.r + ', ' + this.data.g + ', ' + this.data.b + ')');
+      ctx.setLineWidth(this.data.w);
+      ctx.setLineCap('round');
+      ctx.setLineJoin('round');
+      ctx.moveTo(this.data.prevPosition[0], this.data.prevPosition[1]);
+      ctx.lineTo(e.touches[0].x, e.touches[0].y);
+      ctx.stroke();
+      ctx.draw(true);
+    }
+
+    this.setData({
+      prevPosition: [e.touches[0].x, e.touches[0].y]
+    })
+  },
+
+  clearCanvas: function () {
+    let ctx = wx.createCanvasContext('myCanvas');
+    ctx.clearRect(0, 0, this.data.canvasWidth, this.data.canvasHeight);
+    ctx.draw();
+    this.setData({
+      clear: false,
+      canvasHeightLen: 0
+    })
+  },
+
+  chooseEraser: function () {
+    this.setData({
+      eraser: !this.data.eraser,
+      clear: false,
+      canvasHeightLen: 0
+    })
+  },
+
+  changeColor: function (e) {
+    utils.changeColor(e, this);
+  },
+
+  changeWidth: function (e) {
+    utils.changeWidth(e, this, (this.data.canvasHeightLen + this.data.w - e.detail.value), 2);
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+  
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+  
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+  
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+  
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function () {
+  
+  }
+})

case/pages/paintCanvas/paintCanvas.json

@@ -0,0 +1,6 @@
+{
+"navigationBarTitleText": "涂鸦",
+  "navigationBarBackgroundColor": "#9cf",
+  "navigationBarTextStyle": "white",
+    "usingComponents": {}
+}

case/pages/paintCanvas/paintCanvas.wxml

@@ -0,0 +1,31 @@
+<!--painting-2.wxml-->
+<canvas canvas-id="myCanvas" disable-scroll="true" bindtouchstart="touchStart"
+  bindtouchmove="touchMove" bindtouchend="touchEnd" wx:if="{{hasChoosedImg}}"
+  style="height: {{(canvasHeightLen == 0) ? canvasHeight : canvasHeightLen}}px; width: {{canvasWidth}}px; background: url('{{background}}');background-position: 0 0; background-size: {{canvasWidth}}px {{canvasHeight}}px" 
+/>
+<view class="failText" wx:if="{{!hasChoosedImg}}" bindtap="addImg">没有选择照片，点击重新选择</view>
+<view class="bottom">
+  <block wx:for="{{btnInfo}}" wx:key="{{index}}">
+    <view class="list-item" data-type="{{item.type}}" style="background: {{item.background}}" bindtap="tapBtn"></view>
+  </block>
+</view>
+<view class="choose-box" wx:if="{{width}}">
+<view class="color-box" style="background: {{'rgb(' + r + ', ' + g + ', ' + b + ')'}}; height: {{w}}px; border-radius: {{w/2}}px"></view>
+  <slider min="1" max="50" step="1" show-value="true" value="{{w}}" bindchange="changeWidth"/>
+</view>
+<view class="choose-box" wx:if="{{color}}">
+  <view class="color-box" style="background: {{'rgb(' + r + ', ' + g + ', ' + b + ')'}}; height: {{w}}px; border-radius: {{w/2}}px"></view>
+  <slider min="0" max="255" step="1" show-value="true" activeColor="red" value="{{r}}" data-color="r" bindchange="changeColor"/>
+  <slider min="0" max="255" step="1" show-value="true" activeColor="green" value="{{g}}" data-color="g" bindchange="changeColor"/>
+  <slider min="0" max="255" step="1" show-value="true" activeColor="blue" value="{{b}}" data-color="b" bindchange="changeColor"/>
+</view>
+<view class="choose-box-flex" wx:if="{{clear}}">
+  <view class="choose-item" bindtap="chooseEraser">
+    <view class="choose-img" style='background: url("http://ov8a2tdri.bkt.clouddn.com/wx-app/icon-5.png") white no-repeat; background-size: 26px 26px;background-position: 2px 2px; border: {{eraser ? "2px solid #888" : "2px solid transparent"}}'></view>
+    <view>橡皮擦</view>
+  </view>
+  <view class="choose-item" bindtap="clearCanvas">
+    <view class="choose-img" style='background: url("http://ov8a2tdri.bkt.clouddn.com/wx-app/icon-4.png") white no-repeat; background-size: 26px 26px;background-position: 2px 2px;'></view>
+    <view>清空</view>
+  </view>
+</view>

case/pages/paintCanvas/paintCanvas.wxss

@@ -0,0 +1,59 @@
+/* case/pages/paintCanvas/paintCanvas.wxss *//* painting-2.wxss */
+page {
+    background: rgba(153, 204, 255, 0.1);
+  }
+  
+  .failText {
+    margin-top: 200rpx;
+    text-align: center;
+    color: #888;
+  }
+  
+  .bottom {
+    width: 750rpx;
+    height: 100rpx;
+    position: absolute;
+    bottom: 0;
+    display: flex;
+    justify-content: space-around;
+  }
+  
+  .list-item {
+    width: 60rpx;
+    height: 60rpx;
+    margin: 20rpx 0;
+    border-radius: 50%;
+  }
+  
+  .choose-box {
+    width: 750rpx;
+    position: absolute;
+    bottom: 100rpx;
+  }
+  
+  .color-box {
+    width: 375rpx;
+    margin: 40rpx auto;
+  }
+  
+  slider {
+    margin: 40rpx 60rpx;
+  }
+  
+  .choose-box-flex {
+    display: flex;
+    justify-content: space-around;
+    width: 750rpx;
+    position: absolute;
+    bottom: 100rpx;
+    font-size: 32rpx;
+    color: #666;
+    text-align: center;
+  }
+  .choose-img {
+    width: 60rpx;
+    height: 60rpx;
+    margin: 20rpx;
+    border-radius: 50%;
+    background: white;
+  }

case/pages/privacy/privacy.js

@@ -0,0 +1,72 @@
+// case/pages/privacy/privacy.js
+import {getPrivacy} from "../../../api/api"
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        navName:'隐私协议',
+        node:''
+    },
+    handleGetPrivacy(){
+        getPrivacy().then(res=>{
+          this.setData({
+               node:res
+          })
+        })
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+        this.handleGetPrivacy();
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+   
+})

case/pages/privacy/privacy.json

@@ -0,0 +1,6 @@
+{
+    "usingComponents": {
+        "navBar":"../../../components/navBar/navBar"
+    },
+    "navigationStyle":"custom"
+}

case/pages/privacy/privacy.wxml

@@ -0,0 +1,10 @@
+<!--case/pages/privacy/privacy.wxml-->
+<!--case/pages/agreement/agreement.wxml-->
+<navBar navName="{{navName}}"></navBar>
+<view class="page">
+  
+  <view class="con">
+    <rich-text nodes="{{node}}"></rich-text>
+  </view>
+ 
+</view>

case/pages/privacy/privacy.wxss

@@ -0,0 +1,15 @@
+/* case/pages/privacy/privacy.wxss */
+/* case/pages/agreement/agreement.wxss */
+.page{
+    background: #fff;
+    flex:1;
+    display: flex;
+    position: relative;
+    flex-direction: column;
+    margin-top: 172rpx;
+}
+.con{
+    flex:1;
+    padding:10rpx 32rpx 0;
+    margin-bottom: 20rpx;
+}

case/pages/pwdLogin/pwdLogin.js

@@ -0,0 +1,255 @@
+// case/pages/pwdLogin/pwdLogin.js
+const app = getApp()
+import {phoneLogin,getCaptcha,pwdLogin} from "../../../api/api"
+import {auth} from "../../../api/auth.js"
+import {throttle} from "../../../utils/util"
+import {base64src} from "../../../utils/base64ToImg"
+let urlHost=app.hostConfig().agreehost;
+
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        checked:false,
+        mobile:'',
+        pwd:'',
+        loginDevice:5,
+        showSuccess:false,
+        redirecUrl:'',
+        imgCode:'',
+        captchaUuid:'',
+        captchaCode:'',
+    },
+    inputChange(e){
+        this.setData({
+          [e.target.dataset.id]: e.detail.value
+      });
+    },
+    goAgreement:throttle(function(event){
+        app.method.navigateTo({
+          url:"/case/pages/privacy/privacy"
+        })
+      }),
+      goRegister:throttle(function(){
+        app.method.navigateTo({
+        url:'/case/pages/register/register'
+        })
+    }),
+    handleGetCaptcha(){
+        getCaptcha().then(res=>{
+            base64src(res.captchaBase64Image,(img)=>{
+              this.setData({
+                imgCode:img,
+                captchaUuid:res.captchaUuid
+              })
+            })
+        })
+      },
+    handlePwdLogin:throttle(function(){
+        let {mobile,pwd,loginDevice,captchaUuid,captchaCode,checked}=this.data;
+        if(!checked){
+            wx.showToast({
+                title: '请同意《用户服务协议》!',
+                icon:'none'
+              })
+              return false
+        };
+        if(!captchaCode){
+            wx.showToast({
+                title: '请输入图形验证码',
+                icon:'none'
+              })
+              return false
+        }
+        if(!pwd){
+            wx.showToast({
+                title: '请输入密码',
+                icon:'none'
+              })
+              return false
+        }
+        pwdLogin({
+            mobile,
+            pwd,
+            loginDevice,
+            captchaUuid,
+            captchaCode
+
+        }).then(data=>{
+            const { envVersion } = wx.getAccountInfoSync().miniProgram;
+            let token=''
+            if(envVersion=="develop" || envVersion=="trial"){
+                token="DEV_CASE_TOKEN"
+            }else{
+                token="PROD_CASE_TOKEN"
+            }
+           wx.setStorageSync(token, data.token);
+          let url=this.data.redirectUrl?this.data.redirectUrl:'/pages/index/index';
+        
+          if(url.indexOf('login')!=-1 || url.indexOf('mobileLogin')!=-1){
+            wx.reLaunch({
+                url:'/pages/index/index'
+            })
+          }else{
+            wx.reLaunch({
+              url:url
+            })
+          } 
+        }).catch(error=>{
+            if(error.code==10007){
+               this.setData({
+                 showSuccess:true,
+                 message:error.msg,
+                 mobile:error.data
+               })
+            }else{
+                this.handleGetCaptcha();
+            }
+        })
+    }),
+    getPhoneNumber:throttle(function(e) {
+      if (e.detail.errMsg == 'getPhoneNumber:ok'){
+           auth().then(res => {
+          phoneLogin('wx415cbcf96f4a3b27',{
+              code:e.detail.code
+          }).then((data)=>{
+              const { envVersion } = wx.getAccountInfoSync().miniProgram;
+              let token=''
+              if(envVersion=="develop" || envVersion=="trial"){
+                  token="DEV_CASE_TOKEN"
+              }else{
+                  token="PROD_CASE_TOKEN"
+              }
+             wx.setStorageSync(token, data.token);
+            let url=this.data.redirectUrl?this.data.redirectUrl:'/pages/index/index';
+          
+            if(url.indexOf('login')!=-1 || url.indexOf('mobileLogin')!=-1){
+              wx.reLaunch({
+                  url:'/pages/index/index'
+              })
+            }else{
+              wx.reLaunch({
+                url:url
+              })
+            } 
+          }).catch(error=>{
+              if(error.code==10007){
+                 this.setData({
+                   showSuccess:true,
+                   message:error.msg,
+                   mobile:error.data
+                 })
+              }
+          })
+        });
+      }else if(e.detail.errMsg == 'getPhoneNumber:fail user deny'){
+        console.log('您拒绝手机号授权')
+      }else{
+        wx.showToast({
+          title: '手机号授权失败',
+          icon:'none'
+        })
+      }
+    }),
+    onConfirmSuccess(){
+        let {mobile}=this.data;
+      this.setData({
+          showSuccess:false
+      })
+      app.method.navigateTo({
+          url:'/case/pages/improveInfo/improveInfo?mobile='+mobile
+      })
+    },
+    onCancelSuccess(){
+        this.setData({
+            showSuccess:false
+        })
+      },
+    goMobile(){
+        let url='/case/pages/mobileLogin/mobileLogin'; 
+        let redirectUrl=this.data.redirectUrl?this.data.redirectUrl:'/pages/index/index';
+        app.method.navigateTo({
+          url: url+"?redirectUrl="+encodeURIComponent(redirectUrl)
+        })
+      },
+    
+    handleAgree(){
+        if(!this.data.checked){
+          wx.showToast({
+            title: '请同意《用户服务协议》!',
+            icon:'none'
+          })
+          return false
+        };
+      },
+    onChange(event) {
+        this.setData({
+          checked: event.detail,
+        })
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+        if(options.redirectUrl){ 
+            if(options.redirectUrl){
+                this.setData({
+                  redirectUrl:decodeURIComponent(options.redirectUrl)
+                })
+              };
+            //console.log(decodeURIComponent(options.redirectUrl))
+         
+        }
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+        this.handleGetCaptcha();
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    // onShareAppMessage() {
+
+    // }
+})

case/pages/pwdLogin/pwdLogin.json

@@ -0,0 +1,10 @@
+{
+    "usingComponents": {
+        "dialog":"../../../components/dialog/dialog",
+        "navBar":"../../../components/navBar/navBar",
+        "van-checkbox": "@vant/weapp/checkbox/index",
+        "van-checkbox-group": "@vant/weapp/checkbox-group/index"
+    },
+    "navigationStyle":"custom",
+    "navigationBarTitleText": "登录"
+}

case/pages/pwdLogin/pwdLogin.wxml

@@ -0,0 +1,39 @@
+<!--case/pages/pwdLogin/pwdLogin.wxml-->
+<navBar navName="登录"  myclass="myclass"></navBar>
+<view class="page">
+    <view class="logobox">
+     <image src="../../../static/title_bg.png" class="logobg"></image>
+     <text class="desc">欢迎登录</text>
+     <text class="desc" style="margin-top: 20rpx;">人工肝病例登记系统</text>
+   </view>
+   <view class="iptbox">
+     <view class="iptcell">
+        <input type="text" placeholder="请输入手机号" value="{{mobile}}" data-id="mobile" bindinput="inputChange"/>
+     </view>
+     <view class="iptcell">
+        <input type="text" placeholder="请输入图形验证码" class="code"  value="{{captchaCode}}" bindinput="inputChange" data-id="captchaCode"/>
+       <image src="{{imgCode}}" mode="aspectFit" class="imgCode" bind:tap="handleGetCaptcha"/>
+      </view>
+     <view class="iptcell">
+        <input type="text" bindinput="inputChange" placeholder="请输入密码" value="{{pwd}}" data-id="pwd"/>
+     </view>
+   </view>
+   <view class="buttonbox">
+        <view class="btn" bind:tap="handlePwdLogin">登录</view>
+   </view>
+   <view class="type">
+     <view class="mobileLogin" bind:tap="goMobile">手机验证码登录</view>
+     <view class="zhuce" bind:tap="goRegister">注册</view>
+   </view>
+   <view class="wechatbox">
+     <view class="chatmsg">- 手机号快捷登录 -</view>
+     <image src="../../../static/wechat.png" mode="" class="wecaht" bind:tap="handleAgree"/>
+     <button type="primary"  class="mobileAuth" open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber" wx:if="{{checked}}">手机号快捷登录</button >
+   </view>
+   <view class="agree">
+    <van-checkbox value="{{ checked }}" bind:change="onChange"></van-checkbox>
+    我已阅读并同意<text class="link" bind:tap="goAgreement">《隐私协议》</text>
+   </view>
+</view>
+
+<dialog showDialog="{{showSuccess}}"  bind:confirm="onConfirmSuccess" bind:cancel="onCancelSuccess" title="提示" confirmText="完善" message="{{message}}"></dialog>

case/pages/pwdLogin/pwdLogin.wxss

@@ -0,0 +1,120 @@
+/* case/pages/pwdLogin/pwdLogin.wxss */
+page{
+    background-image: linear-gradient( #cdf0ff,#fff 40%);
+}
+.myclass{
+    background-color: transparent!important;
+}
+.page{
+    position: relative;
+    flex:1;
+    display: flex;
+    position: relative;
+    flex-direction: column;
+    margin-top: 172rpx;
+}
+.logobox{display: flex;flex-direction: column;margin:40rpx 47rpx 0;position: relative;}
+.logobox .desc{
+position: relative;
+z-index: 1;
+    margin-top: 22rpx;
+    font-size: 48rpx;
+font-weight: 500;
+color: rgba(0,0,0,0.85);
+}
+.logobg{
+    left:90rpx;
+    top:76rpx;
+    z-index:0;
+position: absolute;
+ width:228rpx;
+ height:22rpx;   
+}
+.iptbox{
+    margin:70rpx 47rpx 0;
+}
+.buttonbox{
+    margin:64rpx 47rpx 0;
+}
+.btn{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 88rpx;
+    background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+    border-radius: 44rpx;
+    font-size: 32rpx;
+font-weight: 500;
+color: #FFFFFF;
+}
+.iptcell {
+    width: 100%;
+    height: 112rpx;
+    align-items: center;
+    white-space: nowrap;
+    display: flex;
+    justify-content: space-between;
+    border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);
+}
+.imgCode{
+    width:200rpx;
+   height:75.6rpx;
+}
+.iptcell .code {
+    width: 400rpx;
+    margin-left: 0;
+  }
+.type{
+    margin:24rpx 47rpx 0;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+}
+.mobileLogin,.zhuce{
+    font-size: 28rpx;
+    font-family: PingFangSC, PingFang SC;
+    font-weight: 400;
+    color: rgba(0,0,0,0.65);  
+}
+.wechatbox{
+    flex:1;
+    position: relative;
+    margin:44rpx 47rpx 100rpx;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+}
+.chatmsg{
+    font-size: 28rpx;
+
+font-weight: 400;
+color: rgba(0,0,0,0.45);
+}
+.wecaht{
+    margin-top: 42rpx;
+  width:88rpx;
+  height:88rpx;  
+}
+
+.agree{
+    position: absolute;
+    bottom:40rpx;
+    margin:54rpx 47rpx 0;
+    display: flex;
+    align-items: center;
+    font-size: 28rpx;
+font-weight: 400;
+color: rgba(0,0,0,0.65);
+}
+.link{
+    color:#3881F7  
+}
+.mobileAuth{
+    top:50%;
+    left:50%;
+    margin-top: -10rpx;
+    transform: translate(-50%);
+    opacity: 0;
+    position: absolute;
+}

case/pages/register/register.js

@@ -0,0 +1,533 @@
+// case/pages/register/register.js
+import {throttle} from "../../../utils/util"
+import {hostConfig} from "../../../utils/config"
+import {getArea,getHospital,getOfficeList,getPosition,smsRegister,sendSms,getCaptcha} from "../../../api/api"
+import {base64src} from "../../../utils/base64ToImg"
+const host=hostConfig().host;
+const app=getApp();
+Page({
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        showImprove:false,
+        showSuccess:false,
+        img_host:app.hostConfig().imghost,
+        showArea:false,
+        areaColumns:[
+            {
+                values: [1,2],
+                className: 'column1',
+            },
+            {
+                values: [3,4],
+                className: 'column2',
+                defaultIndex: 0
+            },
+            ],
+            hospitalColumns:[],
+            officeColumns:[],
+            positionColumns:[],
+            showHospital:false,
+            showOffice:false,
+            showPosition:false,
+        showNext:false,
+        fileList:[],
+        disabled:false,
+        county_id:'',
+        hospital_name:'',
+        hospital_uuid:'',
+        mobile:'',
+        name:'',
+        office_name:'',
+        office_uuid:'',
+        password:'',
+        position_uuid:'',
+        certificate:'',
+        certificate_img:'',
+        codeActive:true,
+        msg:'获取验证码',
+        captchaUuid:'',
+        captchaCode:'',
+        loginDevice:5,
+        imgCode:'',
+        sms:'',
+        timer:null,
+        time:59,
+        smsType:1,
+        showCrop:false,
+        width: 250, //宽度
+        height: 250, //高度
+        max_width: 300,
+        max_height: 300,
+        disable_rotate: true, //是否禁用旋转
+        disable_ratio: false, //锁定比例
+        limit_move: true, //是否限制移动
+    },
+    closeCrop(){
+        this.setData({
+          showCrop:false
+        })
+      },
+      submit() {
+        this.setData({
+          showCrop:false
+        })
+        this.cropper.getImg((obj) => {
+          this.uploadImg(obj)
+        });
+    },
+    cropperload(e) {
+      console.log('cropper加载完成');
+    },
+      initCrop(options){
+      
+        this.cropper = this.selectComponent("#image-cropper");
+    
+        
+    
+        if(options.imgSrc){
+          this.setData({
+            src: options.imgSrc
+        });
+        }
+       
+        // if(!options.imgSrc){
+        //     this.cropper.upload(); //上传图片
+        // }
+      },
+      loadimage(e) {
+        this.cropper.imgReset();
+    },
+    onConfirmSuccess(){
+        this.setData({
+            showSuccess:false
+        })
+        app.method.navigateTo({
+            url:"/case/pages/mobileLogin/mobileLogin"
+          })
+    },
+    opeArea(){
+        this.setData({
+           showArea:true
+        })
+    },
+    openOffice(){
+      this.setData({
+          showOffice:true,
+      })
+    },
+    openPosition(){
+        this.setData({
+            showPosition:true,
+        })
+      },
+    onChange(e){
+        const {value} = e.detail;
+
+        const {id}=e.currentTarget.dataset;
+        // console.log(value,id)
+        this.setData({
+            [id]: value
+        });
+    },
+    onChangeArea(event){
+        const { picker, value, index } = event.detail;
+        const provinceId=value[0].id;
+        this.handleGetArea(provinceId)
+    },
+    confirmArea(event){
+        const {value} = event.detail;
+        const countyId=value[1].id;
+        this.setData({
+            county_id:countyId,
+            showArea:false
+        });
+        this.handleGetHospital(countyId)
+    },
+    cancelArea(){
+        this.setData({
+            showArea:false
+        })
+    },
+    confirmHospital(event){
+        let {value}=event.detail;
+        this.setData({
+            showHospital:false,
+            hospital_uuid:value.uuid,
+            hospital_name:value.name
+        })
+    },
+    cancelHospital(){
+        this.setData({
+            showHospital:false
+        })
+    },
+    confirmOffice(event){
+        let {value}=event.detail;
+
+        this.setData({
+            office_name:value.officeName,
+            office_uuid:value.officeUuid,
+            showOffice:false
+        })
+    },
+    cancelOffice(){
+        this.setData({
+            showOffice:false
+        })
+    },
+    confirmPosition(event){
+        let {value}=event.detail;
+        this.setData({
+            position_uuid:value.uuid,
+            position_name:value.name,
+            showPosition:false
+        })
+    },
+    cancelPosition(){
+        this.setData({
+            showPosition:false
+        })
+    },
+    goNext(){
+        let {mobile,sms,password,captchaCode}=this.data;
+        if(!/^1[3456789]\d{9}$/.test(mobile)){
+           wx.showToast({
+             title: `请输入有效的手机号码！`,
+             icon: 'none',
+           });
+           return false;    
+         };
+         if(!captchaCode){
+           wx.showToast({
+               title: `请输入图形验证码`,
+               icon: 'none',
+             });
+             return false;     
+         }
+         if(!sms){
+           wx.showToast({
+               title: `请输入短信验证码`,
+               icon: 'none',
+             });
+             return false;     
+         }
+         if(!(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/.test(password))){
+           wx.showToast({
+               title: `请输入6-16位字母、数字组合密码！`,
+               icon: 'none',
+             });
+             return false;     
+         }
+        this.setData({
+            showNext:true
+        })
+    },
+    showNext(){
+        this.setData({
+            showNext:false
+        })
+    },
+    handleGetArea(id){
+       getArea({
+           parent:id
+       }).then(res=>{
+           if(id){
+                let obj='areaColumns[1].values';
+                this.setData({
+                    [obj]:res
+                })   
+           }else{
+            let obj='areaColumns[0].values';
+            this.setData({
+                [obj]:res
+            }) 
+            this.handleGetArea(res[0].id)
+           }
+         
+       }).catch(error=>{
+           console.log(error)
+       })
+    },
+     handleGetHospital(countyId){
+        getHospital(countyId).then(res=>{
+           this.setData({
+               showHospital:true,
+              hospitalColumns:res.concat({uuid:1,name:'其他医院'})
+           })
+        })
+     },
+     handleGetOffice(){
+        getOfficeList({}).then(res=>{
+            this.setData({
+                officeColumns:res
+            })
+        }).catch(error=>{
+            console.log(error)
+        })
+     },
+     handleGetPosition(){
+        getPosition().then(res=>{
+            this.setData({
+                positionColumns:res
+            })
+        })
+     },
+     handleSmsRegister:throttle(function(){
+         let {mobile,name,sms,password,captchaCode,hospital_uuid,hospital_name,office_name,office_uuid,position_uuid,certificate,certificate_img,county_id}=this.data;
+         if(!/^1[3456789]\d{9}$/.test(mobile)){
+            wx.showToast({
+              title: `请输入有效的手机号码！`,
+              icon: 'none',
+            });
+            return false;    
+          };
+          if(!captchaCode){
+            wx.showToast({
+                title: `请输入图形验证码`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!sms){
+            wx.showToast({
+                title: `请输入短信验证码`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!(/^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,16}$/.test(password))){
+            wx.showToast({
+                title: `请输入6-16位字母、数字组合密码！`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!(/^[\u4E00-\u9FA5·]{2,20}$/.test(name))){
+            wx.showToast({
+                title: `请输入您的真实姓名`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!hospital_uuid){
+            wx.showToast({
+                title: `请选择医院`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!office_uuid){
+            wx.showToast({
+                title: `请选择科室`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!position_uuid){
+            wx.showToast({
+                title: `请选择职称`,
+                icon: 'none',
+              });
+              return false;     
+          }
+          if(!certificate_img){
+            wx.showToast({
+                title: `请上传执业医师资格证或工作胸牌`,
+                icon: 'none',
+              });
+              return false;     
+          }
+        smsRegister({
+            mobile,
+            name,
+            sms,
+            password,
+            hospital_uuid,
+            hospital_name,
+            office_name,
+            office_uuid,
+            county_id,
+            position_uuid,
+            certificate,
+            certificate_img
+        }).then(res=>{
+            this.setData({
+                showSuccess:true,
+            })
+       
+         
+        })
+     }),
+    handleThrottle:throttle(function(){
+        this.getCode()
+      }),
+      handleGetCaptcha(){
+        getCaptcha().then(res=>{
+            base64src(res.captchaBase64Image,(img)=>{
+              this.setData({
+                imgCode:img,
+                captchaUuid:res.captchaUuid
+              })
+            })
+        })
+      },
+     getCode(){
+      if(this.data.disabled)return;
+      let {mobile,captchaCode,captchaUuid,loginDevice,smsType}=this.data;
+      if(!/^1[3456789]\d{9}$/.test(mobile)){
+        wx.showToast({
+          title: `请输入有效的手机号码！`,
+          icon: 'none',
+        });
+        return false;    
+      };
+      if(!captchaCode){
+        wx.showToast({
+            title: `图形验证码不能为空`,
+            icon: 'none',
+          });
+          return false;   
+      }
+      sendSms({
+        mobile,
+        captchaCode,
+        captchaUuid,
+        smsType,
+        loginDevice
+      }).then((res)=>{
+        let timer=setInterval(() => {
+          if (this.data.time == 0) {   
+            clearInterval(this.data.timer);
+            this.setData({
+              time:59,
+              msg:'重新获取验证码',
+              disabled:false,
+              codeActive:true,
+            })
+          } else {
+            let msg= this.data.time + " s 后重新发送";
+            this.setData({
+              disabled:true,
+              msg:msg,
+              codeActive:false,
+            })
+            let time=this.data.time--;
+            this.setData({
+             msg:time + " s 后重新发送"
+            })
+          }
+        }, 1000);
+    
+        this.setData({
+          timer:timer
+        })
+      }).catch(()=>{
+          this.handleGetCaptcha();
+      });
+      
+    },
+    uploadImg(file){
+        let THIS=this;
+        wx.showLoading({
+            title: '图片上传中',
+            mask: true
+          })
+       
+        // 当设置 mutiple 为 true 时, file 为数组格式，否则为对象格式
+        wx.uploadFile({
+          url: host+'/user/uoloadImg', // 仅为示例，非真实的接口地址
+          filePath: file.url,
+          name: 'file',
+          formData: file,
+          success(res) {
+            let result=JSON.parse(res.data);
+            wx.hideLoading();
+            if(result.code==200){
+                THIS.setData({ 
+                    certificate_img:result.data
+                 });
+            }else{
+                wx.showToast({
+                  title:result.msg,
+                  icon:'none'
+                })
+            }
+            
+          },
+          complete(res){
+            console.log(res)
+          }
+        });
+    },
+    afterRead(event) {
+        const {
+            file
+          } = event.detail;
+        this.setData({
+            showCrop:true,
+            src:file.url
+          })
+     
+      },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+        this.handleGetCaptcha();
+        this.handleGetArea('');
+        this.handleGetOffice();
+        this.handleGetPosition();
+        this.initCrop(options);
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow() {
+       
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    // onShareAppMessage() {
+
+    // }
+})

case/pages/register/register.json

@@ -0,0 +1,17 @@
+{
+    "usingComponents": {
+        "van-overlay": "@vant/weapp/overlay/index",
+        "image-cropper": "../../../components/image-cropper/image-cropper",
+        "dialog":"../../../components/dialog/dialog",
+        "van-popup": "@vant/weapp/popup/index",
+        "van-picker": "@vant/weapp/picker/index",
+        "van-field": "@vant/weapp/field/index",
+        "van-cell": "@vant/weapp/cell/index",
+        "van-button": "@vant/weapp/button/index",
+        "van-image": "@vant/weapp/image/index",
+        "van-uploader": "@vant/weapp/uploader/index",
+         "van-cell-group": "@vant/weapp/cell-group/index"
+        
+    },
+    "navigationBarTitleText": "注册"
+}

case/pages/register/register.wxml

@@ -0,0 +1,102 @@
+<!--case/pages/register/register.wxml-->
+<view class="page">
+    <view class="step" hidden="{{showNext}}">
+        <van-cell-group >
+        <van-field value="{{ mobile }}" label="手机号" placeholder="请输入手机号" bind:change="onChange"  extra-event-params data-id="mobile" placeholder-style="color:#999;font-size:15px" />
+        <van-field
+        placeholder-style="color:#999;font-size:15px"
+    value="{{ captchaCode }}"
+    bind:change="onChange"
+    data-id="captchaCode"
+    label="图形验证码"
+    extra-event-params
+    placeholder="请输入图形验证码"
+    use-button-slot
+  >
+  <image src="{{imgCode}}" mode="aspectFit" slot="button" class="imgCode" bind:tap="handleGetCaptcha"/>
+    <!-- <van-button slot="button" size="small" type="primary">
+      发送验证码
+    </van-button> -->
+  </van-field>
+        <van-field value="{{ sms }}" data-id="sms" label="短信验证码" placeholder="请输入短信验证码" use-button-slot  bind:change="onChange" extra-event-params placeholder-style="color:#999;font-size:15px"
+   >
+            <van-button slot="button" size="small" type="primary" disabled="{{disabled}}" bind:tap="handleThrottle"> {{msg}} </van-button>
+        </van-field>
+        <van-field value="{{ password }}" type="password" label="密码" placeholder="请输入6~16位字母、数字组合" 
+        placeholder-style="color:#999;font-size:15px" data-id="password" bind:change="onChange" extra-event-params />
+
+        <view class="next">
+            <van-button type="primary" block bind:tap="goNext">下一步</van-button>
+        </view>
+     
+    </van-cell-group>
+    <view class="tip"> 若您有任何疑问或需要我们协助，请与您的小助手联系或直接微信联系<text class="red">igandan1000</text></view>
+    </view>
+     <view hidden="{{!showNext}}">
+        <van-cell-group class="group" >
+        <van-field value="{{ name }}" label="姓名" placeholder="请输入您的真实姓名"  input-align="right" placeholder-style="color:#999;font-size:15px" bind:change="onChange" data-id="name"  extra-event-params/>
+        <van-field value="{{ hospital_name }}"   label="医院" placeholder="请选择医院" right-icon="arrow" placeholder-style="color:#999;font-size:15px"
+        input-align="right" bind:tap="opeArea" readonly/>
+        <van-field value="{{ office_name }}"  
+        placeholder-style="color:#999;font-size:15px"bind:tap="openOffice"  label="科室" placeholder="请选择科室" right-icon="arrow" input-align="right"  readonly />
+        <van-field value="{{ position_name }}"  
+        placeholder-style="color:#999;font-size:15px" bind:tap="openPosition" label="职称" placeholder="请选择职称" right-icon="arrow" input-align="right"  readonly />
+        <van-field value="{{ certificate }}"   placeholder-style="color:#999;font-size:15px" label="执业证号(选填)" placeholder="请输入执业证号"  class="myclass" input-align="right"  />
+        <!-- <van-field value="{{ value }}"   label="执业医师资格证或工作胸牌" placeholder="请输入您的真实姓名" right-icon="arrow" input-align="right" bind:change="onChange" input-align="right" >
+            <view class="right" slot="input">
+                <van-image width="120rpx" height="80rpx" fit="contain" src="https://dev-wx.igandan.com/public/hcpEducation/images/default.png" />
+            </view>
+        </van-field> -->
+        <van-cell title="执业医师资格证或工作胸牌" is-link class="cert">
+            <van-uploader file-list="{{ fileList }}" bind:after-read="afterRead" class="upload"/>
+            <van-image width="120rpx" height="80rpx" fit="contain" src="{{certificate_img?certificate_img:img_host+'/default_register.png'}}"  class="cert"/>
+        </van-cell>
+        <view class="next">
+            <van-button type="primary" block bind:tap="handleSmsRegister">提交</van-button>
+        </view>
+        <view class="prev" >
+            <van-button type="primary" block bind:tap="showNext">上一步</van-button>
+        </view>
+    </van-cell-group>
+     </view>
+</view>
+<van-popup
+  show="{{ showArea }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ areaColumns }}" value-key="name" bind:change="onChangeArea" title="请选择地区" show-toolbar bind:confirm="confirmArea" bind:cancel="cancelArea"/>
+</van-popup>
+<van-popup
+  show="{{ showHospital }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ hospitalColumns }}" value-key="name" title="请选择医院" show-toolbar bind:confirm="confirmHospital" bind:cancel="cancelHospital"/>
+</van-popup>
+<van-popup
+  show="{{ showOffice }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ officeColumns }}" value-key="officeName" title="请选择科室" show-toolbar bind:confirm="confirmOffice" bind:cancel="cancelOffice"/>
+</van-popup>
+<van-popup
+  show="{{ showPosition }}"
+  round
+  position="bottom"
+  custom-style="height: 50%"
+>
+<van-picker columns="{{ positionColumns }}" value-key="name" title="请选择职称" show-toolbar bind:confirm="confirmPosition" bind:cancel="cancelPosition"/>
+</van-popup>
+<dialog showDialog="{{showSuccess}}" showCancel="{{false}}" bind:confirm="onConfirmSuccess" title="提示" confirmText="确定" message="注册成功，请等待审核"></dialog>
+<van-overlay show="{{showCrop}}" >
+    <image-cropper id="image-cropper" bindload="cropperload" bindimageload="loadimage" bindtapcut="clickcut" limit_move="{{limit_move}}" disable_rotate="{{disable_rotate}}" width="{{width}}" height="{{height}}" imgSrc="{{src}}" angle="{{angle}}" disable_width="{{disable_width}}" max_width="{{max_width}}" max_height="{{max_height}}" disable_height="{{disable_height}}" disable_ratio="{{disable_ratio}}"></image-cropper>
+   <view class="buttonbox">
+    <button bindtap='closeCrop' type="default" class="button" size="mini">返回</button>
+    <button bindtap='submit' type="primary" class="button" size="mini">确定</button>
+   </view>
+</van-overlay>

case/pages/register/register.wxss

@@ -0,0 +1,91 @@
+/* case/pages/register/register.wxss */
+.next{
+    margin: 40rpx 20rpx!important;
+}
+.prev{
+    margin:-20rpx 20rpx 0!important ;   
+}
+.van-field__label{
+    white-space: nowrap;
+}
+.custom-class .van-cell:last-child{
+    background-color: red;
+} 
+.van-cell__title{
+   white-space: nowrap;
+    display: flex;
+    color: #646566;
+    align-items: center;
+}
+.van-image{
+    margin-top: 10rpx;
+}
+.van-cell{
+    display: flex;
+    align-items: center;
+}
+.van-field__label,.van-cell__title{
+    position: relative;
+}
+.van-field__label::after,.cert .van-cell__title::after{
+    content: "*";
+    color:red;
+    position: absolute;
+    top:12rpx;
+    right:-14rpx;
+}
+.cert .van-cell__title::after{
+    top:4rpx;
+}
+.myclass .van-field__label::after{
+    content: "";
+}
+.upload{
+    opacity:0;
+    position: absolute;
+    z-index:99;
+}
+.cert .van-cell{
+    overflow: hidden;
+}
+.van-button{
+    border-radius: 10rpx!important;
+}
+.imgCode{
+    width:200rpx;
+   height:75.6rpx;
+}
+.custom-class{
+    min-height:43.5px !important;
+}
+.van-field__label{
+    color:#333!important;
+    padding:12rpx 0;
+    font-size: 15px!important;
+}
+.van-cell__title{
+    color:#333!important;
+    font-size: 15px!important;
+}
+.buttonbox{
+    position: absolute;
+    z-index:99;
+    display: flex;
+    width:600rpx;
+    left:50%;
+    transform: translateX(-50%);
+    justify-content: space-between;
+    bottom:50rpx;
+  }
+  .van-button--primary{
+    background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%)!important;
+    border-color:#377FF7!important
+  }
+  .tip{
+      margin:0 32rpx;
+      font-size: 28rpx;
+      color:#999;
+  }
+  .red{
+      color:red;
+  }

case/pages/signcanvas/signcanvas.js

@@ -0,0 +1,169 @@
+import { getOssSign} from '../../../api/api'
+import { FileUtil } from '../../../utils/fileutil'
+const app = getApp()
+Page({
+  data: {
+    height: app.globalData.height,
+    ctx: null,
+    canvas: null,
+    txt_show: true,
+    template:{
+      width: '676rpx',
+      height: '414rpx',
+      views: [
+      {}
+      ],
+    },
+  },
+  onReady() {
+    const query = wx.createSelectorQuery()
+    query.select('#sign_panels')
+      .fields({ node: true, size: true })
+      .exec((res) => {
+        const canvas = res[0].node
+        const ctx = canvas.getContext('2d')
+        ctx.lineWidth = 5;
+        // const dpr = wx.getSystemInfoSync().pixelRatio
+
+        canvas.width = res[0].width
+        canvas.height = res[0].height
+        ctx.scale(1, 1)
+        console.log(ctx);
+        this.setData({ 
+          ctx: ctx,
+          canvas: canvas
+        });
+
+        console.log("onReady onReady start")
+        console.log(ctx)
+        console.log(canvas)
+        console.log("onReady onReady end")
+      })
+  },
+  ontouchmove(e){
+    console.log("ontouchmove ontouchmove ontouchmove");
+    console.log(e);
+    this.data.ctx.lineWidth = 5;
+    this.data.ctx.lineCap="round";
+    this.data.ctx.lineJoin ="round";
+    this.data.ctx.lineTo(e.touches[0].x,e.touches[0].y);
+    this.data.ctx.stroke();
+  },
+  ontouchstart(e){
+    console.log("ontouchstart ontouchstart ontouchstart")
+    this.setData({
+      txt_show: false
+    });
+    console.log(this.data.ctx);
+    this.data.ctx.beginPath();
+    this.data.ctx.moveTo(e.touches[0].x,e.touches[0].y);
+  },
+  toClear() {
+    this.setData({
+      txt_show: true
+    });
+    this.data.ctx.clearRect(0,0,this.data.canvas.width,this.data.canvas.height)
+  },
+  rotate(){
+    let ctx = this.data.ctx;
+    ctx.rotate(90);
+  },
+  toSave(event) {
+    let _this = this;
+    let base64Img = _this.data.canvas.toDataURL();
+    console.log("sign: ", base64Img);
+    wx.canvasToTempFilePath({
+      canvasId: "sign_panels",
+      canvas: _this.data.canvas,
+      x:0,
+      y:0,
+      success(res) {
+        console.log(res.tempFilePath)
+        let filePath = res.tempFilePath;
+        console.log(_this.data.canvas)
+        console.log(_this.data.canvas.width)
+        console.log(_this.data.canvas.height)
+        let cs = (_this.data.canvas.height - _this.data.canvas.width)/2;
+        _this.setData({
+          "template.width": _this.data.canvas.height+"rpx",
+          "template.height": _this.data.canvas.width+"rpx",
+          "template.views[0].css.width": _this.data.canvas.width+"rpx",
+          "template.views[0].css.left": cs+"rpx",
+          "template.views[0].css.top": "-"+cs+"rpx",
+          "template.views[0].url": filePath,
+          "template.views[0].type": "image",
+          "template.views[0].css.rotate": "-90",
+        })
+        // _this.doUploadFile(event, 2, filePath);
+      }
+    })
+  },
+  onImgOK(e){
+    console.log("onImgOK onImgOK onImgOK onImgOK");
+    console.log(e.detail.path);
+    let txt_show = this.data.txt_show;
+    if(!txt_show){
+      this.doUploadFile(e, 2, e.detail.path);
+    }
+  },
+  doUploadFile(event, scene, filePath) {
+    console.log("index douploadFIle: ", event);
+    console.log("scene: ", scene);
+    let _this = this;
+    getOssSign(2).then(response => {
+      console.log(response);
+      console.log("filePath: ", filePath);
+      const filename = FileUtil.UUID()+".png";
+      const host = response.host;
+      const signature = response.signature;
+      const ossAccessKeyId = response.accessid;
+      const policy = response.policy;
+      const key = response.dir+filename;
+      wx.uploadFile({
+        url: host, // 开发者服务器的URL。
+        filePath: filePath,
+        name: 'file', // 必须填file。
+        formData: {
+          key,
+          policy,
+          OSSAccessKeyId: ossAccessKeyId,
+          signature,
+        },
+        success: (res) => {
+          console.log("upload: ", res);
+          if (res.statusCode === 204) {
+            wx.showToast({title: '上传成功'})
+            let url = host+"/"+key;
+            console.log(url);
+            let pages = getCurrentPages();
+            let prevPage = pages[pages.length - 2]
+              prevPage.setData({ //setData给上个页面的data进行赋值
+                signImg:url
+              })
+              wx.navigateBack();
+            //this.handleAddSign(url)
+          }
+          
+        },
+        fail: err => {
+          console.log(err);
+          wx.showToast({
+            title: '上传失败',
+            icon: "error"
+          })
+        }
+      });
+    }).catch(error => {
+       
+        if(error.code==30007){
+            wx.showToast({
+                title: '您未登录',
+                icon:'none'
+              })
+            app.method.navigateTo({
+              url: '/case/pages/mobileLogin/mobileLogin',
+            })
+         }
+    })
+  }
+})

case/pages/signcanvas/signcanvas.json

@@ -0,0 +1,10 @@
+{
+  "component": true,
+  "usingComponents": {
+    "navBar":"../../../components/navBar/navBar",
+    "van-button": "@vant/weapp/button/index",
+    "painter":"../../../components/painter/painter"
+  },
+  "disableScroll": true,
+  "navigationStyle":"custom"
+}

case/pages/signcanvas/signcanvas.wxml

@@ -0,0 +1,11 @@
+<navBar navName="签名"></navBar>
+<view class="container" style="height: calc(100vh - 96rpx - {{height}}px);">
+  <canvas disable-scroll bindtouchstart="ontouchstart" bindtouchmove="ontouchmove" type="2d" style="width: 100vw; height: calc(100vh - {{height*2 + 20}}px);" id="sign_panels">
+    <view wx:if="{{txt_show}}" class="title">签名面板</view>
+  </canvas>
+  <view class="btn_group">
+    <van-button bindtap="toClear" custom-style="height: 70rpx;border-radius: 10rpx;color:#000;width: 230rpx;">清空</van-button>
+    <van-button bindtap="toSave" custom-style="height: 70rpx;border-radius: 10rpx;color:#fff;width: 230rpx;background: linear-gradient(315deg, #33BFB8 0%, #34BFB8 0%, #3CC7C0 100%);">确认</van-button>
+  </view>
+</view>
+<painter palette="{{template}}" style="position: absolute;top: 999999999999999999999999999999999900px;left: 999999999999999999999999999999999px;" bind:imgOK="onImgOK" />

case/pages/signcanvas/signcanvas.wxss

@@ -0,0 +1,23 @@
+.container{
+  height: 100vh;
+  margin-top: 172rpx;
+  background: #FAFAFA;
+}
+.title{
+  font-size: 40rpx;
+  width: 160rpx;
+  height: 50rpx;
+  position:absolute;
+  left: calc(50vw - 80rpx);
+  top: calc(50vh - 160rpx);
+  transform: rotate(90deg);
+}
+.btn_group{
+  transform: rotate(90deg);
+  width: 500rpx;
+  position: absolute;
+  left: calc(-215rpx + 50rpx);/* 和按钮的高度有关 (width/2 - 按钮高度/2) */
+  bottom: calc(215rpx + 100rpx);/* 和按钮的高度有关 (width/2 - 按钮高度/2) */
+  display: flex;
+  justify-content: space-between;
+}

case/utils/utils.js

@@ -0,0 +1,223 @@
+function formatTime(date) {
+    var year = date.getFullYear()
+    var month = date.getMonth() + 1
+    var day = date.getDate()
+  
+    var hour = date.getHours()
+    var minute = date.getMinutes()
+    var second = date.getSeconds()
+  
+  
+    return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')
+  }
+  
+  function formatNumber(n) {
+    n = n.toString()
+    return n[1] ? n : '0' + n
+  }
+  
+  // 公用的修改颜色
+  function changeColor(e, _this) {
+    let tempData = {};
+    tempData[e.target.dataset.color] = e.detail.value;
+    _this.setData({
+      ...tempData,
+      eraser: false,
+    });
+  }
+  
+  // 公用的修改画笔宽度
+  function changeWidth(e, _this, canvasHeight, pageType) {
+    let c = {};
+    if (pageType === 1) {
+      c.canvasHeight = canvasHeight;
+    } else {
+      c.canvasHeightLen = canvasHeight;
+    }
+    _this.setData({
+      w: e.detail.value,
+      eraser: false,
+      ...c,
+    })
+  }
+  
+  // 点击按钮触发的事件
+  function tapBtn(e, _this, pageType) {
+    let btnType = e.target.dataset.type;
+  
+    let c = {};
+  
+    switch (btnType) {
+      // 画笔宽度
+      case 'width':
+        if (pageType === 1) {
+          c.canvasHeight = (!_this.data.width) ? 130 + _this.data.w : 50
+        } else if (pageType === 2) {
+          c.canvasHeightLen = (!_this.data.width) ? Math.min(_this.data.canvasHeight, _this.data.windowHeight - _this.data.w - 130) : 0;
+        } else if (pageType === 3) {
+          c.canvasHeight = 130;
+        }
+        _this.setData({
+          width: !_this.data.width,
+          color: false,
+          clear: false,
+          ...c,
+        });
+        return;
+      // 画笔颜色
+      case 'color':
+        if (pageType === 1) {
+          c.canvasHeight = (!_this.data.color) ? 205 + _this.data.w : 50;
+        } else if (pageType === 2) {
+          c.canvasHeightLen = (!_this.data.color) ? Math.min(_this.data.canvasHeight, _this.data.windowHeight - _this.data.w - 205) : 0;
+        }
+        _this.setData({
+          width: false,
+          color: !_this.data.color,
+          clear: false,
+          ...c,
+        });
+        return;
+      // 清空按钮
+      case 'clear':
+        if (pageType === 1) {
+          c.canvasHeight = (!_this.data.clear) ? 120 + _this.data.w : 50;
+        } else if (pageType === 2) {
+          c.canvasHeightLen = (!_this.data.clear) ? Math.min(_this.data.canvasHeight, _this.data.windowHeight - _this.data.w - 120) : 0;
+        }
+        _this.setData({
+          width: false,
+          color: false,
+          clear: !_this.data.clear,
+          ...c,
+        })
+        return;
+      // 保存
+      case 'save':
+        saveImg(_this, pageType);
+        return;
+      default:
+        return;
+    }
+  }
+  
+  function saveImg(_this, pageType) {
+    let c = {};
+    if (pageType === 1) {
+      c.canvasHeight = 50;
+    } else if (pageType === 2) {
+      c.canvasHeightLen = 0;
+    }
+    // 查看授权
+    if (!_this.data.scope) {
+      wx.showModal({
+        title: '需要授权',
+        content: '保存图片需要获取您的授权',
+        success: (res) => {
+          if (res.confirm) {
+            wx.openSetting({
+              success: (res) => {
+                if (res.authSetting['scope.writePhotosAlbum']) {
+                  _this.setData({
+                    scope: true,
+                  })
+                }
+              }
+            });
+          }
+        }
+      })
+    }
+    // 已经获得授权且不在保存中
+    if (_this.data.scope && !_this.data.saving) {
+      wx.showLoading({
+        title: '保存中',
+        mask: true,
+      })
+      // 关闭所有的操作栏
+      _this.setData({
+        width: false,
+        color: false,
+        clear: false,
+        saving: true,
+        ...c,
+      })
+  
+      if (pageType === 2) {
+        /*
+        * 对于涂鸦照片，一共分为四步：
+        * 1、将画的内容先保存出来
+        * 2、然后再将照片先画在canvas上
+        * 3、将画的内容覆盖的画在canvas上
+        * 4、最终保存
+         */
+        wx.canvasToTempFilePath({
+          canvasId: 'myCanvas',
+          success: function (res) {
+            // 把单纯用户画的内容存好了
+            let src = res.tempFilePath;
+            let ctx = wx.createCanvasContext('myCanvas');
+            // 照片
+            ctx.drawImage(_this.data.background, 0, 0, _this.data.canvasWidth, _this.data.canvasHeight);
+            // 覆盖上画的内容
+            ctx.drawImage(src, 0, 0, _this.data.canvasWidth, _this.data.canvasHeight);
+            ctx.draw();
+  
+            _canvaseSaveToImg(_this);
+          }
+        });
+      } else {
+        _canvaseSaveToImg(_this);
+      }
+    }
+  }
+  
+  function _canvaseSaveToImg(_this) {
+    // 调用微信canvas存为图片
+    wx.canvasToTempFilePath({
+      canvasId: 'myCanvas',
+      success: function (res) {
+        // 转图片成功，继续调用存储相册接口
+        wx.saveImageToPhotosAlbum({
+          filePath: res.tempFilePath,
+          // 存储成功
+          success: function (r) {
+            wx.hideLoading();
+            wx.showToast({
+              title: '保存成功',
+            })
+            _this.setData({
+              saving: false,
+            })
+          },
+          // 失败弹窗
+          fail: function (res) {
+            wx.hideLoading();
+            wx.showToast({
+              title: '保存失败',
+              icon: 'loading',
+            })
+            _this.setData({
+              saving: false,
+            })
+          }
+        })
+      },
+      fail: function (res) {
+        // canvas转图片失败
+        wx.hideLoading();
+        wx.showToast({
+          icon: 'loading',
+          title: '保存失败',
+        })
+      }
+    })
+  }
+  
+  module.exports = {
+    formatTime: formatTime,
+    changeColor: changeColor,
+    changeWidth: changeWidth,
+    tapBtn: tapBtn,
+  }
+  

components/dialog/dialog.js

@@ -0,0 +1,91 @@
+// components/dialog/dialog.js
+Component({
+
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        showDialog:{
+            type: Boolean,
+            value:false,
+            observer(newval) {
+              this.setData({
+                showDialog: newval
+              });
+            },
+          },
+          message:{
+            type: String,
+            value: '22',
+            observer(newval) {
+              this.setData({
+                message: newval,
+              });
+            },
+          },
+          showTip:{
+            type: Boolean,
+            value: false,
+            observer(newval) {
+              this.setData({
+                showTip: newval
+              });
+            },
+          },
+          showCancel:{
+            type: Boolean,
+            value: true,
+            observer(newval) {
+              this.setData({
+                showCancel: newval,
+              });
+            },
+          },
+          title:{
+            type: String,
+            value: '温馨提示',
+            observer(newval) {
+              this.setData({
+                title: newval,
+              });
+            },
+          },
+        cancelText:{
+            type: String,
+            value: '取消',
+            observer(newval) {
+              this.setData({
+                cancelText: newval,
+              });
+            },
+          },
+          confirmText:{
+            type: String,
+            value: '确定',
+            observer(newval) {
+              this.setData({
+                confirmText: newval,
+              });
+            },
+          },
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+       
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        onConfirm(){
+            this.triggerEvent("confirm")
+        },
+        onCancel(){
+           this.triggerEvent("cancel")
+        }
+    }
+})

components/dialog/dialog.json

@@ -0,0 +1,6 @@
+{
+    "component": true,
+    "usingComponents": {
+        "van-overlay": "@vant/weapp/overlay/index"
+    }
+}

components/dialog/dialog.wxml

@@ -0,0 +1,22 @@
+<!--components/dialog/dialog.wxml-->
+
+  <van-overlay show="{{showDialog}}" z-index="999999" >
+  <view class="wrapper">
+     <div class="dialogbox">
+       <view class="title">{{title}}</view>
+       <view class="tip" wx:if="{{showTip}}">请修改完善后重新提交</view>
+       <view class="content"  style="padding:{{showTip?'0rpx 0 48rpx':'32rpx 0 48rpx'}};margin-top:{{showTip?'-20rpx':'0'}};">
+       <text wx:if="{{showTip}}" class="msg"> 
+        {{message}}
+           <!-- 1.使用设计工具的好处在于，当这些项目材料同时呈现，能够帮助我们进行模式识别\n2.并促进更多创新结合体的出现，这些是当资源隐藏分散在各种文件夹、笔记本和幻灯片里时难以实现的。 -->
+        </text>
+        <text wx:else class="msg">{{message}}</text>
+       </view>
+      
+       <view class="footer">
+          <view class="cancelBtn" wx:if="{{showCancel}}" bindtap="onCancel">{{cancelText}}</view>
+          <view class="okBtn" bindtap="onConfirm">{{confirmText}}</view>
+       </view>
+     </div>
+  </view>
+</van-overlay>

components/dialog/dialog.wxss

@@ -0,0 +1,77 @@
+/* components/dialog/dialog.wxss */
+.wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+  }
+  .dialogbox{
+      box-sizing: border-box;
+      padding:48rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 630rpx;
+    border-radius: 16rpx;
+    background-color: #fff;
+  }
+  .title{
+    height: 54rpx;
+    font-size: 36rpx;
+    font-weight: 500;
+    color: rgba(0,0,0,0.85);
+    line-height: 54rpx 
+  }
+  .content{
+      padding:32rpx 0 48rpx;
+      font-size: 32rpx;
+      font-weight: 400;
+      text-align: center;
+      color: rgba(0,0,0,0.65);
+      line-height: 48rpx;
+     width:100%;
+  }
+  .msg{
+    word-break: break-all;
+    word-wrap: break-word;
+  }
+  .footer{
+      width:100%;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+  }
+  .cancelBtn{
+      flex:1;
+    margin-right: 24rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center; 
+    
+height: 88rpx;
+background: #FFFFFF;
+border-radius: 50rpx;
+border: 2rpx solid rgba(0,0,0,0.15);
+font-size: 32rpx;
+font-weight: 500;
+color: rgba(0,0,0,0.85);
+  }
+  .okBtn{
+      color:#fff;
+      flex:1;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    
+   height: 88rpx;
+   font-size: 32rpx;
+font-weight: 500;
+color: #FFFFFF;
+   background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+   border-radius: 50rpx;
+  }
+  .tip{
+    font-size: 32rpx;
+font-weight: 400;
+color: #FF9C00;  
+  }

components/image-cropper/image-cropper.json

@@ -0,0 +1,3 @@
+{
+	"component": true
+}

components/image-cropper/image-cropper.wxml

@@ -0,0 +1,24 @@
+<view class='image-cropper' catchtouchmove='_preventTouchMove'>
+    <view class='main' bindtouchend="_cutTouchEnd" bindtouchstart="_cutTouchStart" bindtouchmove="_cutTouchMove" bindtap="_click">
+        <view class='content'>
+            <view class='content_top bg_gray {{_flag_bright?"":"bg_black"}}' style="height:{{cut_top}}px;transition-property:{{_cut_animation?'':'background'}}"></view>
+            <view class='content_middle' style="height:{{height}}px;">
+                <view class='content_middle_left bg_gray {{_flag_bright?"":"bg_black"}}' style="width:{{cut_left}}px;transition-property:{{_cut_animation?'':'background'}}"></view>
+                <view class='content_middle_middle' style="width:{{width}}px;height:{{height}}px;transition-duration: .3s;transition-property:{{_cut_animation?'':'background'}};">
+                    <view class="border border-top-left"></view>
+                    <view class="border border-top-right"></view>
+                    <view class="border border-right-top"></view>
+                    <view class="border border-right-bottom"></view>
+                    <view class="border border-bottom-right"></view>
+                    <view class="border border-bottom-left"></view>
+                    <view class="border border-left-bottom"></view>
+                    <view class="border border-left-top"></view>
+                </view>
+                <view class='content_middle_right bg_gray {{_flag_bright?"":"bg_black"}}' style="transition-property:{{_cut_animation?'':'background'}}"></view>
+            </view>
+            <view class='content_bottom bg_gray {{_flag_bright?"":"bg_black"}}' style="transition-property:{{_cut_animation?'':'background'}}"></view>
+        </view>
+        <image bindload="imageLoad" bindtouchstart="_start" bindtouchmove="_move" bindtouchend="_end" style="width:{{img_width ? img_width + 'px' : 'auto'}};height:{{img_height ? img_height + 'px' : 'auto'}};transform:translate3d({{_img_left-img_width/2}}px,{{_img_top-img_height/2}}px,0) scale({{scale}}) rotate({{angle}}deg);transition-duration:{{_cut_animation?.4:0}}s;" class='img' src='{{imgSrc}}'></image>
+    </view>
+    <canvas canvas-id='image-cropper' disable-scroll="true" style="width:{{_canvas_width * export_scale}}px;height:{{_canvas_height * export_scale}}px;left:{{canvas_left}}px;top:{{canvas_top}}px" class='image-cropper-canvas'></canvas>
+</view>

components/image-cropper/image-cropper.wxss

@@ -0,0 +1,143 @@
+.image-cropper {
+    background: rgba(14, 13, 13, .8);
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    height: 100vh;
+    z-index: 1;
+}
+
+.image-cropper .main {
+    position: absolute;
+    width: 100vw;
+    height: 100vh;
+    overflow: hidden;
+}
+
+.image-cropper .content {
+    z-index: 9;
+    position: absolute;
+    width: 100vw;
+    height: 100vh;
+    display: flex;
+    flex-direction: column;
+    pointer-events: none;
+}
+
+.image-cropper .bg_black {
+    background: rgba(0, 0, 0, 0.8) !important;
+}
+
+.image-cropper .bg_gray {
+    background: rgba(0, 0, 0, 0.45);
+    transition-duration: .35s;
+}
+
+.image-cropper .content>.content_top {
+    pointer-events: none;
+}
+
+.image-cropper .content>.content_middle {
+    display: flex;
+    height: 200px;
+    width: 100%;
+}
+
+.image-cropper .content_middle_middle {
+    width: 200px;
+    box-sizing: border-box;
+    position: relative;
+    transition-duration: .3s;
+}
+
+.image-cropper .content_middle_right {
+    flex: auto;
+}
+
+.image-cropper .content>.content_bottom {
+    flex: auto;
+}
+
+.image-cropper .img {
+    z-index: 2;
+    top: 0;
+    left: 0;
+    position: absolute;
+    border: none;
+    width: 100%;
+    backface-visibility: hidden;
+    transform-origin: center;
+}
+
+.image-cropper .image-cropper-canvas {
+    position: fixed;
+    background: white;
+    width: 150px;
+    height: 150px;
+    z-index: 10;
+    top: -200%;
+    pointer-events: none;
+}
+
+.image-cropper .border {
+    background: white;
+    pointer-events: auto;
+    position: absolute;
+}
+
+.image-cropper .border-top-left {
+    left: -2.5px;
+    top: -2.5px;
+    height: 2.5px;
+    width: 33rpx;
+}
+
+.image-cropper .border-top-right {
+    right: -2.5px;
+    top: -2.5px;
+    height: 2.5px;
+    width: 33rpx;
+}
+
+.image-cropper .border-right-top {
+    top: -1px;
+    width: 2.5px;
+    height: 30rpx;
+    right: -2.5px;
+}
+
+.image-cropper .border-right-bottom {
+    width: 2.5px;
+    height: 30rpx;
+    right: -2.5px;
+    bottom: -1px;
+}
+
+.image-cropper .border-bottom-left {
+    height: 2.5px;
+    width: 33rpx;
+    bottom: -2.5px;
+    left: -2.5px;
+}
+
+.image-cropper .border-bottom-right {
+    height: 2.5px;
+    width: 33rpx;
+    bottom: -2.5px;
+    right: -2.5px;
+}
+
+.image-cropper .border-left-top {
+    top: -1px;
+    width: 2.5px;
+    height: 30rpx;
+    left: -2.5px;
+}
+
+.image-cropper .border-left-bottom {
+    width: 2.5px;
+    height: 30rpx;
+    left: -2.5px;
+    bottom: -1px;
+}

components/nav/nav.js

@@ -0,0 +1,48 @@
+
+
+// components/nav/nav.js
+const app=getApp();
+Component({
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    keyWord:'',
+    img_host:app.hostConfig().imghost
+  },
+  pageLifetimes: {
+    // 组件所在页面的生命周期函数
+    show() { 
+      this.setData({
+        img_host:app.hostConfig().imghost
+      });
+    },
+    hide: function () { },
+    resize: function () { },
+  },
+  
+  methods: {
+    search(){
+        this.triggerEvent('goSearch',this.data.keyWord)
+    },
+    clearKeyWord(){
+        this.setData({
+            keyWord:''
+        })
+    },
+    changeIpt(event){
+      let {value} = event.detail;
+     console.log(value);
+      this.setData({
+        keyWord:value
+      })
+    
+    },
+    goInquirtForm(){
+      wx.navigateTo({
+        url: '/case/pages/paintCanvas/paintCanvas',
+      })
+    }
+  },
+  
+})

components/nav/nav.json

@@ -0,0 +1,4 @@
+{
+    "component": true,
+    "usingComponents": {}
+}

components/nav/nav.wxml

@@ -0,0 +1,11 @@
+<!--components/nav/nav.wxml-->
+<view class="barcontain">
+     <image src="{{img_host+'/navbg.png'}}" mode="widthFix" class="bg" />
+    <view class="barcon">
+      <text class="text" bindtap="goInquirtForm">人工肝病例登记系统</text>
+      <view class="scon">
+        <input type="text" placeholder="请输入患者编号或者姓名拼音首字母" value="{{keyWord}}"		bindinput="changeIpt"	placeholder-style="color: rgba(0,0,0,0.25);font-size:28rpx;" confirm-type="search" class="ipt" />
+        <view class="btn" bind:tap="search">搜索</view>
+      </view>
+    </view>
+</view>

components/nav/nav.wxss

@@ -0,0 +1,61 @@
+/* components/nav/nav.wxss */
+.barcontain {
+    position: fixed;
+    top: 0;
+    z-index: 9;
+    width: 100%;
+    overflow: hidden;
+    height: 290rpx;
+  }
+  
+  .barcontain .barcon {
+    margin: 106rpx 32rpx 0;
+  }
+  .barcon .scon {
+    width: 100%;
+    height: 80rpx;
+    background: #FBFBFB;
+    display: flex;
+
+    box-shadow: 0rpx 12rpx 28rpx 0rpx rgba(0,0,0,0.03);
+    border-radius: 8rpx;
+    align-items: center;
+    margin-top: 55rpx;
+  }
+  
+  .barcontain .text {
+    font-size: 36rpx;
+    font-weight: 600;
+  }
+  
+  .barcon .ss {
+    width: 30rpx;
+    height: 30rpx;
+    margin-right: 25rpx;
+  }
+  
+  .barcontain .ipt {
+    margin-left: 30rpx;
+    flex: 1;
+    font-size: 32rpx;
+    height: 80rpx;
+  
+  }
+  .bg{
+      position: absolute;
+      z-index:-1;
+      width:750rpx;
+  }
+  .btn{
+    width: 128rpx;
+    height: 64rpx;
+    display: flex;
+    margin-right: 8rpx;
+    font-size: 32rpx;
+font-weight: 500;
+color: #FFFFFF;
+    align-items: center;
+    justify-content: center;
+    background: linear-gradient(90deg, #377FF7 0%, #51AAFF 100%);
+    border-radius: 8rpx;
+  }

components/navBar/navBar.js

@@ -0,0 +1,44 @@
+// components/navBar.js
+
+Component({
+  /**
+   * 组件的属性列表
+   */
+  externalClasses:['myclass'],
+  properties: {
+    navName: {
+      type: String,
+      value: "",
+      observer(newval) {
+        this.setData({
+          name: newval,
+        });
+      },
+    },
+  },
+
+  /**
+   * 组件的初始数据
+   */
+  data: {
+    name:''
+  },
+
+  /**
+   * 组件的方法列表
+   */
+  methods: {
+   
+    goBack(){
+        wx.navigateBack({
+            delta: 1,
+            fail:function(){
+              wx.reLaunch({
+                url: '/pages/index/index',
+              })
+            }
+          })
+    },
+    
+  }
+})

components/navBar/navBar.json

@@ -0,0 +1,6 @@
+{
+    "component": true,
+    "usingComponents": {
+        "van-icon": "@vant/weapp/icon/index"
+    }
+}

components/navBar/navBar.wxml

@@ -0,0 +1,5 @@
+<!--components/navBar.wxml-->
+<view class="ui-navigatorbar myclass" >
+    <van-icon name="arrow-left" bindtap="goBack" class="ui-navigatorbar-back" />
+    <view class="ui-title">{{name}}</view>
+</view>

components/navBar/navBar.wxss

@@ -0,0 +1,36 @@
+/* components/navBar.wxss */
+.ui-navigatorbar {
+    position: fixed;
+    z-index:99;
+    top: 0;
+    width: 750rpx;
+    height: 172rpx;
+    background: #FFFFFF;
+    backdrop-filter: blur(20px);
+    border-bottom: none;
+  }
+  
+  .ui-navigatorbar-back {
+    position: absolute;
+     padding-left:40rpx;
+     padding-right:40rpx;
+   
+    left: 0rpx;
+    font-size: 40rpx;
+    bottom: 20rpx;
+  }
+  
+  .ui-title {
+    position: absolute;
+    width: 350rpx;
+    height: 88rpx;
+    line-height: 56rpx;
+    font-size: 36rpx;
+    white-space: nowrap;
+    color: #000000;
+    bottom: 0;
+    left: 200rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }

components/painter/lib/calc.js

@@ -0,0 +1,54 @@
+/* eslint-disable */
+// 四则运算
+
+!(function () {
+  var calculate = function (s) {
+    s = s.trim();
+    const stack = new Array();
+    let preSign = '+';
+    let numStr = '';
+    const n = s.length;
+    for (let i = 0; i < n; ++i) {
+      if (s[i] === '.' || (!isNaN(Number(s[i])) && s[i] !== ' ')) {
+        numStr += s[i];
+      } else if (s[i] === '(') {
+        let isClose = 1;
+        let j = i;
+        while (isClose > 0) {
+          j += 1;
+          if (s[j] === '(') isClose += 1;
+          if (s[j] === ')') isClose -= 1;
+        }
+        numStr = `${calculate(s.slice(i + 1, j))}`;
+        i = j;
+      }
+      if ((isNaN(Number(s[i])) && s[i] !== '.') || i === n - 1) {
+        let num = parseFloat(numStr);
+        switch (preSign) {
+          case '+':
+            stack.push(num);
+            break;
+          case '-':
+            stack.push(-num);
+            break;
+          case '*':
+            stack.push(stack.pop() * num);
+            break;
+          case '/':
+            stack.push(stack.pop() / num);
+            break;
+          default:
+            break;
+        }
+        preSign = s[i];
+        numStr = '';
+      }
+    }
+    let ans = 0;
+    while (stack.length) {
+      ans += stack.pop();
+    }
+    return ans;
+  };
+  module.exports = calculate;
+})();

components/painter/lib/downloader.js

@@ -0,0 +1,363 @@
+/**
+ * LRU 文件存储，使用该 downloader 可以让下载的文件存储在本地，下次进入小程序后可以直接使用
+ * 详细设计文档可查看 https://juejin.im/post/5b42d3ede51d4519277b6ce3
+ */
+const util = require('./util');
+const sha1 = require('./sha1');
+
+const SAVED_FILES_KEY = 'savedFiles';
+const KEY_TOTAL_SIZE = 'totalSize';
+const KEY_PATH = 'path';
+const KEY_TIME = 'time';
+const KEY_SIZE = 'size';
+
+// 可存储总共为 6M，目前小程序可允许的最大本地存储为 10M
+let MAX_SPACE_IN_B = 6 * 1024 * 1024;
+let savedFiles = {};
+
+export default class Dowloader {
+  constructor() {
+    // app 如果设置了最大存储空间，则使用 app 中的
+    if (getApp().PAINTER_MAX_LRU_SPACE) {
+      MAX_SPACE_IN_B = getApp().PAINTER_MAX_LRU_SPACE;
+    }
+    wx.getStorage({
+      key: SAVED_FILES_KEY,
+      success: function (res) {
+        if (res.data) {
+          savedFiles = res.data;
+        }
+      },
+    });
+  }
+
+  /**
+   * 下载文件，会用 lru 方式来缓存文件到本地
+   * @param {String} url 文件的 url
+   */
+  download(url, lru) {
+    return new Promise((resolve, reject) => {
+      if (!(url && util.isValidUrl(url))) {
+        resolve(url);
+        return;
+      }
+      const fileName = getFileName(url);
+      if (!lru) {
+        // 无 lru 情况下直接判断 临时文件是否存在，不存在重新下载
+        wx.getFileInfo({
+          filePath: fileName,
+          success: () => {
+            resolve(url);
+          },
+          fail: () => {
+            if (util.isOnlineUrl(url)) {
+              downloadFile(url, lru).then((path) => {
+                resolve(path);
+              }, () => {
+                reject();
+              });
+            } else if (util.isDataUrl(url)) {
+              transformBase64File(url, lru).then(path => {
+                resolve(path);
+              }, () => {
+                reject();
+              });
+            }
+          },
+        })
+        return
+      }
+
+      const file = getFile(fileName);
+
+      if (file) {
+        if (file[KEY_PATH].indexOf('//usr/') !== -1) {
+          wx.getFileInfo({
+            filePath: file[KEY_PATH],
+            success() {
+              resolve(file[KEY_PATH]);
+            },
+            fail(error) {
+              console.error(`base64 file broken, ${JSON.stringify(error)}`);
+              transformBase64File(url, lru).then(path => {
+                resolve(path);
+              }, () => {
+                reject();
+              });
+            }
+          })
+        } else {
+          // 检查文件是否正常，不正常需要重新下载
+          wx.getSavedFileInfo({
+            filePath: file[KEY_PATH],
+            success: (res) => {
+              resolve(file[KEY_PATH]);
+            },
+            fail: (error) => {
+              console.error(`the file is broken, redownload it, ${JSON.stringify(error)}`);
+              downloadFile(url, lru).then((path) => {
+                resolve(path);
+              }, () => {
+                reject();
+              });
+            },
+          });
+        }
+      } else {
+        if (util.isOnlineUrl(url)) {
+          downloadFile(url, lru).then((path) => {
+            resolve(path);
+          }, () => {
+            reject();
+          });
+        } else if (util.isDataUrl(url)) {
+          transformBase64File(url, lru).then(path => {
+            resolve(path);
+          }, () => {
+            reject();
+          });
+        }
+      }
+    });
+  }
+}
+
+function getFileName(url) {
+  if (util.isDataUrl(url)) { 
+    const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(url) || [];
+    const fileName = `${sha1.hex_sha1(bodyData)}.${format}`;
+    return fileName;
+  } else {
+    return url;
+  }
+}
+
+function transformBase64File(base64data, lru) {
+  return new Promise((resolve, reject) => {
+    const [, format, bodyData] = /data:image\/(\w+);base64,(.*)/.exec(base64data) || [];
+    if (!format) {
+      console.error('base parse failed');
+      reject();
+      return;
+    }
+    const fileName = `${sha1.hex_sha1(bodyData)}.${format}`;
+    const path = `${wx.env.USER_DATA_PATH}/${fileName}`;
+    const buffer = wx.base64ToArrayBuffer(bodyData.replace(/[\r\n]/g, ""));
+    wx.getFileSystemManager().writeFile({
+      filePath: path,
+      data: buffer,
+      encoding: 'binary',
+      success() {
+        wx.getFileInfo({
+          filePath: path,
+          success: (tmpRes) => {
+            const newFileSize = tmpRes.size;
+            lru ? doLru(newFileSize).then(() => {
+              saveFile(fileName, newFileSize, path, true).then((filePath) => {
+                resolve(filePath);
+              });
+            }, () => {
+              resolve(path);
+            }) : resolve(path);
+          },
+          fail: (error) => {
+          // 文件大小信息获取失败，则此文件也不要进行存储
+            console.error(`getFileInfo ${path} failed, ${JSON.stringify(error)}`);
+            resolve(path);
+          },
+        });
+      },
+      fail(err) {
+        console.log(err)
+      }
+    })
+  });  
+}
+
+function downloadFile(url, lru) {
+  return new Promise((resolve, reject) => {
+    const downloader = url.startsWith('cloud://')?wx.cloud.downloadFile:wx.downloadFile
+    downloader({
+      url: url,
+      fileID: url,
+      success: function (res) {
+        if (res.statusCode !== 200) {
+          console.error(`downloadFile ${url} failed res.statusCode is not 200`);
+          reject();
+          return;
+        }
+        const {
+          tempFilePath
+        } = res;
+        wx.getFileInfo({
+          filePath: tempFilePath,
+          success: (tmpRes) => {
+            const newFileSize = tmpRes.size;
+            lru ? doLru(newFileSize).then(() => {
+              saveFile(url, newFileSize, tempFilePath).then((filePath) => {
+                resolve(filePath);
+              });
+            }, () => {
+              resolve(tempFilePath);
+            }) : resolve(tempFilePath);
+          },
+          fail: (error) => {
+            // 文件大小信息获取失败，则此文件也不要进行存储
+            console.error(`getFileInfo ${res.tempFilePath} failed, ${JSON.stringify(error)}`);
+            resolve(res.tempFilePath);
+          },
+        });
+      },
+      fail: function (error) {
+        console.error(`downloadFile failed, ${JSON.stringify(error)} `);
+        reject();
+      },
+    });
+  });
+}
+
+function saveFile(key, newFileSize, tempFilePath, isDataUrl = false) {
+  return new Promise((resolve, reject) => {
+    if (isDataUrl) {
+      const totalSize = savedFiles[KEY_TOTAL_SIZE] ? savedFiles[KEY_TOTAL_SIZE] : 0;
+      savedFiles[key] = {};
+      savedFiles[key][KEY_PATH] = tempFilePath;
+      savedFiles[key][KEY_TIME] = new Date().getTime();
+      savedFiles[key][KEY_SIZE] = newFileSize;
+      savedFiles['totalSize'] = newFileSize + totalSize;
+      wx.setStorage({
+        key: SAVED_FILES_KEY,
+        data: savedFiles,
+      });
+      resolve(tempFilePath);
+      return;
+    }
+    wx.saveFile({
+      tempFilePath: tempFilePath,
+      success: (fileRes) => {
+        const totalSize = savedFiles[KEY_TOTAL_SIZE] ? savedFiles[KEY_TOTAL_SIZE] : 0;
+        savedFiles[key] = {};
+        savedFiles[key][KEY_PATH] = fileRes.savedFilePath;
+        savedFiles[key][KEY_TIME] = new Date().getTime();
+        savedFiles[key][KEY_SIZE] = newFileSize;
+        savedFiles['totalSize'] = newFileSize + totalSize;
+        wx.setStorage({
+          key: SAVED_FILES_KEY,
+          data: savedFiles,
+        });
+        resolve(fileRes.savedFilePath);
+      },
+      fail: (error) => {
+        console.error(`saveFile ${key} failed, then we delete all files, ${JSON.stringify(error)}`);
+        // 由于 saveFile 成功后，res.tempFilePath 处的文件会被移除，所以在存储未成功时，我们还是继续使用临时文件
+        resolve(tempFilePath);
+        // 如果出现错误，就直接情况本地的所有文件，因为你不知道是不是因为哪次lru的某个文件未删除成功
+        reset();
+      },
+    });
+  });
+}
+
+/**
+ * 清空所有下载相关内容
+ */
+function reset() {
+  wx.removeStorage({
+    key: SAVED_FILES_KEY,
+    success: () => {
+      wx.getSavedFileList({
+        success: (listRes) => {
+          removeFiles(listRes.fileList);
+        },
+        fail: (getError) => {
+          console.error(`getSavedFileList failed, ${JSON.stringify(getError)}`);
+        },
+      });
+    },
+  });
+}
+
+function doLru(size) {
+  if (size > MAX_SPACE_IN_B) {
+    return Promise.reject()
+  }
+  return new Promise((resolve, reject) => {
+    let totalSize = savedFiles[KEY_TOTAL_SIZE] ? savedFiles[KEY_TOTAL_SIZE] : 0;
+
+    if (size + totalSize <= MAX_SPACE_IN_B) {
+      resolve();
+      return;
+    }
+    // 如果加上新文件后大小超过最大限制，则进行 lru
+    const pathsShouldDelete = [];
+    // 按照最后一次的访问时间，从小到大排序
+    const allFiles = JSON.parse(JSON.stringify(savedFiles));
+    delete allFiles[KEY_TOTAL_SIZE];
+    const sortedKeys = Object.keys(allFiles).sort((a, b) => {
+      return allFiles[a][KEY_TIME] - allFiles[b][KEY_TIME];
+    });
+
+    for (const sortedKey of sortedKeys) {
+      totalSize -= savedFiles[sortedKey].size;
+      pathsShouldDelete.push(savedFiles[sortedKey][KEY_PATH]);
+      delete savedFiles[sortedKey];
+      if (totalSize + size < MAX_SPACE_IN_B) {
+        break;
+      }
+    }
+
+    savedFiles['totalSize'] = totalSize;
+
+    wx.setStorage({
+      key: SAVED_FILES_KEY,
+      data: savedFiles,
+      success: () => {
+        // 保证 storage 中不会存在不存在的文件数据
+        if (pathsShouldDelete.length > 0) {
+          removeFiles(pathsShouldDelete);
+        }
+        resolve();
+      },
+      fail: (error) => {
+        console.error(`doLru setStorage failed, ${JSON.stringify(error)}`);
+        reject();
+      },
+    });
+  });
+}
+
+function removeFiles(pathsShouldDelete) {
+  for (const pathDel of pathsShouldDelete) {
+    let delPath = pathDel;
+    if (typeof pathDel === 'object') {
+      delPath = pathDel.filePath;
+    }
+    if (delPath.indexOf('//usr/') !== -1) {
+      wx.getFileSystemManager().unlink({
+        filePath: delPath,
+        fail(error) {
+          console.error(`removeSavedFile ${pathDel} failed, ${JSON.stringify(error)}`);
+        }
+      })
+    } else {
+      wx.removeSavedFile({
+        filePath: delPath,
+        fail: (error) => {
+          console.error(`removeSavedFile ${pathDel} failed, ${JSON.stringify(error)}`);
+        },
+      });
+    }
+  }
+}
+
+function getFile(key) {
+  if (!savedFiles[key]) {
+    return;
+  }
+  savedFiles[key]['time'] = new Date().getTime();
+  wx.setStorage({
+    key: SAVED_FILES_KEY,
+    data: savedFiles,
+  });
+  return savedFiles[key];
+}

components/painter/lib/gradient.js

@@ -0,0 +1,102 @@
+/* eslint-disable */
+// 当ctx传入当前文件，const grd = ctx.createCircularGradient() 和 
+// const grd = this.ctx.createLinearGradient() 无效，因此只能分开处理
+// 先分析，在外部创建grd，再传入使用就可以
+
+!(function () {
+
+  var api = {
+    isGradient: function(bg) {
+      if (bg && (bg.startsWith('linear') || bg.startsWith('radial'))) {
+        return true;
+      } 
+      return false;
+    },
+
+    doGradient: function(bg, width, height, ctx) {
+      if (bg.startsWith('linear')) {
+        linearEffect(width, height, bg, ctx);
+      } else if (bg.startsWith('radial')) {
+        radialEffect(width, height, bg, ctx);
+      }
+    },
+  }
+
+  function analizeGrad(string) {
+    const colorPercents = string.substring(0, string.length - 1).split("%,");
+    const colors = [];
+    const percents = [];
+    for (let colorPercent of colorPercents) {
+      colors.push(colorPercent.substring(0, colorPercent.lastIndexOf(" ")).trim());
+      percents.push(colorPercent.substring(colorPercent.lastIndexOf(" "), colorPercent.length) / 100);
+    }
+    return {colors: colors, percents: percents};
+  }
+
+  function radialEffect(width, height, bg, ctx) {
+    const colorPer = analizeGrad(bg.match(/radial-gradient\((.+)\)/)[1]);
+    const grd = ctx.createRadialGradient(0, 0, 0, 0, 0, width < height ? height / 2 : width / 2);
+    for (let i = 0; i < colorPer.colors.length; i++) {
+      grd.addColorStop(colorPer.percents[i], colorPer.colors[i]);
+    }
+    ctx.fillStyle = grd;
+    //ctx.fillRect(-(width / 2), -(height / 2), width, height);
+  }
+
+  function analizeLinear(bg, width, height) {
+    const direction = bg.match(/([-]?\d{1,3})deg/);
+    const dir = direction && direction[1] ? parseFloat(direction[1]) : 0;
+    let coordinate;
+    switch (dir) {
+      case 0: coordinate = [0, -height / 2, 0, height / 2]; break;
+      case 90: coordinate = [width / 2, 0, -width / 2, 0]; break;
+      case -90: coordinate = [-width / 2, 0, width / 2, 0]; break;
+      case 180: coordinate = [0, height / 2, 0, -height / 2]; break;
+      case -180: coordinate = [0, -height / 2, 0, height / 2]; break;
+      default:
+        let x1 = 0;
+        let y1 = 0;
+        let x2 = 0;
+        let y2 = 0;
+        if (direction[1] > 0 && direction[1] < 90) {
+          x1 = (width / 2) - ((width / 2) * Math.tan((90 - direction[1]) * Math.PI * 2 / 360) - height / 2) * Math.sin(2 * (90 - direction[1]) * Math.PI * 2 / 360) / 2;
+          y2 = Math.tan((90 - direction[1]) * Math.PI * 2 / 360) * x1;
+          x2 = -x1;
+          y1 = -y2;
+        } else if (direction[1] > -180 && direction[1] < -90) {
+          x1 = -(width / 2) + ((width / 2) * Math.tan((90 - direction[1]) * Math.PI * 2 / 360) - height / 2) * Math.sin(2 * (90 - direction[1]) * Math.PI * 2 / 360) / 2;
+          y2 = Math.tan((90 - direction[1]) * Math.PI * 2 / 360) * x1;
+          x2 = -x1;
+          y1 = -y2;
+        } else if (direction[1] > 90 && direction[1] < 180) {
+          x1 = (width / 2) + (-(width / 2) * Math.tan((90 - direction[1]) * Math.PI * 2 / 360) - height / 2) * Math.sin(2 * (90 - direction[1]) * Math.PI * 2 / 360) / 2;
+          y2 = Math.tan((90 - direction[1]) * Math.PI * 2 / 360) * x1;
+          x2 = -x1;
+          y1 = -y2;
+        } else {
+          x1 = -(width / 2) - (-(width / 2) * Math.tan((90 - direction[1]) * Math.PI * 2 / 360) - height / 2) * Math.sin(2 * (90 - direction[1]) * Math.PI * 2 / 360) / 2;
+          y2 = Math.tan((90 - direction[1]) * Math.PI * 2 / 360) * x1;
+          x2 = -x1;
+          y1 = -y2;
+        }
+        coordinate = [x1, y1, x2, y2];
+      break;
+    }
+    return coordinate;
+  }
+
+  function linearEffect(width, height, bg, ctx) {
+    const param = analizeLinear(bg, width, height);
+    const grd = ctx.createLinearGradient(param[0], param[1], param[2], param[3]);
+    const content = bg.match(/linear-gradient\((.+)\)/)[1];
+    const colorPer = analizeGrad(content.substring(content.indexOf(',') + 1));
+    for (let i = 0; i < colorPer.colors.length; i++) {
+      grd.addColorStop(colorPer.percents[i], colorPer.colors[i]);
+    }
+    ctx.fillStyle = grd
+    //ctx.fillRect(-(width / 2), -(height / 2), width, height);
+  }
+
+  module.exports = { api }
+
+})();

components/painter/lib/pen.js

@@ -0,0 +1,903 @@
+const QR = require('./qrcode.js');
+const GD = require('./gradient.js');
+require('./string-polyfill.js');
+
+export const penCache = {
+  // 用于存储带 id 的 view 的 rect 信息
+  viewRect: {},
+  textLines: {},
+};
+export const clearPenCache = id => {
+  if (id) {
+    penCache.viewRect[id] = null;
+    penCache.textLines[id] = null;
+  } else {
+    penCache.viewRect = {};
+    penCache.textLines = {};
+  }
+};
+export default class Painter {
+  constructor(ctx, data) {
+    this.ctx = ctx;
+    this.data = data;
+  }
+
+  paint(callback) {
+    this.style = {
+      width: this.data.width.toPx(),
+      height: this.data.height.toPx(),
+    };
+
+    this._background();
+    for (const view of this.data.views) {
+      this._drawAbsolute(view);
+    }
+    this.ctx.draw(false, () => {
+      callback && callback();
+    });
+  }
+
+  _background() {
+    this.ctx.save();
+    const { width, height } = this.style;
+    const bg = this.data.background;
+    this.ctx.translate(width / 2, height / 2);
+
+    this._doClip(this.data.borderRadius, width, height);
+    if (!bg) {
+      // 如果未设置背景，则默认使用透明色
+      this.ctx.fillStyle = 'transparent';
+      this.ctx.fillRect(-(width / 2), -(height / 2), width, height);
+    } else if (bg.startsWith('#') || bg.startsWith('rgba') || bg.toLowerCase() === 'transparent') {
+      // 背景填充颜色
+      this.ctx.fillStyle = bg;
+      this.ctx.fillRect(-(width / 2), -(height / 2), width, height);
+    } else if (GD.api.isGradient(bg)) {
+      GD.api.doGradient(bg, width, height, this.ctx);
+      this.ctx.fillRect(-(width / 2), -(height / 2), width, height);
+    } else {
+      // 背景填充图片
+      this.ctx.drawImage(bg, -(width / 2), -(height / 2), width, height);
+    }
+    this.ctx.restore();
+  }
+
+  _drawAbsolute(view) {
+    if (!(view && view.type)) {
+      // 过滤无效 view
+      return;
+    }
+    // 证明 css 为数组形式，需要合并
+    if (view.css && view.css.length) {
+      /* eslint-disable no-param-reassign */
+      view.css = Object.assign(...view.css);
+    }
+    switch (view.type) {
+      case 'image':
+        this._drawAbsImage(view);
+        break;
+      case 'text':
+        this._fillAbsText(view);
+        break;
+      case 'inlineText':
+        this._fillAbsInlineText(view);
+        break;
+      case 'rect':
+        this._drawAbsRect(view);
+        break;
+      case 'qrcode':
+        this._drawQRCode(view);
+        break;
+      default:
+        break;
+    }
+  }
+
+  _border({ borderRadius = 0, width, height, borderWidth = 0, borderStyle = 'solid' }) {
+    let r1 = 0,
+      r2 = 0,
+      r3 = 0,
+      r4 = 0;
+    const minSize = Math.min(width, height);
+    if (borderRadius) {
+      const border = borderRadius.split(/\s+/);
+      if (border.length === 4) {
+        r1 = Math.min(border[0].toPx(false, minSize), width / 2, height / 2);
+        r2 = Math.min(border[1].toPx(false, minSize), width / 2, height / 2);
+        r3 = Math.min(border[2].toPx(false, minSize), width / 2, height / 2);
+        r4 = Math.min(border[3].toPx(false, minSize), width / 2, height / 2);
+      } else {
+        r1 = r2 = r3 = r4 = Math.min(borderRadius && borderRadius.toPx(false, minSize), width / 2, height / 2);
+      }
+    }
+    const lineWidth = borderWidth && borderWidth.toPx(false, minSize);
+    this.ctx.lineWidth = lineWidth;
+    if (borderStyle === 'dashed') {
+      this.ctx.setLineDash([(lineWidth * 4) / 3, (lineWidth * 4) / 3]);
+      // this.ctx.lineDashOffset = 2 * lineWidth
+    } else if (borderStyle === 'dotted') {
+      this.ctx.setLineDash([lineWidth, lineWidth]);
+    }
+    const notSolid = borderStyle !== 'solid';
+    this.ctx.beginPath();
+
+    notSolid && r1 === 0 && this.ctx.moveTo(-width / 2 - lineWidth, -height / 2 - lineWidth / 2); // 顶边虚线规避重叠规则
+    r1 !== 0 && this.ctx.arc(-width / 2 + r1, -height / 2 + r1, r1 + lineWidth / 2, 1 * Math.PI, 1.5 * Math.PI); //左上角圆弧
+    this.ctx.lineTo(
+      r2 === 0 ? (notSolid ? width / 2 : width / 2 + lineWidth / 2) : width / 2 - r2,
+      -height / 2 - lineWidth / 2,
+    ); // 顶边线
+
+    notSolid && r2 === 0 && this.ctx.moveTo(width / 2 + lineWidth / 2, -height / 2 - lineWidth); // 右边虚线规避重叠规则
+    r2 !== 0 && this.ctx.arc(width / 2 - r2, -height / 2 + r2, r2 + lineWidth / 2, 1.5 * Math.PI, 2 * Math.PI); // 右上角圆弧
+    this.ctx.lineTo(
+      width / 2 + lineWidth / 2,
+      r3 === 0 ? (notSolid ? height / 2 : height / 2 + lineWidth / 2) : height / 2 - r3,
+    ); // 右边线
+
+    notSolid && r3 === 0 && this.ctx.moveTo(width / 2 + lineWidth, height / 2 + lineWidth / 2); // 底边虚线规避重叠规则
+    r3 !== 0 && this.ctx.arc(width / 2 - r3, height / 2 - r3, r3 + lineWidth / 2, 0, 0.5 * Math.PI); // 右下角圆弧
+    this.ctx.lineTo(
+      r4 === 0 ? (notSolid ? -width / 2 : -width / 2 - lineWidth / 2) : -width / 2 + r4,
+      height / 2 + lineWidth / 2,
+    ); // 底边线
+
+    notSolid && r4 === 0 && this.ctx.moveTo(-width / 2 - lineWidth / 2, height / 2 + lineWidth); // 左边虚线规避重叠规则
+    r4 !== 0 && this.ctx.arc(-width / 2 + r4, height / 2 - r4, r4 + lineWidth / 2, 0.5 * Math.PI, 1 * Math.PI); // 左下角圆弧
+    this.ctx.lineTo(
+      -width / 2 - lineWidth / 2,
+      r1 === 0 ? (notSolid ? -height / 2 : -height / 2 - lineWidth / 2) : -height / 2 + r1,
+    ); // 左边线
+    notSolid && r1 === 0 && this.ctx.moveTo(-width / 2 - lineWidth, -height / 2 - lineWidth / 2); // 顶边虚线规避重叠规则
+
+    if (!notSolid) {
+      this.ctx.closePath();
+    }
+  }
+
+  /**
+   * 根据 borderRadius 进行裁减
+   */
+  _doClip(borderRadius, width, height, borderStyle) {
+    if (borderRadius && width && height) {
+      // 防止在某些机型上周边有黑框现象，此处如果直接设置 fillStyle 为透明，在 Android 机型上会导致被裁减的图片也变为透明， iOS 和 IDE 上不会
+      // globalAlpha 在 1.9.90 起支持，低版本下无效，但把 fillStyle 设为了 white，相对默认的 black 要好点
+      this.ctx.globalAlpha = 0;
+      this.ctx.fillStyle = 'white';
+      this._border({
+        borderRadius,
+        width,
+        height,
+        borderStyle,
+      });
+      this.ctx.fill();
+      // 在 ios 的 6.6.6 版本上 clip 有 bug，禁掉此类型上的 clip，也就意味着，在此版本微信的 ios 设备下无法使用 border 属性
+      if (!(getApp().systemInfo && getApp().systemInfo.version <= '6.6.6' && getApp().systemInfo.platform === 'ios')) {
+        this.ctx.clip();
+      }
+      this.ctx.globalAlpha = 1;
+    }
+  }
+
+  /**
+   * 画边框
+   */
+  _doBorder(view, width, height) {
+    if (!view.css) {
+      return;
+    }
+    const { borderRadius, borderWidth, borderColor, borderStyle } = view.css;
+    if (!borderWidth) {
+      return;
+    }
+    this.ctx.save();
+    this._preProcess(view, true);
+    this.ctx.strokeStyle = borderColor || 'black';
+    this._border({
+      borderRadius,
+      width,
+      height,
+      borderWidth,
+      borderStyle,
+    });
+    this.ctx.stroke();
+    this.ctx.restore();
+  }
+
+  _preProcess(view, notClip) {
+    let width = 0;
+    let height;
+    let extra;
+    const paddings = this._doPaddings(view);
+    switch (view.type) {
+      case 'inlineText': {
+        {
+          // 计算行数
+          let lines = 0;
+          // 文字总长度
+          let textLength = 0;
+          // 行高
+          let lineHeight = 0;
+          const textList = view.textList || [];
+          for (let i = 0; i < textList.length; i++) {
+            let subView = textList[i];
+            const fontWeight = subView.css.fontWeight || '400';
+            const textStyle = subView.css.textStyle || 'normal';
+            if (!subView.css.fontSize) {
+              subView.css.fontSize = '20rpx';
+            }
+            this.ctx.font = `${textStyle} ${fontWeight} ${subView.css.fontSize.toPx()}px "${subView.css.fontFamily || 'sans-serif'}"`;
+            textLength += this.ctx.measureText(subView.text).width;
+            let tempLineHeight = subView.css.lineHeight ? subView.css.lineHeight.toPx() : subView.css.fontSize.toPx();
+            lineHeight = Math.max(lineHeight, tempLineHeight);
+          }
+          width = view.css.width ? view.css.width.toPx(false, this.style.width) - paddings[1] - paddings[3] : textLength;;
+          const calLines = Math.ceil(textLength / width);
+
+          lines += calLines;
+          // lines = view.css.maxLines < lines ? view.css.maxLines : lines;
+          height = lineHeight * lines;
+          extra = {
+            lines: lines,
+            lineHeight: lineHeight,
+            // textArray: textArray,
+            // linesArray: linesArray,
+          };
+        }
+        break;
+      }
+      case 'text': {
+        const textArray = String(view.text).split('\n');
+        // 处理多个连续的'\n'
+        for (let i = 0; i < textArray.length; ++i) {
+          if (textArray[i] === '') {
+            textArray[i] = ' ';
+          }
+        }
+        const fontWeight = view.css.fontWeight || '400';
+        const textStyle = view.css.textStyle || 'normal';
+        if (!view.css.fontSize) {
+          view.css.fontSize = '20rpx';
+        }
+        this.ctx.font = `${textStyle} ${fontWeight} ${view.css.fontSize.toPx()}px "${
+          view.css.fontFamily || 'sans-serif'
+        }"`;
+        // 计算行数
+        let lines = 0;
+        const linesArray = [];
+        for (let i = 0; i < textArray.length; ++i) {
+          const textLength = this.ctx.measureText(textArray[i]).width;
+          const minWidth = view.css.fontSize.toPx() + paddings[1] + paddings[3];
+          let partWidth = view.css.width
+            ? view.css.width.toPx(false, this.style.width) - paddings[1] - paddings[3]
+            : textLength;
+          if (partWidth < minWidth) {
+            partWidth = minWidth;
+          }
+          const calLines = Math.ceil(textLength / partWidth);
+          // 取最长的作为 width
+          width = partWidth > width ? partWidth : width;
+          lines += calLines;
+          linesArray[i] = calLines;
+        }
+        lines = view.css.maxLines < lines ? view.css.maxLines : lines;
+        const lineHeight = view.css.lineHeight ? view.css.lineHeight.toPx() : view.css.fontSize.toPx();
+        height = lineHeight * lines;
+        extra = {
+          lines: lines,
+          lineHeight: lineHeight,
+          textArray: textArray,
+          linesArray: linesArray,
+        };
+        break;
+      }
+      case 'image': {
+        // image的长宽设置成auto的逻辑处理
+        const ratio = getApp().systemInfo.pixelRatio ? getApp().systemInfo.pixelRatio : 2;
+        // 有css却未设置width或height，则默认为auto
+        if (view.css) {
+          if (!view.css.width) {
+            view.css.width = 'auto';
+          }
+          if (!view.css.height) {
+            view.css.height = 'auto';
+          }
+        }
+        if (!view.css || (view.css.width === 'auto' && view.css.height === 'auto')) {
+          width = Math.round(view.sWidth / ratio);
+          height = Math.round(view.sHeight / ratio);
+        } else if (view.css.width === 'auto') {
+          height = view.css.height.toPx(false, this.style.height);
+          width = (view.sWidth / view.sHeight) * height;
+        } else if (view.css.height === 'auto') {
+          width = view.css.width.toPx(false, this.style.width);
+          height = (view.sHeight / view.sWidth) * width;
+        } else {
+          width = view.css.width.toPx(false, this.style.width);
+          height = view.css.height.toPx(false, this.style.height);
+        }
+        break;
+      }
+      default:
+        if (!(view.css.width && view.css.height)) {
+          console.error('You should set width and height');
+          return;
+        }
+        width = view.css.width.toPx(false, this.style.width);
+        height = view.css.height.toPx(false, this.style.height);
+        break;
+    }
+    let x;
+    if (view.css && view.css.right) {
+      if (typeof view.css.right === 'string') {
+        x = this.style.width - view.css.right.toPx(true, this.style.width);
+      } else {
+        // 可以用数组方式，把文字长度计算进去
+        // [right, 文字id, 乘数（默认 1）]
+        const rights = view.css.right;
+        x =
+          this.style.width -
+          rights[0].toPx(true, this.style.width) -
+          penCache.viewRect[rights[1]].width * (rights[2] || 1);
+      }
+    } else if (view.css && view.css.left) {
+      if (typeof view.css.left === 'string') {
+        x = view.css.left.toPx(true, this.style.width);
+      } else {
+        const lefts = view.css.left;
+        x = lefts[0].toPx(true, this.style.width) + penCache.viewRect[lefts[1]].width * (lefts[2] || 1);
+      }
+    } else {
+      x = 0;
+    }
+    //const y = view.css && view.css.bottom ? this.style.height - height - view.css.bottom.toPx(true) : (view.css && view.css.top ? view.css.top.toPx(true) : 0);
+    let y;
+    if (view.css && view.css.bottom) {
+      y = this.style.height - height - view.css.bottom.toPx(true, this.style.height);
+    } else {
+      if (view.css && view.css.top) {
+        if (typeof view.css.top === 'string') {
+          y = view.css.top.toPx(true, this.style.height);
+        } else {
+          const tops = view.css.top;
+          y = tops[0].toPx(true, this.style.height) + penCache.viewRect[tops[1]].height * (tops[2] || 1);
+        }
+      } else {
+        y = 0;
+      }
+    }
+
+    const angle = view.css && view.css.rotate ? this._getAngle(view.css.rotate) : 0;
+    // 当设置了 right 时，默认 align 用 right，反之用 left
+    const align = view.css && view.css.align ? view.css.align : view.css && view.css.right ? 'right' : 'left';
+    const verticalAlign = view.css && view.css.verticalAlign ? view.css.verticalAlign : 'top';
+    // 记录绘制时的画布
+    let xa = 0;
+    switch (align) {
+      case 'center':
+        xa = x;
+        break;
+      case 'right':
+        xa = x - width / 2;
+        break;
+      default:
+        xa = x + width / 2;
+        break;
+    }
+    let ya = 0;
+    switch (verticalAlign) {
+      case 'center':
+        ya = y;
+        break;
+      case 'bottom':
+        ya = y - height / 2;
+        break;
+      default:
+        ya = y + height / 2;
+        break;
+    }
+    this.ctx.translate(xa, ya);
+    // 记录该 view 的有效点击区域
+    // TODO ，旋转和裁剪的判断
+    // 记录在真实画布上的左侧
+    let left = x;
+    if (align === 'center') {
+      left = x - width / 2;
+    } else if (align === 'right') {
+      left = x - width;
+    }
+    var top = y;
+    if (verticalAlign === 'center') {
+      top = y - height / 2;
+    } else if (verticalAlign === 'bottom') {
+      top = y - height;
+    }
+    if (view.rect) {
+      view.rect.left = left;
+      view.rect.top = top;
+      view.rect.right = left + width;
+      view.rect.bottom = top + height;
+      view.rect.x = view.css && view.css.right ? x - width : x;
+      view.rect.y = y;
+    } else {
+      view.rect = {
+        left: left,
+        top: top,
+        right: left + width,
+        bottom: top + height,
+        x: view.css && view.css.right ? x - width : x,
+        y: y,
+      };
+    }
+
+    view.rect.left = view.rect.left - paddings[3];
+    view.rect.top = view.rect.top - paddings[0];
+    view.rect.right = view.rect.right + paddings[1];
+    view.rect.bottom = view.rect.bottom + paddings[2];
+    if (view.type === 'text') {
+      view.rect.minWidth = view.css.fontSize.toPx() + paddings[1] + paddings[3];
+    }
+
+    this.ctx.rotate(angle);
+    if (!notClip && view.css && view.css.borderRadius && view.type !== 'rect') {
+      this._doClip(view.css.borderRadius, width, height, view.css.borderStyle);
+    }
+    this._doShadow(view);
+    if (view.id) {
+      penCache.viewRect[view.id] = {
+        width,
+        height,
+        left: view.rect.left,
+        top: view.rect.top,
+        right: view.rect.right,
+        bottom: view.rect.bottom,
+      };
+    }
+    return {
+      width: width,
+      height: height,
+      x: x,
+      y: y,
+      extra: extra,
+    };
+  }
+
+  _doPaddings(view) {
+    const { padding } = view.css ? view.css : {};
+    let pd = [0, 0, 0, 0];
+    if (padding) {
+      const pdg = padding.split(/\s+/);
+      if (pdg.length === 1) {
+        const x = pdg[0].toPx();
+        pd = [x, x, x, x];
+      }
+      if (pdg.length === 2) {
+        const x = pdg[0].toPx();
+        const y = pdg[1].toPx();
+        pd = [x, y, x, y];
+      }
+      if (pdg.length === 3) {
+        const x = pdg[0].toPx();
+        const y = pdg[1].toPx();
+        const z = pdg[2].toPx();
+        pd = [x, y, z, y];
+      }
+      if (pdg.length === 4) {
+        const x = pdg[0].toPx();
+        const y = pdg[1].toPx();
+        const z = pdg[2].toPx();
+        const a = pdg[3].toPx();
+        pd = [x, y, z, a];
+      }
+    }
+    return pd;
+  }
+
+  // 画文字的背景图片
+  _doBackground(view) {
+    this.ctx.save();
+    const { width: rawWidth, height: rawHeight } = this._preProcess(view, true);
+
+    const { background } = view.css;
+    let pd = this._doPaddings(view);
+    const width = rawWidth + pd[1] + pd[3];
+    const height = rawHeight + pd[0] + pd[2];
+
+    this._doClip(view.css.borderRadius, width, height, view.css.borderStyle);
+    if (GD.api.isGradient(background)) {
+      GD.api.doGradient(background, width, height, this.ctx);
+    } else {
+      this.ctx.fillStyle = background;
+    }
+    this.ctx.fillRect(-(width / 2), -(height / 2), width, height);
+
+    this.ctx.restore();
+  }
+
+  _drawQRCode(view) {
+    this.ctx.save();
+    const { width, height } = this._preProcess(view);
+    QR.api.draw(view.content, this.ctx, -width / 2, -height / 2, width, height, view.css.background, view.css.color);
+    this.ctx.restore();
+    this._doBorder(view, width, height);
+  }
+
+  _drawAbsImage(view) {
+    if (!view.url) {
+      return;
+    }
+    this.ctx.save();
+    const { width, height } = this._preProcess(view);
+    // 获得缩放到图片大小级别的裁减框
+    let rWidth = view.sWidth;
+    let rHeight = view.sHeight;
+    let startX = 0;
+    let startY = 0;
+    // 绘画区域比例
+    const cp = width / height;
+    // 原图比例
+    const op = view.sWidth / view.sHeight;
+    if (cp >= op) {
+      rHeight = rWidth / cp;
+      startY = Math.round((view.sHeight - rHeight) / 2);
+    } else {
+      rWidth = rHeight * cp;
+      startX = Math.round((view.sWidth - rWidth) / 2);
+    }
+    if (view.css && view.css.mode === 'scaleToFill') {
+      this.ctx.drawImage(view.url, -(width / 2), -(height / 2), width, height);
+    } else {
+      this.ctx.drawImage(view.url, startX, startY, rWidth, rHeight, -(width / 2), -(height / 2), width, height);
+      view.rect.startX = startX / view.sWidth;
+      view.rect.startY = startY / view.sHeight;
+      view.rect.endX = (startX + rWidth) / view.sWidth;
+      view.rect.endY = (startY + rHeight) / view.sHeight;
+    }
+    this.ctx.restore();
+    this._doBorder(view, width, height);
+  }
+  /**
+   * 
+   * @param {*} view 
+   * @description 一行内文字多样式的方法
+   * 
+   * 暂不支持配置 text-align，默认left
+   * 暂不支持配置 maxLines
+   */
+  _fillAbsInlineText(view) {
+    if (!view.textList) {
+      return;
+    }
+    if (view.css.background) {
+      // 生成背景
+      this._doBackground(view);
+    }
+    this.ctx.save();
+    const { width, height, extra } = this._preProcess(view, view.css.background && view.css.borderRadius);
+    const { lines, lineHeight } = extra;
+    let staticX = -(width / 2);
+    let lineIndex = 0; // 第几行
+    let x = staticX; // 开始x位置
+    let leftWidth = width; // 当前行剩余多少宽度可以使用
+
+    let getStyle = css => {
+      const fontWeight = css.fontWeight || '400';
+      const textStyle = css.textStyle || 'normal';
+      if (!css.fontSize) {
+        css.fontSize = '20rpx';
+      }
+      return `${textStyle} ${fontWeight} ${css.fontSize.toPx()}px "${css.fontFamily || 'sans-serif'}"`;
+    }
+
+    // 遍历行内的文字数组
+    for (let j = 0; j < view.textList.length; j++) {
+      const subView = view.textList[j];
+
+      // 某个文字开始位置
+      let start = 0;
+      // 文字已使用的数量
+      let alreadyCount = 0;
+      // 文字总长度
+      let textLength = subView.text.length;
+      // 文字总宽度
+      let textWidth = this.ctx.measureText(subView.text).width;
+      // 每个文字的平均宽度
+      let preWidth = Math.ceil(textWidth / textLength);
+
+      // 循环写文字
+      while (alreadyCount < textLength) {
+        // alreadyCount - start + 1 -> 当前摘取出来的文字
+        // 比较可用宽度，寻找最大可写文字长度
+        while ((alreadyCount - start + 1) * preWidth < leftWidth && alreadyCount < textLength) {
+          alreadyCount++;
+        }
+
+        // 取出文字
+        let text = subView.text.substr(start, alreadyCount - start);
+
+        const y = -(height / 2) + subView.css.fontSize.toPx() + lineIndex * lineHeight;
+
+        // 设置文字样式
+        this.ctx.font = getStyle(subView.css);
+
+        this.ctx.fillStyle = subView.css.color || 'black';
+        this.ctx.textAlign = 'left';
+
+        // 执行画布操作
+        if (subView.css.textStyle === 'stroke') {
+          this.ctx.strokeText(text, x, y);
+        } else {
+          this.ctx.fillText(text, x, y);
+        }
+
+        // 当次已使用宽度
+        let currentUsedWidth = this.ctx.measureText(text).width;
+
+        const fontSize = subView.css.fontSize.toPx();
+
+        // 画 textDecoration
+        let textDecoration;
+        if (subView.css.textDecoration) {
+          this.ctx.lineWidth = fontSize / 13;
+          this.ctx.beginPath();
+          if (/\bunderline\b/.test(subView.css.textDecoration)) {
+            this.ctx.moveTo(x, y);
+            this.ctx.lineTo(x + currentUsedWidth, y);
+            textDecoration = {
+              moveTo: [x, y],
+              lineTo: [x + currentUsedWidth, y],
+            };
+          }
+          if (/\boverline\b/.test(subView.css.textDecoration)) {
+            this.ctx.moveTo(x, y - fontSize);
+            this.ctx.lineTo(x + currentUsedWidth, y - fontSize);
+            textDecoration = {
+              moveTo: [x, y - fontSize],
+              lineTo: [x + currentUsedWidth, y - fontSize],
+            };
+          }
+          if (/\bline-through\b/.test(subView.css.textDecoration)) {
+            this.ctx.moveTo(x, y - fontSize / 3);
+            this.ctx.lineTo(x + currentUsedWidth, y - fontSize / 3);
+            textDecoration = {
+              moveTo: [x, y - fontSize / 3],
+              lineTo: [x + currentUsedWidth, y - fontSize / 3],
+            };
+          }
+          this.ctx.closePath();
+          this.ctx.strokeStyle = subView.css.color;
+          this.ctx.stroke();
+        }
+
+        // 重置数据
+        start = alreadyCount;
+        leftWidth -= currentUsedWidth;
+        x += currentUsedWidth;
+        // 如果剩余宽度 小于等于0 或者小于一个字的平均宽度，换行
+        if (leftWidth <= 0 || leftWidth < preWidth) {
+          leftWidth = width;
+          x = staticX;
+          lineIndex++;
+        }
+      }
+    }
+
+    this.ctx.restore();
+    this._doBorder(view, width, height);
+  }
+
+  _fillAbsText(view) {
+    if (!view.text) {
+      return;
+    }
+    if (view.css.background) {
+      // 生成背景
+      this._doBackground(view);
+    }
+    this.ctx.save();
+    const { width, height, extra } = this._preProcess(view, view.css.background && view.css.borderRadius);
+    this.ctx.fillStyle = view.css.color || 'black';
+    if (view.id && penCache.textLines[view.id]) {
+      this.ctx.textAlign = view.css.textAlign ? view.css.textAlign : 'left';
+      for (const i of penCache.textLines[view.id]) {
+        const { measuredWith, text, x, y, textDecoration } = i;
+        if (view.css.textStyle === 'stroke') {
+          this.ctx.strokeText(text, x, y, measuredWith);
+        } else {
+          this.ctx.fillText(text, x, y, measuredWith);
+        }
+        if (textDecoration) {
+          const fontSize = view.css.fontSize.toPx();
+          this.ctx.lineWidth = fontSize / 13;
+          this.ctx.beginPath();
+          this.ctx.moveTo(...textDecoration.moveTo);
+          this.ctx.lineTo(...textDecoration.lineTo);
+          this.ctx.closePath();
+          this.ctx.strokeStyle = view.css.color;
+          this.ctx.stroke();
+        }
+      }
+    } else {
+      const { lines, lineHeight, textArray, linesArray } = extra;
+      // 如果设置了id，则保留 text 的长度
+      if (view.id) {
+        let textWidth = 0;
+        for (let i = 0; i < textArray.length; ++i) {
+          const _w = this.ctx.measureText(textArray[i]).width;
+          textWidth = _w > textWidth ? _w : textWidth;
+        }
+        penCache.viewRect[view.id].width = width ? (textWidth < width ? textWidth : width) : textWidth;
+      }
+      let lineIndex = 0;
+      for (let j = 0; j < textArray.length; ++j) {
+        const preLineLength = Math.ceil(textArray[j].length / linesArray[j]);
+        let start = 0;
+        let alreadyCount = 0;
+
+        for (let i = 0; i < linesArray[j]; ++i) {
+          // 绘制行数大于最大行数，则直接跳出循环
+          if (lineIndex >= lines) {
+            break;
+          }
+          alreadyCount = preLineLength;
+          let text = textArray[j].substr(start, alreadyCount);
+          let measuredWith = this.ctx.measureText(text).width;
+          // 如果测量大小小于width一个字符的大小，则进行补齐，如果测量大小超出 width，则进行减除
+          // 如果已经到文本末尾，也不要进行该循环
+          while (
+            start + alreadyCount <= textArray[j].length &&
+            (width - measuredWith > view.css.fontSize.toPx() || measuredWith - width > view.css.fontSize.toPx())
+          ) {
+            if (measuredWith < width) {
+              text = textArray[j].substr(start, ++alreadyCount);
+            } else {
+              if (text.length <= 1) {
+                // 如果只有一个字符时，直接跳出循环
+                break;
+              }
+              text = textArray[j].substr(start, --alreadyCount);
+              // break;
+            }
+            measuredWith = this.ctx.measureText(text).width;
+          }
+          start += text.length;
+          // 如果是最后一行了，发现还有未绘制完的内容，则加...
+          if (lineIndex === lines - 1 && (j < textArray.length - 1 || start < textArray[j].length)) {
+            while (this.ctx.measureText(`${text}...`).width > width) {
+              if (text.length <= 1) {
+                // 如果只有一个字符时，直接跳出循环
+                break;
+              }
+              text = text.substring(0, text.length - 1);
+            }
+            text += '...';
+            measuredWith = this.ctx.measureText(text).width;
+          }
+          this.ctx.textAlign = view.css.textAlign ? view.css.textAlign : 'left';
+          let x;
+          let lineX;
+          switch (view.css.textAlign) {
+            case 'center':
+              x = 0;
+              lineX = x - measuredWith / 2;
+              break;
+            case 'right':
+              x = width / 2;
+              lineX = x - measuredWith;
+              break;
+            default:
+              x = -(width / 2);
+              lineX = x;
+              break;
+          }
+
+          const y =
+            -(height / 2) +
+            (lineIndex === 0 ? view.css.fontSize.toPx() : view.css.fontSize.toPx() + lineIndex * lineHeight);
+          lineIndex++;
+          if (view.css.textStyle === 'stroke') {
+            this.ctx.strokeText(text, x, y, measuredWith);
+          } else {
+            this.ctx.fillText(text, x, y, measuredWith);
+          }
+          const fontSize = view.css.fontSize.toPx();
+          let textDecoration;
+          if (view.css.textDecoration) {
+            this.ctx.lineWidth = fontSize / 13;
+            this.ctx.beginPath();
+            if (/\bunderline\b/.test(view.css.textDecoration)) {
+              this.ctx.moveTo(lineX, y);
+              this.ctx.lineTo(lineX + measuredWith, y);
+              textDecoration = {
+                moveTo: [lineX, y],
+                lineTo: [lineX + measuredWith, y],
+              };
+            }
+            if (/\boverline\b/.test(view.css.textDecoration)) {
+              this.ctx.moveTo(lineX, y - fontSize);
+              this.ctx.lineTo(lineX + measuredWith, y - fontSize);
+              textDecoration = {
+                moveTo: [lineX, y - fontSize],
+                lineTo: [lineX + measuredWith, y - fontSize],
+              };
+            }
+            if (/\bline-through\b/.test(view.css.textDecoration)) {
+              this.ctx.moveTo(lineX, y - fontSize / 3);
+              this.ctx.lineTo(lineX + measuredWith, y - fontSize / 3);
+              textDecoration = {
+                moveTo: [lineX, y - fontSize / 3],
+                lineTo: [lineX + measuredWith, y - fontSize / 3],
+              };
+            }
+            this.ctx.closePath();
+            this.ctx.strokeStyle = view.css.color;
+            this.ctx.stroke();
+          }
+          if (view.id) {
+            penCache.textLines[view.id]
+              ? penCache.textLines[view.id].push({
+                  text,
+                  x,
+                  y,
+                  measuredWith,
+                  textDecoration,
+                })
+              : (penCache.textLines[view.id] = [
+                  {
+                    text,
+                    x,
+                    y,
+                    measuredWith,
+                    textDecoration,
+                  },
+                ]);
+          }
+        }
+      }
+    }
+    this.ctx.restore();
+    this._doBorder(view, width, height);
+  }
+
+  _drawAbsRect(view) {
+    this.ctx.save();
+    const { width, height } = this._preProcess(view);
+    if (GD.api.isGradient(view.css.color)) {
+      GD.api.doGradient(view.css.color, width, height, this.ctx);
+    } else {
+      this.ctx.fillStyle = view.css.color;
+    }
+    const { borderRadius, borderStyle, borderWidth } = view.css;
+    this._border({
+      borderRadius,
+      width,
+      height,
+      borderWidth,
+      borderStyle,
+    });
+    this.ctx.fill();
+    this.ctx.restore();
+    this._doBorder(view, width, height);
+  }
+
+  // shadow 支持 (x, y, blur, color), 不支持 spread
+  // shadow:0px 0px 10px rgba(0,0,0,0.1);
+  _doShadow(view) {
+    if (!view.css || !view.css.shadow) {
+      return;
+    }
+    const box = view.css.shadow.replace(/,\s+/g, ',').split(/\s+/);
+    if (box.length > 4) {
+      console.error("shadow don't spread option");
+      return;
+    }
+    this.ctx.shadowOffsetX = parseInt(box[0], 10);
+    this.ctx.shadowOffsetY = parseInt(box[1], 10);
+    this.ctx.shadowBlur = parseInt(box[2], 10);
+    this.ctx.shadowColor = box[3];
+  }
+
+  _getAngle(angle) {
+    return (Number(angle) * Math.PI) / 180;
+  }
+}

components/painter/lib/qrcode.js

@@ -0,0 +1,784 @@
+/* eslint-disable */
+!(function () {
+
+  // alignment pattern
+  var adelta = [
+    0, 11, 15, 19, 23, 27, 31,
+    16, 18, 20, 22, 24, 26, 28, 20, 22, 24, 24, 26, 28, 28, 22, 24, 24,
+    26, 26, 28, 28, 24, 24, 26, 26, 26, 28, 28, 24, 26, 26, 26, 28, 28
+  ];
+
+  // version block
+  var vpat = [
+    0xc94, 0x5bc, 0xa99, 0x4d3, 0xbf6, 0x762, 0x847, 0x60d,
+    0x928, 0xb78, 0x45d, 0xa17, 0x532, 0x9a6, 0x683, 0x8c9,
+    0x7ec, 0xec4, 0x1e1, 0xfab, 0x08e, 0xc1a, 0x33f, 0xd75,
+    0x250, 0x9d5, 0x6f0, 0x8ba, 0x79f, 0xb0b, 0x42e, 0xa64,
+    0x541, 0xc69
+  ];
+
+  // final format bits with mask: level << 3 | mask
+  var fmtword = [
+    0x77c4, 0x72f3, 0x7daa, 0x789d, 0x662f, 0x6318, 0x6c41, 0x6976,    //L
+    0x5412, 0x5125, 0x5e7c, 0x5b4b, 0x45f9, 0x40ce, 0x4f97, 0x4aa0,    //M
+    0x355f, 0x3068, 0x3f31, 0x3a06, 0x24b4, 0x2183, 0x2eda, 0x2bed,    //Q
+    0x1689, 0x13be, 0x1ce7, 0x19d0, 0x0762, 0x0255, 0x0d0c, 0x083b    //H
+  ];
+
+  // 4 per version: number of blocks 1,2; data width; ecc width
+  var eccblocks = [
+    1, 0, 19, 7, 1, 0, 16, 10, 1, 0, 13, 13, 1, 0, 9, 17,
+    1, 0, 34, 10, 1, 0, 28, 16, 1, 0, 22, 22, 1, 0, 16, 28,
+    1, 0, 55, 15, 1, 0, 44, 26, 2, 0, 17, 18, 2, 0, 13, 22,
+    1, 0, 80, 20, 2, 0, 32, 18, 2, 0, 24, 26, 4, 0, 9, 16,
+    1, 0, 108, 26, 2, 0, 43, 24, 2, 2, 15, 18, 2, 2, 11, 22,
+    2, 0, 68, 18, 4, 0, 27, 16, 4, 0, 19, 24, 4, 0, 15, 28,
+    2, 0, 78, 20, 4, 0, 31, 18, 2, 4, 14, 18, 4, 1, 13, 26,
+    2, 0, 97, 24, 2, 2, 38, 22, 4, 2, 18, 22, 4, 2, 14, 26,
+    2, 0, 116, 30, 3, 2, 36, 22, 4, 4, 16, 20, 4, 4, 12, 24,
+    2, 2, 68, 18, 4, 1, 43, 26, 6, 2, 19, 24, 6, 2, 15, 28,
+    4, 0, 81, 20, 1, 4, 50, 30, 4, 4, 22, 28, 3, 8, 12, 24,
+    2, 2, 92, 24, 6, 2, 36, 22, 4, 6, 20, 26, 7, 4, 14, 28,
+    4, 0, 107, 26, 8, 1, 37, 22, 8, 4, 20, 24, 12, 4, 11, 22,
+    3, 1, 115, 30, 4, 5, 40, 24, 11, 5, 16, 20, 11, 5, 12, 24,
+    5, 1, 87, 22, 5, 5, 41, 24, 5, 7, 24, 30, 11, 7, 12, 24,
+    5, 1, 98, 24, 7, 3, 45, 28, 15, 2, 19, 24, 3, 13, 15, 30,
+    1, 5, 107, 28, 10, 1, 46, 28, 1, 15, 22, 28, 2, 17, 14, 28,
+    5, 1, 120, 30, 9, 4, 43, 26, 17, 1, 22, 28, 2, 19, 14, 28,
+    3, 4, 113, 28, 3, 11, 44, 26, 17, 4, 21, 26, 9, 16, 13, 26,
+    3, 5, 107, 28, 3, 13, 41, 26, 15, 5, 24, 30, 15, 10, 15, 28,
+    4, 4, 116, 28, 17, 0, 42, 26, 17, 6, 22, 28, 19, 6, 16, 30,
+    2, 7, 111, 28, 17, 0, 46, 28, 7, 16, 24, 30, 34, 0, 13, 24,
+    4, 5, 121, 30, 4, 14, 47, 28, 11, 14, 24, 30, 16, 14, 15, 30,
+    6, 4, 117, 30, 6, 14, 45, 28, 11, 16, 24, 30, 30, 2, 16, 30,
+    8, 4, 106, 26, 8, 13, 47, 28, 7, 22, 24, 30, 22, 13, 15, 30,
+    10, 2, 114, 28, 19, 4, 46, 28, 28, 6, 22, 28, 33, 4, 16, 30,
+    8, 4, 122, 30, 22, 3, 45, 28, 8, 26, 23, 30, 12, 28, 15, 30,
+    3, 10, 117, 30, 3, 23, 45, 28, 4, 31, 24, 30, 11, 31, 15, 30,
+    7, 7, 116, 30, 21, 7, 45, 28, 1, 37, 23, 30, 19, 26, 15, 30,
+    5, 10, 115, 30, 19, 10, 47, 28, 15, 25, 24, 30, 23, 25, 15, 30,
+    13, 3, 115, 30, 2, 29, 46, 28, 42, 1, 24, 30, 23, 28, 15, 30,
+    17, 0, 115, 30, 10, 23, 46, 28, 10, 35, 24, 30, 19, 35, 15, 30,
+    17, 1, 115, 30, 14, 21, 46, 28, 29, 19, 24, 30, 11, 46, 15, 30,
+    13, 6, 115, 30, 14, 23, 46, 28, 44, 7, 24, 30, 59, 1, 16, 30,
+    12, 7, 121, 30, 12, 26, 47, 28, 39, 14, 24, 30, 22, 41, 15, 30,
+    6, 14, 121, 30, 6, 34, 47, 28, 46, 10, 24, 30, 2, 64, 15, 30,
+    17, 4, 122, 30, 29, 14, 46, 28, 49, 10, 24, 30, 24, 46, 15, 30,
+    4, 18, 122, 30, 13, 32, 46, 28, 48, 14, 24, 30, 42, 32, 15, 30,
+    20, 4, 117, 30, 40, 7, 47, 28, 43, 22, 24, 30, 10, 67, 15, 30,
+    19, 6, 118, 30, 18, 31, 47, 28, 34, 34, 24, 30, 20, 61, 15, 30
+  ];
+
+  // Galois field log table
+  var glog = [
+    0xff, 0x00, 0x01, 0x19, 0x02, 0x32, 0x1a, 0xc6, 0x03, 0xdf, 0x33, 0xee, 0x1b, 0x68, 0xc7, 0x4b,
+    0x04, 0x64, 0xe0, 0x0e, 0x34, 0x8d, 0xef, 0x81, 0x1c, 0xc1, 0x69, 0xf8, 0xc8, 0x08, 0x4c, 0x71,
+    0x05, 0x8a, 0x65, 0x2f, 0xe1, 0x24, 0x0f, 0x21, 0x35, 0x93, 0x8e, 0xda, 0xf0, 0x12, 0x82, 0x45,
+    0x1d, 0xb5, 0xc2, 0x7d, 0x6a, 0x27, 0xf9, 0xb9, 0xc9, 0x9a, 0x09, 0x78, 0x4d, 0xe4, 0x72, 0xa6,
+    0x06, 0xbf, 0x8b, 0x62, 0x66, 0xdd, 0x30, 0xfd, 0xe2, 0x98, 0x25, 0xb3, 0x10, 0x91, 0x22, 0x88,
+    0x36, 0xd0, 0x94, 0xce, 0x8f, 0x96, 0xdb, 0xbd, 0xf1, 0xd2, 0x13, 0x5c, 0x83, 0x38, 0x46, 0x40,
+    0x1e, 0x42, 0xb6, 0xa3, 0xc3, 0x48, 0x7e, 0x6e, 0x6b, 0x3a, 0x28, 0x54, 0xfa, 0x85, 0xba, 0x3d,
+    0xca, 0x5e, 0x9b, 0x9f, 0x0a, 0x15, 0x79, 0x2b, 0x4e, 0xd4, 0xe5, 0xac, 0x73, 0xf3, 0xa7, 0x57,
+    0x07, 0x70, 0xc0, 0xf7, 0x8c, 0x80, 0x63, 0x0d, 0x67, 0x4a, 0xde, 0xed, 0x31, 0xc5, 0xfe, 0x18,
+    0xe3, 0xa5, 0x99, 0x77, 0x26, 0xb8, 0xb4, 0x7c, 0x11, 0x44, 0x92, 0xd9, 0x23, 0x20, 0x89, 0x2e,
+    0x37, 0x3f, 0xd1, 0x5b, 0x95, 0xbc, 0xcf, 0xcd, 0x90, 0x87, 0x97, 0xb2, 0xdc, 0xfc, 0xbe, 0x61,
+    0xf2, 0x56, 0xd3, 0xab, 0x14, 0x2a, 0x5d, 0x9e, 0x84, 0x3c, 0x39, 0x53, 0x47, 0x6d, 0x41, 0xa2,
+    0x1f, 0x2d, 0x43, 0xd8, 0xb7, 0x7b, 0xa4, 0x76, 0xc4, 0x17, 0x49, 0xec, 0x7f, 0x0c, 0x6f, 0xf6,
+    0x6c, 0xa1, 0x3b, 0x52, 0x29, 0x9d, 0x55, 0xaa, 0xfb, 0x60, 0x86, 0xb1, 0xbb, 0xcc, 0x3e, 0x5a,
+    0xcb, 0x59, 0x5f, 0xb0, 0x9c, 0xa9, 0xa0, 0x51, 0x0b, 0xf5, 0x16, 0xeb, 0x7a, 0x75, 0x2c, 0xd7,
+    0x4f, 0xae, 0xd5, 0xe9, 0xe6, 0xe7, 0xad, 0xe8, 0x74, 0xd6, 0xf4, 0xea, 0xa8, 0x50, 0x58, 0xaf
+  ];
+
+  // Galios field exponent table
+  var gexp = [
+    0x01, 0x02, 0x04, 0x08, 0x10, 0x20, 0x40, 0x80, 0x1d, 0x3a, 0x74, 0xe8, 0xcd, 0x87, 0x13, 0x26,
+    0x4c, 0x98, 0x2d, 0x5a, 0xb4, 0x75, 0xea, 0xc9, 0x8f, 0x03, 0x06, 0x0c, 0x18, 0x30, 0x60, 0xc0,
+    0x9d, 0x27, 0x4e, 0x9c, 0x25, 0x4a, 0x94, 0x35, 0x6a, 0xd4, 0xb5, 0x77, 0xee, 0xc1, 0x9f, 0x23,
+    0x46, 0x8c, 0x05, 0x0a, 0x14, 0x28, 0x50, 0xa0, 0x5d, 0xba, 0x69, 0xd2, 0xb9, 0x6f, 0xde, 0xa1,
+    0x5f, 0xbe, 0x61, 0xc2, 0x99, 0x2f, 0x5e, 0xbc, 0x65, 0xca, 0x89, 0x0f, 0x1e, 0x3c, 0x78, 0xf0,
+    0xfd, 0xe7, 0xd3, 0xbb, 0x6b, 0xd6, 0xb1, 0x7f, 0xfe, 0xe1, 0xdf, 0xa3, 0x5b, 0xb6, 0x71, 0xe2,
+    0xd9, 0xaf, 0x43, 0x86, 0x11, 0x22, 0x44, 0x88, 0x0d, 0x1a, 0x34, 0x68, 0xd0, 0xbd, 0x67, 0xce,
+    0x81, 0x1f, 0x3e, 0x7c, 0xf8, 0xed, 0xc7, 0x93, 0x3b, 0x76, 0xec, 0xc5, 0x97, 0x33, 0x66, 0xcc,
+    0x85, 0x17, 0x2e, 0x5c, 0xb8, 0x6d, 0xda, 0xa9, 0x4f, 0x9e, 0x21, 0x42, 0x84, 0x15, 0x2a, 0x54,
+    0xa8, 0x4d, 0x9a, 0x29, 0x52, 0xa4, 0x55, 0xaa, 0x49, 0x92, 0x39, 0x72, 0xe4, 0xd5, 0xb7, 0x73,
+    0xe6, 0xd1, 0xbf, 0x63, 0xc6, 0x91, 0x3f, 0x7e, 0xfc, 0xe5, 0xd7, 0xb3, 0x7b, 0xf6, 0xf1, 0xff,
+    0xe3, 0xdb, 0xab, 0x4b, 0x96, 0x31, 0x62, 0xc4, 0x95, 0x37, 0x6e, 0xdc, 0xa5, 0x57, 0xae, 0x41,
+    0x82, 0x19, 0x32, 0x64, 0xc8, 0x8d, 0x07, 0x0e, 0x1c, 0x38, 0x70, 0xe0, 0xdd, 0xa7, 0x53, 0xa6,
+    0x51, 0xa2, 0x59, 0xb2, 0x79, 0xf2, 0xf9, 0xef, 0xc3, 0x9b, 0x2b, 0x56, 0xac, 0x45, 0x8a, 0x09,
+    0x12, 0x24, 0x48, 0x90, 0x3d, 0x7a, 0xf4, 0xf5, 0xf7, 0xf3, 0xfb, 0xeb, 0xcb, 0x8b, 0x0b, 0x16,
+    0x2c, 0x58, 0xb0, 0x7d, 0xfa, 0xe9, 0xcf, 0x83, 0x1b, 0x36, 0x6c, 0xd8, 0xad, 0x47, 0x8e, 0x00
+  ];
+
+  // Working buffers:
+  // data input and ecc append, image working buffer, fixed part of image, run lengths for badness
+  var strinbuf = [], eccbuf = [], qrframe = [], framask = [], rlens = [];
+  // Control values - width is based on version, last 4 are from table.
+  var version, width, neccblk1, neccblk2, datablkw, eccblkwid;
+  var ecclevel = 2;
+  // set bit to indicate cell in qrframe is immutable.  symmetric around diagonal
+  function setmask(x, y) {
+    var bt;
+    if (x > y) {
+      bt = x;
+      x = y;
+      y = bt;
+    }
+    // y*y = 1+3+5...
+    bt = y;
+    bt *= y;
+    bt += y;
+    bt >>= 1;
+    bt += x;
+    framask[bt] = 1;
+  }
+
+  // enter alignment pattern - black to qrframe, white to mask (later black frame merged to mask)
+  function putalign(x, y) {
+    var j;
+
+    qrframe[x + width * y] = 1;
+    for (j = -2; j < 2; j++) {
+      qrframe[(x + j) + width * (y - 2)] = 1;
+      qrframe[(x - 2) + width * (y + j + 1)] = 1;
+      qrframe[(x + 2) + width * (y + j)] = 1;
+      qrframe[(x + j + 1) + width * (y + 2)] = 1;
+    }
+    for (j = 0; j < 2; j++) {
+      setmask(x - 1, y + j);
+      setmask(x + 1, y - j);
+      setmask(x - j, y - 1);
+      setmask(x + j, y + 1);
+    }
+  }
+
+  //========================================================================
+  // Reed Solomon error correction
+  // exponentiation mod N
+  function modnn(x) {
+    while (x >= 255) {
+      x -= 255;
+      x = (x >> 8) + (x & 255);
+    }
+    return x;
+  }
+
+  var genpoly = [];
+
+  // Calculate and append ECC data to data block.  Block is in strinbuf, indexes to buffers given.
+  function appendrs(data, dlen, ecbuf, eclen) {
+    var i, j, fb;
+
+    for (i = 0; i < eclen; i++)
+      strinbuf[ecbuf + i] = 0;
+    for (i = 0; i < dlen; i++) {
+      fb = glog[strinbuf[data + i] ^ strinbuf[ecbuf]];
+      if (fb != 255)     /* fb term is non-zero */
+        for (j = 1; j < eclen; j++)
+          strinbuf[ecbuf + j - 1] = strinbuf[ecbuf + j] ^ gexp[modnn(fb + genpoly[eclen - j])];
+      else
+        for (j = ecbuf; j < ecbuf + eclen; j++)
+          strinbuf[j] = strinbuf[j + 1];
+      strinbuf[ecbuf + eclen - 1] = fb == 255 ? 0 : gexp[modnn(fb + genpoly[0])];
+    }
+  }
+
+  //========================================================================
+  // Frame data insert following the path rules
+
+  // check mask - since symmetrical use half.
+  function ismasked(x, y) {
+    var bt;
+    if (x > y) {
+      bt = x;
+      x = y;
+      y = bt;
+    }
+    bt = y;
+    bt += y * y;
+    bt >>= 1;
+    bt += x;
+    return framask[bt];
+  }
+
+  //========================================================================
+  //  Apply the selected mask out of the 8.
+  function applymask(m) {
+    var x, y, r3x, r3y;
+
+    switch (m) {
+      case 0:
+        for (y = 0; y < width; y++)
+          for (x = 0; x < width; x++)
+            if (!((x + y) & 1) && !ismasked(x, y))
+              qrframe[x + y * width] ^= 1;
+        break;
+      case 1:
+        for (y = 0; y < width; y++)
+          for (x = 0; x < width; x++)
+            if (!(y & 1) && !ismasked(x, y))
+              qrframe[x + y * width] ^= 1;
+        break;
+      case 2:
+        for (y = 0; y < width; y++)
+          for (r3x = 0, x = 0; x < width; x++ , r3x++) {
+            if (r3x == 3)
+              r3x = 0;
+            if (!r3x && !ismasked(x, y))
+              qrframe[x + y * width] ^= 1;
+          }
+        break;
+      case 3:
+        for (r3y = 0, y = 0; y < width; y++ , r3y++) {
+          if (r3y == 3)
+            r3y = 0;
+          for (r3x = r3y, x = 0; x < width; x++ , r3x++) {
+            if (r3x == 3)
+              r3x = 0;
+            if (!r3x && !ismasked(x, y))
+              qrframe[x + y * width] ^= 1;
+          }
+        }
+        break;
+      case 4:
+        for (y = 0; y < width; y++)
+          for (r3x = 0, r3y = ((y >> 1) & 1), x = 0; x < width; x++ , r3x++) {
+            if (r3x == 3) {
+              r3x = 0;
+              r3y = !r3y;
+            }
+            if (!r3y && !ismasked(x, y))
+              qrframe[x + y * width] ^= 1;
+          }
+        break;
+      case 5:
+        for (r3y = 0, y = 0; y < width; y++ , r3y++) {
+          if (r3y == 3)
+            r3y = 0;
+          for (r3x = 0, x = 0; x < width; x++ , r3x++) {
+            if (r3x == 3)
+              r3x = 0;
+            if (!((x & y & 1) + !(!r3x | !r3y)) && !ismasked(x, y))
+              qrframe[x + y * width] ^= 1;
+          }
+        }
+        break;
+      case 6:
+        for (r3y = 0, y = 0; y < width; y++ , r3y++) {
+          if (r3y == 3)
+            r3y = 0;
+          for (r3x = 0, x = 0; x < width; x++ , r3x++) {
+            if (r3x == 3)
+              r3x = 0;
+            if (!(((x & y & 1) + (r3x && (r3x == r3y))) & 1) && !ismasked(x, y))
+              qrframe[x + y * width] ^= 1;
+          }
+        }
+        break;
+      case 7:
+        for (r3y = 0, y = 0; y < width; y++ , r3y++) {
+          if (r3y == 3)
+            r3y = 0;
+          for (r3x = 0, x = 0; x < width; x++ , r3x++) {
+            if (r3x == 3)
+              r3x = 0;
+            if (!(((r3x && (r3x == r3y)) + ((x + y) & 1)) & 1) && !ismasked(x, y))
+              qrframe[x + y * width] ^= 1;
+          }
+        }
+        break;
+    }
+    return;
+  }
+
+  // Badness coefficients.
+  var N1 = 3, N2 = 3, N3 = 40, N4 = 10;
+
+  // Using the table of the length of each run, calculate the amount of bad image 
+  // - long runs or those that look like finders; called twice, once each for X and Y
+  function badruns(length) {
+    var i;
+    var runsbad = 0;
+    for (i = 0; i <= length; i++)
+      if (rlens[i] >= 5)
+        runsbad += N1 + rlens[i] - 5;
+    // BwBBBwB as in finder
+    for (i = 3; i < length - 1; i += 2)
+      if (rlens[i - 2] == rlens[i + 2]
+        && rlens[i + 2] == rlens[i - 1]
+        && rlens[i - 1] == rlens[i + 1]
+        && rlens[i - 1] * 3 == rlens[i]
+        // white around the black pattern? Not part of spec
+        && (rlens[i - 3] == 0 // beginning
+          || i + 3 > length  // end
+          || rlens[i - 3] * 3 >= rlens[i] * 4 || rlens[i + 3] * 3 >= rlens[i] * 4)
+      )
+        runsbad += N3;
+    return runsbad;
+  }
+
+  // Calculate how bad the masked image is - blocks, imbalance, runs, or finders.
+  function badcheck() {
+    var x, y, h, b, b1;
+    var thisbad = 0;
+    var bw = 0;
+
+    // blocks of same color.
+    for (y = 0; y < width - 1; y++)
+      for (x = 0; x < width - 1; x++)
+        if ((qrframe[x + width * y] && qrframe[(x + 1) + width * y]
+          && qrframe[x + width * (y + 1)] && qrframe[(x + 1) + width * (y + 1)]) // all black
+          || !(qrframe[x + width * y] || qrframe[(x + 1) + width * y]
+            || qrframe[x + width * (y + 1)] || qrframe[(x + 1) + width * (y + 1)])) // all white
+          thisbad += N2;
+
+    // X runs
+    for (y = 0; y < width; y++) {
+      rlens[0] = 0;
+      for (h = b = x = 0; x < width; x++) {
+        if ((b1 = qrframe[x + width * y]) == b)
+          rlens[h]++;
+        else
+          rlens[++h] = 1;
+        b = b1;
+        bw += b ? 1 : -1;
+      }
+      thisbad += badruns(h);
+    }
+
+    // black/white imbalance
+    if (bw < 0)
+      bw = -bw;
+
+    var big = bw;
+    var count = 0;
+    big += big << 2;
+    big <<= 1;
+    while (big > width * width)
+      big -= width * width, count++;
+    thisbad += count * N4;
+
+    // Y runs
+    for (x = 0; x < width; x++) {
+      rlens[0] = 0;
+      for (h = b = y = 0; y < width; y++) {
+        if ((b1 = qrframe[x + width * y]) == b)
+          rlens[h]++;
+        else
+          rlens[++h] = 1;
+        b = b1;
+      }
+      thisbad += badruns(h);
+    }
+    return thisbad;
+  }
+
+  function genframe(instring) {
+    var x, y, k, t, v, i, j, m;
+
+    // find the smallest version that fits the string
+    t = instring.length;
+    version = 0;
+    do {
+      version++;
+      k = (ecclevel - 1) * 4 + (version - 1) * 16;
+      neccblk1 = eccblocks[k++];
+      neccblk2 = eccblocks[k++];
+      datablkw = eccblocks[k++];
+      eccblkwid = eccblocks[k];
+      k = datablkw * (neccblk1 + neccblk2) + neccblk2 - 3 + (version <= 9);
+      if (t <= k)
+        break;
+    } while (version < 40);
+
+    // FIXME - insure that it fits insted of being truncated
+    width = 17 + 4 * version;
+
+    // allocate, clear and setup data structures
+    v = datablkw + (datablkw + eccblkwid) * (neccblk1 + neccblk2) + neccblk2;
+    for (t = 0; t < v; t++)
+      eccbuf[t] = 0;
+    strinbuf = instring.slice(0);
+
+    for (t = 0; t < width * width; t++)
+      qrframe[t] = 0;
+
+    for (t = 0; t < (width * (width + 1) + 1) / 2; t++)
+      framask[t] = 0;
+
+    // insert finders - black to frame, white to mask
+    for (t = 0; t < 3; t++) {
+      k = 0;
+      y = 0;
+      if (t == 1)
+        k = (width - 7);
+      if (t == 2)
+        y = (width - 7);
+      qrframe[(y + 3) + width * (k + 3)] = 1;
+      for (x = 0; x < 6; x++) {
+        qrframe[(y + x) + width * k] = 1;
+        qrframe[y + width * (k + x + 1)] = 1;
+        qrframe[(y + 6) + width * (k + x)] = 1;
+        qrframe[(y + x + 1) + width * (k + 6)] = 1;
+      }
+      for (x = 1; x < 5; x++) {
+        setmask(y + x, k + 1);
+        setmask(y + 1, k + x + 1);
+        setmask(y + 5, k + x);
+        setmask(y + x + 1, k + 5);
+      }
+      for (x = 2; x < 4; x++) {
+        qrframe[(y + x) + width * (k + 2)] = 1;
+        qrframe[(y + 2) + width * (k + x + 1)] = 1;
+        qrframe[(y + 4) + width * (k + x)] = 1;
+        qrframe[(y + x + 1) + width * (k + 4)] = 1;
+      }
+    }
+
+    // alignment blocks
+    if (version > 1) {
+      t = adelta[version];
+      y = width - 7;
+      for (; ;) {
+        x = width - 7;
+        while (x > t - 3) {
+          putalign(x, y);
+          if (x < t)
+            break;
+          x -= t;
+        }
+        if (y <= t + 9)
+          break;
+        y -= t;
+        putalign(6, y);
+        putalign(y, 6);
+      }
+    }
+
+    // single black
+    qrframe[8 + width * (width - 8)] = 1;
+
+    // timing gap - mask only
+    for (y = 0; y < 7; y++) {
+      setmask(7, y);
+      setmask(width - 8, y);
+      setmask(7, y + width - 7);
+    }
+    for (x = 0; x < 8; x++) {
+      setmask(x, 7);
+      setmask(x + width - 8, 7);
+      setmask(x, width - 8);
+    }
+
+    // reserve mask-format area
+    for (x = 0; x < 9; x++)
+      setmask(x, 8);
+    for (x = 0; x < 8; x++) {
+      setmask(x + width - 8, 8);
+      setmask(8, x);
+    }
+    for (y = 0; y < 7; y++)
+      setmask(8, y + width - 7);
+
+    // timing row/col
+    for (x = 0; x < width - 14; x++)
+      if (x & 1) {
+        setmask(8 + x, 6);
+        setmask(6, 8 + x);
+      }
+      else {
+        qrframe[(8 + x) + width * 6] = 1;
+        qrframe[6 + width * (8 + x)] = 1;
+      }
+
+    // version block
+    if (version > 6) {
+      t = vpat[version - 7];
+      k = 17;
+      for (x = 0; x < 6; x++)
+        for (y = 0; y < 3; y++ , k--)
+          if (1 & (k > 11 ? version >> (k - 12) : t >> k)) {
+            qrframe[(5 - x) + width * (2 - y + width - 11)] = 1;
+            qrframe[(2 - y + width - 11) + width * (5 - x)] = 1;
+          }
+          else {
+            setmask(5 - x, 2 - y + width - 11);
+            setmask(2 - y + width - 11, 5 - x);
+          }
+    }
+
+    // sync mask bits - only set above for white spaces, so add in black bits
+    for (y = 0; y < width; y++)
+      for (x = 0; x <= y; x++)
+        if (qrframe[x + width * y])
+          setmask(x, y);
+
+    // convert string to bitstream
+    // 8 bit data to QR-coded 8 bit data (numeric or alphanum, or kanji not supported)
+    v = strinbuf.length;
+
+    // string to array
+    for (i = 0; i < v; i++)
+      eccbuf[i] = strinbuf.charCodeAt(i);
+    strinbuf = eccbuf.slice(0);
+
+    // calculate max string length
+    x = datablkw * (neccblk1 + neccblk2) + neccblk2;
+    if (v >= x - 2) {
+      v = x - 2;
+      if (version > 9)
+        v--;
+    }
+
+    // shift and repack to insert length prefix
+    i = v;
+    if (version > 9) {
+      strinbuf[i + 2] = 0;
+      strinbuf[i + 3] = 0;
+      while (i--) {
+        t = strinbuf[i];
+        strinbuf[i + 3] |= 255 & (t << 4);
+        strinbuf[i + 2] = t >> 4;
+      }
+      strinbuf[2] |= 255 & (v << 4);
+      strinbuf[1] = v >> 4;
+      strinbuf[0] = 0x40 | (v >> 12);
+    }
+    else {
+      strinbuf[i + 1] = 0;
+      strinbuf[i + 2] = 0;
+      while (i--) {
+        t = strinbuf[i];
+        strinbuf[i + 2] |= 255 & (t << 4);
+        strinbuf[i + 1] = t >> 4;
+      }
+      strinbuf[1] |= 255 & (v << 4);
+      strinbuf[0] = 0x40 | (v >> 4);
+    }
+    // fill to end with pad pattern
+    i = v + 3 - (version < 10);
+    while (i < x) {
+      strinbuf[i++] = 0xec;
+      // buffer has room    if (i == x)      break;
+      strinbuf[i++] = 0x11;
+    }
+
+    // calculate and append ECC
+
+    // calculate generator polynomial
+    genpoly[0] = 1;
+    for (i = 0; i < eccblkwid; i++) {
+      genpoly[i + 1] = 1;
+      for (j = i; j > 0; j--)
+        genpoly[j] = genpoly[j]
+          ? genpoly[j - 1] ^ gexp[modnn(glog[genpoly[j]] + i)] : genpoly[j - 1];
+      genpoly[0] = gexp[modnn(glog[genpoly[0]] + i)];
+    }
+    for (i = 0; i <= eccblkwid; i++)
+      genpoly[i] = glog[genpoly[i]]; // use logs for genpoly[] to save calc step
+
+    // append ecc to data buffer
+    k = x;
+    y = 0;
+    for (i = 0; i < neccblk1; i++) {
+      appendrs(y, datablkw, k, eccblkwid);
+      y += datablkw;
+      k += eccblkwid;
+    }
+    for (i = 0; i < neccblk2; i++) {
+      appendrs(y, datablkw + 1, k, eccblkwid);
+      y += datablkw + 1;
+      k += eccblkwid;
+    }
+    // interleave blocks
+    y = 0;
+    for (i = 0; i < datablkw; i++) {
+      for (j = 0; j < neccblk1; j++)
+        eccbuf[y++] = strinbuf[i + j * datablkw];
+      for (j = 0; j < neccblk2; j++)
+        eccbuf[y++] = strinbuf[(neccblk1 * datablkw) + i + (j * (datablkw + 1))];
+    }
+    for (j = 0; j < neccblk2; j++)
+      eccbuf[y++] = strinbuf[(neccblk1 * datablkw) + i + (j * (datablkw + 1))];
+    for (i = 0; i < eccblkwid; i++)
+      for (j = 0; j < neccblk1 + neccblk2; j++)
+        eccbuf[y++] = strinbuf[x + i + j * eccblkwid];
+    strinbuf = eccbuf;
+
+    // pack bits into frame avoiding masked area.
+    x = y = width - 1;
+    k = v = 1;         // up, minus
+    /* inteleaved data and ecc codes */
+    m = (datablkw + eccblkwid) * (neccblk1 + neccblk2) + neccblk2;
+    for (i = 0; i < m; i++) {
+      t = strinbuf[i];
+      for (j = 0; j < 8; j++ , t <<= 1) {
+        if (0x80 & t)
+          qrframe[x + width * y] = 1;
+        do {        // find next fill position
+          if (v)
+            x--;
+          else {
+            x++;
+            if (k) {
+              if (y != 0)
+                y--;
+              else {
+                x -= 2;
+                k = !k;
+                if (x == 6) {
+                  x--;
+                  y = 9;
+                }
+              }
+            }
+            else {
+              if (y != width - 1)
+                y++;
+              else {
+                x -= 2;
+                k = !k;
+                if (x == 6) {
+                  x--;
+                  y -= 8;
+                }
+              }
+            }
+          }
+          v = !v;
+        } while (ismasked(x, y));
+      }
+    }
+
+    // save pre-mask copy of frame
+    strinbuf = qrframe.slice(0);
+    t = 0;           // best
+    y = 30000;         // demerit
+    // for instead of while since in original arduino code
+    // if an early mask was "good enough" it wouldn't try for a better one
+    // since they get more complex and take longer.
+    for (k = 0; k < 8; k++) {
+      applymask(k);      // returns black-white imbalance
+      x = badcheck();
+      if (x < y) { // current mask better than previous best?
+        y = x;
+        t = k;
+      }
+      if (t == 7)
+        break;       // don't increment i to a void redoing mask
+      qrframe = strinbuf.slice(0); // reset for next pass
+    }
+    if (t != k)         // redo best mask - none good enough, last wasn't t
+      applymask(t);
+
+    // add in final mask/ecclevel bytes
+    y = fmtword[t + ((ecclevel - 1) << 3)];
+    // low byte
+    for (k = 0; k < 8; k++ , y >>= 1)
+      if (y & 1) {
+        qrframe[(width - 1 - k) + width * 8] = 1;
+        if (k < 6)
+          qrframe[8 + width * k] = 1;
+        else
+          qrframe[8 + width * (k + 1)] = 1;
+      }
+    // high byte
+    for (k = 0; k < 7; k++ , y >>= 1)
+      if (y & 1) {
+        qrframe[8 + width * (width - 7 + k)] = 1;
+        if (k)
+          qrframe[(6 - k) + width * 8] = 1;
+        else
+          qrframe[7 + width * 8] = 1;
+      }
+    return qrframe;
+  }
+
+
+
+
+  var _canvas = null;
+
+  var api = {
+
+    get ecclevel() {
+      return ecclevel;
+    },
+
+    set ecclevel(val) {
+      ecclevel = val;
+    },
+
+    get size() {
+      return _size;
+    },
+
+    set size(val) {
+      _size = val
+    },
+
+    get canvas() {
+      return _canvas;
+    },
+
+    set canvas(el) {
+      _canvas = el;
+    },
+
+    getFrame: function (string) {
+      return genframe(string);
+    },
+    //这里的utf16to8(str)是对Text中的字符串进行转码，让其支持中文
+    utf16to8: function (str) {
+      var out, i, len, c;
+
+      out = "";
+      len = str.length;
+      for (i = 0; i < len; i++) {
+        c = str.charCodeAt(i);
+        if ((c >= 0x0001) && (c <= 0x007F)) {
+          out += str.charAt(i);
+        } else if (c > 0x07FF) {
+          out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
+          out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
+          out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
+        } else {
+          out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
+          out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
+        }
+      }
+      return out;
+    },
+    /**
+     * 新增$this参数，传入组件的this,兼容在组件中生成
+     * @param bg 目前只能设置颜色值
+     */ 
+    draw: function (str, ctx, startX, startY, cavW, cavH, bg, color, $this, ecc) {
+      var that = this;
+      ecclevel = ecc || ecclevel;
+      if (!ctx) {
+        console.warn('No canvas provided to draw QR code in!')
+        return;
+      }
+      var size = Math.min(cavW, cavH);
+      str = that.utf16to8(str);//增加中文显示
+
+      var frame = that.getFrame(str);
+      var px = size / width;
+      if (bg) {
+        ctx.fillStyle = bg;
+        ctx.fillRect(startX, startY, cavW, cavW);
+      }
+      ctx.fillStyle = color || 'black';
+      for (var i = 0; i < width; i++) {
+        for (var j = 0; j < width; j++) {
+          if (frame[j * width + i]) {
+            ctx.fillRect(startX + px * i, startY + px * j, px, px);
+          }
+        }
+      }
+    }
+  }
+  module.exports = { api }
+  // exports.draw = api;
+
+})();

components/painter/lib/sha1.js

@@ -0,0 +1,97 @@
+var hexcase = 0;
+var chrsz = 8;
+
+function hex_sha1(s) {
+  return binb2hex(core_sha1(str2binb(s), s.length * chrsz));
+}
+
+function core_sha1(x, len) {
+  x[len >> 5] |= 0x80 << (24 - (len % 32));
+  x[(((len + 64) >> 9) << 4) + 15] = len;
+
+  var w = Array(80);
+  var a = 1732584193;
+  var b = -271733879;
+  var c = -1732584194;
+  var d = 271733878;
+  var e = -1009589776;
+
+  for (var i = 0; i < x.length; i += 16) {
+    var olda = a;
+    var oldb = b;
+    var oldc = c;
+    var oldd = d;
+    var olde = e;
+
+    for (var j = 0; j < 80; j++) {
+      if (j < 16) w[j] = x[i + j];
+      else w[j] = rol(w[j - 3] ^ w[j - 8] ^ w[j - 14] ^ w[j - 16], 1);
+      var t = safe_add(
+        safe_add(rol(a, 5), sha1_ft(j, b, c, d)),
+        safe_add(safe_add(e, w[j]), sha1_kt(j))
+      );
+      e = d;
+      d = c;
+      c = rol(b, 30);
+      b = a;
+      a = t;
+    }
+
+    a = safe_add(a, olda);
+    b = safe_add(b, oldb);
+    c = safe_add(c, oldc);
+    d = safe_add(d, oldd);
+    e = safe_add(e, olde);
+  }
+  return Array(a, b, c, d, e);
+}
+
+function sha1_ft(t, b, c, d) {
+  if (t < 20) return (b & c) | (~b & d);
+  if (t < 40) return b ^ c ^ d;
+  if (t < 60) return (b & c) | (b & d) | (c & d);
+  return b ^ c ^ d;
+}
+
+function sha1_kt(t) {
+  return t < 20
+    ? 1518500249
+    : t < 40
+    ? 1859775393
+    : t < 60
+    ? -1894007588
+    : -899497514;
+}
+
+function safe_add(x, y) {
+  var lsw = (x & 0xffff) + (y & 0xffff);
+  var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
+  return (msw << 16) | (lsw & 0xffff);
+}
+
+function rol(num, cnt) {
+  return (num << cnt) | (num >>> (32 - cnt));
+}
+
+function str2binb(str) {
+  var bin = Array();
+  var mask = (1 << chrsz) - 1;
+  for (var i = 0; i < str.length * chrsz; i += chrsz)
+    bin[i >> 5] |= (str.charCodeAt(i / chrsz) & mask) << (24 - (i % 32));
+  return bin;
+}
+
+function binb2hex(binarray) {
+  var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";
+  var str = "";
+  for (var i = 0; i < binarray.length * 4; i++) {
+    str +=
+      hex_tab.charAt((binarray[i >> 2] >> ((3 - (i % 4)) * 8 + 4)) & 0xf) +
+      hex_tab.charAt((binarray[i >> 2] >> ((3 - (i % 4)) * 8)) & 0xf);
+  }
+  return str;
+}
+
+module.exports = {
+  hex_sha1,
+}

components/painter/lib/string-polyfill.js

@@ -0,0 +1,46 @@
+String.prototype.substr = function (start, length) {
+  if (start === undefined) {
+    return this.toString()
+  }
+  if (typeof start !== 'number' || (typeof length !== 'number' && length !== undefined) ) {
+    return ''
+  }
+  const strArr = [...this]
+  const _length = strArr.length
+  if (_length + start < 0) {
+    start = 0
+  }
+  if (length === undefined || (start < 0 && start + length > 0)) {
+    return strArr.slice(start).join('')
+  } else {
+    return strArr.slice(start, start + length).join('')
+  }
+}
+
+
+String.prototype.substring = function (start, end) {
+  if (start === undefined) {
+    return this.toString()
+  }
+  if (typeof start !== 'number' || (typeof end !== 'number' && end !== undefined) ) {
+    return ''
+  }
+  if (!(start > 0)) {
+    start = 0
+  }
+  if (!(end > 0) && end !== undefined) {
+    end = 0
+  }
+  const strArr = [...this]
+  const _length = strArr.length
+  if (start > _length) {
+    start = _length
+  }
+  if (end > _length) {
+    end = _length
+  }
+  if (end < start) {
+    [start, end] = [end, start]
+  }
+  return strArr.slice(start, end).join('')
+}

components/painter/lib/util.js

@@ -0,0 +1,78 @@
+
+function isValidUrl(url) {
+  return isOnlineUrl(url) || isDataUrl(url);
+}
+
+function isOnlineUrl(url) {
+  return /((ht|f)tp(s?)|cloud):\/\/([^ \\/]*\.)+[^ \\/]*(:[0-9]+)?\/?/.test(url)
+}
+
+function isDataUrl(url) {
+  return /data:image\/(\w+);base64,(.*)/.test(url);
+}
+
+/**
+ * 深度对比两个对象是否一致
+ * from: https://github.com/epoberezkin/fast-deep-equal
+ * @param  {Object} a 对象a
+ * @param  {Object} b 对象b
+ * @return {Boolean}   是否相同
+ */
+/* eslint-disable */
+function equal(a, b) {
+  if (a === b) return true;
+
+  if (a && b && typeof a == 'object' && typeof b == 'object') {
+    var arrA = Array.isArray(a)
+      , arrB = Array.isArray(b)
+      , i
+      , length
+      , key;
+
+    if (arrA && arrB) {
+      length = a.length;
+      if (length != b.length) return false;
+      for (i = length; i-- !== 0;)
+        if (!equal(a[i], b[i])) return false;
+      return true;
+    }
+
+    if (arrA != arrB) return false;
+
+    var dateA = a instanceof Date
+      , dateB = b instanceof Date;
+    if (dateA != dateB) return false;
+    if (dateA && dateB) return a.getTime() == b.getTime();
+
+    var regexpA = a instanceof RegExp
+      , regexpB = b instanceof RegExp;
+    if (regexpA != regexpB) return false;
+    if (regexpA && regexpB) return a.toString() == b.toString();
+
+    var keys = Object.keys(a);
+    length = keys.length;
+
+    if (length !== Object.keys(b).length)
+      return false;
+
+    for (i = length; i-- !== 0;)
+      if (!Object.prototype.hasOwnProperty.call(b, keys[i])) return false;
+
+    for (i = length; i-- !== 0;) {
+      key = keys[i];
+      if (!equal(a[key], b[key])) return false;
+    }
+
+    return true;
+  }
+
+  return a!==a && b!==b;
+}
+
+module.exports = {
+  isValidUrl,
+  isOnlineUrl,
+  isDataUrl,
+  equal
+};
+

components/painter/lib/wx-canvas.js

@@ -0,0 +1,619 @@
+// @ts-check
+export default class WxCanvas {
+  ctx;
+  type;
+  canvasId;
+  canvasNode;
+  stepList = [];
+  canvasPrototype = {};
+
+  constructor(type, ctx, canvasId, isNew, canvasNode) {
+    this.ctx = ctx;
+    this.canvasId = canvasId;
+    this.type = type;
+    if (isNew) {
+      this.canvasNode = canvasNode || {};
+    }
+  }
+
+  set width(w) {
+    if (this.canvasNode) {
+      this.canvasNode.width = w;
+      // 经测试，在 2d 接口中如果不设置这个值，IOS 端有一定几率会出现图片显示不全的情况。
+      this.canvasNode._width = w;
+    }
+  }
+
+  get width() {
+    if (this.canvasNode) return this.canvasNode.width;
+    return 0;
+  }
+
+  set height(h) {
+    if (this.canvasNode) {
+      this.canvasNode.height = h;
+      // 经测试，在 2d 接口中如果不设置这个值，IOS 端有一定几率会出现图片显示不全的情况。
+      this.canvasNode._height = h;
+    }
+  }
+
+  get height() {
+    if (this.canvasNode) return this.canvasNode.height;
+    return 0;
+  }
+
+  set lineWidth(args) {
+    this.canvasPrototype.lineWidth = args;
+    this.stepList.push({
+      action: "lineWidth",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get lineWidth() {
+    return this.canvasPrototype.lineWidth;
+  }
+
+  set lineCap(args) {
+    this.canvasPrototype.lineCap = args;
+    this.stepList.push({
+      action: "lineCap",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get lineCap() {
+    return this.canvasPrototype.lineCap;
+  }
+
+  set lineJoin(args) {
+    this.canvasPrototype.lineJoin = args;
+    this.stepList.push({
+      action: "lineJoin",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get lineJoin() {
+    return this.canvasPrototype.lineJoin;
+  }
+
+  set miterLimit(args) {
+    this.canvasPrototype.miterLimit = args;
+    this.stepList.push({
+      action: "miterLimit",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get miterLimit() {
+    return this.canvasPrototype.miterLimit;
+  }
+
+  set lineDashOffset(args) {
+    this.canvasPrototype.lineDashOffset = args;
+    this.stepList.push({
+      action: "lineDashOffset",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get lineDashOffset() {
+    return this.canvasPrototype.lineDashOffset;
+  }
+
+  set font(args) {
+    this.canvasPrototype.font = args;
+    this.ctx.font = args;
+    this.stepList.push({
+      action: "font",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get font() {
+    return this.canvasPrototype.font;
+  }
+
+  set textAlign(args) {
+    this.canvasPrototype.textAlign = args;
+    this.stepList.push({
+      action: "textAlign",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get textAlign() {
+    return this.canvasPrototype.textAlign;
+  }
+
+  set textBaseline(args) {
+    this.canvasPrototype.textBaseline = args;
+    this.stepList.push({
+      action: "textBaseline",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get textBaseline() {
+    return this.canvasPrototype.textBaseline;
+  }
+
+  set fillStyle(args) {
+    this.canvasPrototype.fillStyle = args;
+    this.stepList.push({
+      action: "fillStyle",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get fillStyle() {
+    return this.canvasPrototype.fillStyle;
+  }
+
+  set strokeStyle(args) {
+    this.canvasPrototype.strokeStyle = args;
+    this.stepList.push({
+      action: "strokeStyle",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get strokeStyle() {
+    return this.canvasPrototype.strokeStyle;
+  }
+
+  set globalAlpha(args) {
+    this.canvasPrototype.globalAlpha = args;
+    this.stepList.push({
+      action: "globalAlpha",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get globalAlpha() {
+    return this.canvasPrototype.globalAlpha;
+  }
+
+  set globalCompositeOperation(args) {
+    this.canvasPrototype.globalCompositeOperation = args;
+    this.stepList.push({
+      action: "globalCompositeOperation",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get globalCompositeOperation() {
+    return this.canvasPrototype.globalCompositeOperation;
+  }
+
+  set shadowColor(args) {
+    this.canvasPrototype.shadowColor = args;
+    this.stepList.push({
+      action: "shadowColor",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get shadowColor() {
+    return this.canvasPrototype.shadowColor;
+  }
+
+  set shadowOffsetX(args) {
+    this.canvasPrototype.shadowOffsetX = args;
+    this.stepList.push({
+      action: "shadowOffsetX",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get shadowOffsetX() {
+    return this.canvasPrototype.shadowOffsetX;
+  }
+
+  set shadowOffsetY(args) {
+    this.canvasPrototype.shadowOffsetY = args;
+    this.stepList.push({
+      action: "shadowOffsetY",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get shadowOffsetY() {
+    return this.canvasPrototype.shadowOffsetY;
+  }
+
+  set shadowBlur(args) {
+    this.canvasPrototype.shadowBlur = args;
+    this.stepList.push({
+      action: "shadowBlur",
+      args,
+      actionType: "set",
+    });
+  }
+
+  get shadowBlur() {
+    return this.canvasPrototype.shadowBlur;
+  }
+
+  save() {
+    this.stepList.push({
+      action: "save",
+      args: null,
+      actionType: "func",
+    });
+  }
+
+  restore() {
+    this.stepList.push({
+      action: "restore",
+      args: null,
+      actionType: "func",
+    });
+  }
+
+  setLineDash(...args) {
+    this.canvasPrototype.lineDash = args;
+    this.stepList.push({
+      action: "setLineDash",
+      args,
+      actionType: "func",
+    });
+  }
+
+  moveTo(...args) {
+    this.stepList.push({
+      action: "moveTo",
+      args,
+      actionType: "func",
+    });
+  }
+
+  closePath() {
+    this.stepList.push({
+      action: "closePath",
+      args: null,
+      actionType: "func",
+    });
+  }
+
+  lineTo(...args) {
+    this.stepList.push({
+      action: "lineTo",
+      args,
+      actionType: "func",
+    });
+  }
+
+  quadraticCurveTo(...args) {
+    this.stepList.push({
+      action: "quadraticCurveTo",
+      args,
+      actionType: "func",
+    });
+  }
+
+  bezierCurveTo(...args) {
+    this.stepList.push({
+      action: "bezierCurveTo",
+      args,
+      actionType: "func",
+    });
+  }
+
+  arcTo(...args) {
+    this.stepList.push({
+      action: "arcTo",
+      args,
+      actionType: "func",
+    });
+  }
+
+  arc(...args) {
+    this.stepList.push({
+      action: "arc",
+      args,
+      actionType: "func",
+    });
+  }
+
+  rect(...args) {
+    this.stepList.push({
+      action: "rect",
+      args,
+      actionType: "func",
+    });
+  }
+
+  scale(...args) {
+    this.stepList.push({
+      action: "scale",
+      args,
+      actionType: "func",
+    });
+  }
+
+  rotate(...args) {
+    this.stepList.push({
+      action: "rotate",
+      args,
+      actionType: "func",
+    });
+  }
+
+  translate(...args) {
+    this.stepList.push({
+      action: "translate",
+      args,
+      actionType: "func",
+    });
+  }
+
+  transform(...args) {
+    this.stepList.push({
+      action: "transform",
+      args,
+      actionType: "func",
+    });
+  }
+
+  setTransform(...args) {
+    this.stepList.push({
+      action: "setTransform",
+      args,
+      actionType: "func",
+    });
+  }
+
+  clearRect(...args) {
+    this.stepList.push({
+      action: "clearRect",
+      args,
+      actionType: "func",
+    });
+  }
+
+  fillRect(...args) {
+    this.stepList.push({
+      action: "fillRect",
+      args,
+      actionType: "func",
+    });
+  }
+
+  strokeRect(...args) {
+    this.stepList.push({
+      action: "strokeRect",
+      args,
+      actionType: "func",
+    });
+  }
+
+  fillText(...args) {
+    this.stepList.push({
+      action: "fillText",
+      args,
+      actionType: "func",
+    });
+  }
+
+  strokeText(...args) {
+    this.stepList.push({
+      action: "strokeText",
+      args,
+      actionType: "func",
+    });
+  }
+
+  beginPath() {
+    this.stepList.push({
+      action: "beginPath",
+      args: null,
+      actionType: "func",
+    });
+  }
+
+  fill() {
+    this.stepList.push({
+      action: "fill",
+      args: null,
+      actionType: "func",
+    });
+  }
+
+  stroke() {
+    this.stepList.push({
+      action: "stroke",
+      args: null,
+      actionType: "func",
+    });
+  }
+
+  drawFocusIfNeeded(...args) {
+    this.stepList.push({
+      action: "drawFocusIfNeeded",
+      args,
+      actionType: "func",
+    });
+  }
+
+  clip() {
+    this.stepList.push({
+      action: "clip",
+      args: null,
+      actionType: "func",
+    });
+  }
+
+  isPointInPath(...args) {
+    this.stepList.push({
+      action: "isPointInPath",
+      args,
+      actionType: "func",
+    });
+  }
+
+  drawImage(...args) {
+    this.stepList.push({
+      action: "drawImage",
+      args,
+      actionType: "func",
+    });
+  }
+
+  addHitRegion(...args) {
+    this.stepList.push({
+      action: "addHitRegion",
+      args,
+      actionType: "func",
+    });
+  }
+
+  removeHitRegion(...args) {
+    this.stepList.push({
+      action: "removeHitRegion",
+      args,
+      actionType: "func",
+    });
+  }
+
+  clearHitRegions(...args) {
+    this.stepList.push({
+      action: "clearHitRegions",
+      args,
+      actionType: "func",
+    });
+  }
+
+  putImageData(...args) {
+    this.stepList.push({
+      action: "putImageData",
+      args,
+      actionType: "func",
+    });
+  }
+
+  getLineDash() {
+    return this.canvasPrototype.lineDash;
+  }
+
+  createLinearGradient(...args) {
+    return this.ctx.createLinearGradient(...args);
+  }
+
+  createRadialGradient(...args) {
+    if (this.type === "2d") {
+      return this.ctx.createRadialGradient(...args);
+    } else {
+      return this.ctx.createCircularGradient(...args.slice(3, 6));
+    }
+  }
+
+  createPattern(...args) {
+    return this.ctx.createPattern(...args);
+  }
+
+  measureText(...args) {
+    return this.ctx.measureText(...args);
+  }
+
+  createImageData(...args) {
+    return this.ctx.createImageData(...args);
+  }
+
+  getImageData(...args) {
+    return this.ctx.getImageData(...args);
+  }
+
+  async draw(reserve, func) {
+    const realstepList = this.stepList.slice();
+    this.stepList.length = 0;
+    if (this.type === "mina") {
+      if (realstepList.length > 0) {
+        for (const step of realstepList) {
+          this.implementMinaStep(step);
+        }
+        realstepList.length = 0;
+      }
+      this.ctx.draw(reserve, func);
+    } else if (this.type === "2d") {
+      if (!reserve) {
+        this.ctx.clearRect(0, 0, this.canvasNode.width, this.canvasNode.height);
+      }
+      if (realstepList.length > 0) {
+        for (const step of realstepList) {
+          await this.implement2DStep(step);
+        }
+        realstepList.length = 0;
+      }
+      if (func) {
+        func();
+      }
+    }
+    realstepList.length = 0;
+  }
+
+  implementMinaStep(step) {
+    switch (step.action) {
+      case "textAlign": {
+        this.ctx.setTextAlign(step.args);
+        break;
+      }
+      case "textBaseline": {
+        this.ctx.setTextBaseline(step.args);
+        break;
+      }
+      default: {
+        if (step.actionType === "set") {
+          this.ctx[step.action] = step.args;
+        } else if (step.actionType === "func") {
+          if (step.args) {
+            this.ctx[step.action](...step.args);
+          } else {
+            this.ctx[step.action]();
+          }
+        }
+        break;
+      }
+    }
+  }
+
+  implement2DStep(step) {
+    return new Promise((resolve) => {
+      if (step.action === "drawImage") {
+        const img = this.canvasNode.createImage();
+        img.src = step.args[0];
+        img.onload = () => {
+          this.ctx.drawImage(img, ...step.args.slice(1));
+          resolve();
+        };
+      } else {
+        if (step.actionType === "set") {
+          this.ctx[step.action] = step.args;
+        } else if (step.actionType === "func") {
+          if (step.args) {
+            this.ctx[step.action](...step.args);
+          } else {
+            this.ctx[step.action]();
+          }
+        }
+        resolve();
+      }
+    });
+  }
+}

components/painter/painter.js

@@ -0,0 +1,876 @@
+import Pen, { penCache, clearPenCache } from './lib/pen';
+import Downloader from './lib/downloader';
+import WxCanvas from './lib/wx-canvas';
+
+const util = require('./lib/util');
+const calc = require('./lib/calc');
+
+const downloader = new Downloader();
+
+// 最大尝试的绘制次数
+const MAX_PAINT_COUNT = 5;
+const ACTION_DEFAULT_SIZE = 24;
+const ACTION_OFFSET = '2rpx';
+Component({
+  canvasWidthInPx: 0,
+  canvasHeightInPx: 0,
+  canvasNode: null,
+  paintCount: 0,
+  currentPalette: {},
+  outterDisabled: false,
+  isDisabled: false,
+  needClear: false,
+  /**
+   * 组件的属性列表
+   */
+  properties: {
+    use2D: {
+      type: Boolean,
+    },
+    customStyle: {
+      type: String,
+    },
+    // 运行自定义选择框和删除缩放按钮
+    customActionStyle: {
+      type: Object,
+    },
+    palette: {
+      type: Object,
+      observer: function (newVal, oldVal) {
+        if (this.isNeedRefresh(newVal, oldVal)) {
+          this.paintCount = 0;
+          clearPenCache();
+          this.startPaint();
+        }
+      },
+    },
+    dancePalette: {
+      type: Object,
+      observer: function (newVal, oldVal) {
+        if (!this.isEmpty(newVal) && !this.properties.use2D) {
+          clearPenCache();
+          this.initDancePalette(newVal);
+        }
+      },
+    },
+    // 缩放比，会在传入的 palette 中统一乘以该缩放比
+    scaleRatio: {
+      type: Number,
+      value: 1,
+    },
+    widthPixels: {
+      type: Number,
+      value: 0,
+    },
+    // 启用脏检查，默认 false
+    dirty: {
+      type: Boolean,
+      value: false,
+    },
+    LRU: {
+      type: Boolean,
+      value: false,
+    },
+    action: {
+      type: Object,
+      observer: function (newVal, oldVal) {
+        if (newVal && !this.isEmpty(newVal) && !this.properties.use2D) {
+          this.doAction(newVal, null, false, true);
+        }
+      },
+    },
+    disableAction: {
+      type: Boolean,
+      observer: function (isDisabled) {
+        this.outterDisabled = isDisabled;
+        this.isDisabled = isDisabled;
+      },
+    },
+    clearActionBox: {
+      type: Boolean,
+      observer: function (needClear) {
+        if (needClear && !this.needClear) {
+          if (this.frontContext) {
+            setTimeout(() => {
+              this.frontContext.draw();
+            }, 100);
+            this.touchedView = {};
+            this.prevFindedIndex = this.findedIndex;
+            this.findedIndex = -1;
+          }
+        }
+        this.needClear = needClear;
+      },
+    },
+  },
+
+  data: {
+    picURL: '',
+    showCanvas: true,
+    painterStyle: '',
+  },
+
+  methods: {
+    /**
+     * 判断一个 object 是否为 空
+     * @param {object} object
+     */
+    isEmpty(object) {
+      for (const i in object) {
+        return false;
+      }
+      return true;
+    },
+
+    isNeedRefresh(newVal, oldVal) {
+      if (!newVal || this.isEmpty(newVal) || (this.data.dirty && util.equal(newVal, oldVal))) {
+        return false;
+      }
+      return true;
+    },
+
+    getBox(rect, type) {
+      const boxArea = {
+        type: 'rect',
+        css: {
+          height: `${rect.bottom - rect.top}px`,
+          width: `${rect.right - rect.left}px`,
+          left: `${rect.left}px`,
+          top: `${rect.top}px`,
+          borderWidth: '4rpx',
+          borderColor: '#1A7AF8',
+          color: 'transparent',
+        },
+      };
+      if (type === 'text') {
+        boxArea.css = Object.assign({}, boxArea.css, {
+          borderStyle: 'dashed',
+        });
+      }
+      if (this.properties.customActionStyle && this.properties.customActionStyle.border) {
+        boxArea.css = Object.assign({}, boxArea.css, this.properties.customActionStyle.border);
+      }
+      Object.assign(boxArea, {
+        id: 'box',
+      });
+      return boxArea;
+    },
+
+    getScaleIcon(rect, type) {
+      let scaleArea = {};
+      const { customActionStyle } = this.properties;
+      if (customActionStyle && customActionStyle.scale) {
+        scaleArea = {
+          type: 'image',
+          url: type === 'text' ? customActionStyle.scale.textIcon : customActionStyle.scale.imageIcon,
+          css: {
+            height: `${2 * ACTION_DEFAULT_SIZE}rpx`,
+            width: `${2 * ACTION_DEFAULT_SIZE}rpx`,
+            borderRadius: `${ACTION_DEFAULT_SIZE}rpx`,
+          },
+        };
+      } else {
+        scaleArea = {
+          type: 'rect',
+          css: {
+            height: `${2 * ACTION_DEFAULT_SIZE}rpx`,
+            width: `${2 * ACTION_DEFAULT_SIZE}rpx`,
+            borderRadius: `${ACTION_DEFAULT_SIZE}rpx`,
+            color: '#0000ff',
+          },
+        };
+      }
+      scaleArea.css = Object.assign({}, scaleArea.css, {
+        align: 'center',
+        left: `${rect.right + ACTION_OFFSET.toPx()}px`,
+        top:
+          type === 'text'
+            ? `${rect.top - ACTION_OFFSET.toPx() - scaleArea.css.height.toPx() / 2}px`
+            : `${rect.bottom - ACTION_OFFSET.toPx() - scaleArea.css.height.toPx() / 2}px`,
+      });
+      Object.assign(scaleArea, {
+        id: 'scale',
+      });
+      return scaleArea;
+    },
+
+    getDeleteIcon(rect) {
+      let deleteArea = {};
+      const { customActionStyle } = this.properties;
+      if (customActionStyle && customActionStyle.scale) {
+        deleteArea = {
+          type: 'image',
+          url: customActionStyle.delete.icon,
+          css: {
+            height: `${2 * ACTION_DEFAULT_SIZE}rpx`,
+            width: `${2 * ACTION_DEFAULT_SIZE}rpx`,
+            borderRadius: `${ACTION_DEFAULT_SIZE}rpx`,
+          },
+        };
+      } else {
+        deleteArea = {
+          type: 'rect',
+          css: {
+            height: `${2 * ACTION_DEFAULT_SIZE}rpx`,
+            width: `${2 * ACTION_DEFAULT_SIZE}rpx`,
+            borderRadius: `${ACTION_DEFAULT_SIZE}rpx`,
+            color: '#0000ff',
+          },
+        };
+      }
+      deleteArea.css = Object.assign({}, deleteArea.css, {
+        align: 'center',
+        left: `${rect.left - ACTION_OFFSET.toPx()}px`,
+        top: `${rect.top - ACTION_OFFSET.toPx() - deleteArea.css.height.toPx() / 2}px`,
+      });
+      Object.assign(deleteArea, {
+        id: 'delete',
+      });
+      return deleteArea;
+    },
+
+    doAction(action, callback, isMoving, overwrite) {
+      if (this.properties.use2D) {
+        return;
+      }
+      let newVal = null;
+      if (action) {
+        newVal = action.view;
+      }
+      if (newVal && newVal.id && this.touchedView.id !== newVal.id) {
+        // 带 id 的动作给撤回时使用，不带 id，表示对当前选中对象进行操作
+        const { views } = this.currentPalette;
+        for (let i = 0; i < views.length; i++) {
+          if (views[i].id === newVal.id) {
+            // 跨层回撤，需要重新构建三层关系
+            this.touchedView = views[i];
+            this.findedIndex = i;
+            this.sliceLayers();
+            break;
+          }
+        }
+      }
+
+      const doView = this.touchedView;
+
+      if (!doView || this.isEmpty(doView)) {
+        return;
+      }
+      if (newVal && newVal.css) {
+        if (overwrite) {
+          doView.css = newVal.css;
+        } else if (Array.isArray(doView.css) && Array.isArray(newVal.css)) {
+          doView.css = Object.assign({}, ...doView.css, ...newVal.css);
+        } else if (Array.isArray(doView.css)) {
+          doView.css = Object.assign({}, ...doView.css, newVal.css);
+        } else if (Array.isArray(newVal.css)) {
+          doView.css = Object.assign({}, doView.css, ...newVal.css);
+        } else {
+          doView.css = Object.assign({}, doView.css, newVal.css);
+        }
+      }
+      if (newVal && newVal.rect) {
+        doView.rect = newVal.rect;
+      }
+      if (newVal && newVal.url && doView.url && newVal.url !== doView.url) {
+        downloader
+          .download(newVal.url, this.properties.LRU)
+          .then(path => {
+            if (newVal.url.startsWith('https')) {
+              doView.originUrl = newVal.url;
+            }
+            doView.url = path;
+            wx.getImageInfo({
+              src: path,
+              success: res => {
+                doView.sHeight = res.height;
+                doView.sWidth = res.width;
+                this.reDraw(doView, callback, isMoving);
+              },
+              fail: () => {
+                this.reDraw(doView, callback, isMoving);
+              },
+            });
+          })
+          .catch(error => {
+            // 未下载成功，直接绘制
+            console.error(error);
+            this.reDraw(doView, callback, isMoving);
+          });
+      } else {
+        newVal && newVal.text && doView.text && newVal.text !== doView.text && (doView.text = newVal.text);
+        newVal &&
+          newVal.content &&
+          doView.content &&
+          newVal.content !== doView.content &&
+          (doView.content = newVal.content);
+        this.reDraw(doView, callback, isMoving);
+      }
+    },
+
+    reDraw(doView, callback, isMoving) {
+      const draw = {
+        width: this.currentPalette.width,
+        height: this.currentPalette.height,
+        views: this.isEmpty(doView) ? [] : [doView],
+      };
+      const pen = new Pen(this.globalContext, draw);
+
+      pen.paint(callbackInfo => {
+        callback && callback(callbackInfo);
+        this.triggerEvent('viewUpdate', {
+          view: this.touchedView,
+        });
+      });
+
+      const { rect, css, type } = doView;
+
+      this.block = {
+        width: this.currentPalette.width,
+        height: this.currentPalette.height,
+        views: this.isEmpty(doView) ? [] : [this.getBox(rect, doView.type)],
+      };
+      if (css && css.scalable) {
+        this.block.views.push(this.getScaleIcon(rect, type));
+      }
+      if (css && css.deletable) {
+        this.block.views.push(this.getDeleteIcon(rect));
+      }
+      const topBlock = new Pen(this.frontContext, this.block);
+      topBlock.paint();
+    },
+
+    isInView(x, y, rect) {
+      return x > rect.left && y > rect.top && x < rect.right && y < rect.bottom;
+    },
+
+    isInDelete(x, y) {
+      for (const view of this.block.views) {
+        if (view.id === 'delete') {
+          return x > view.rect.left && y > view.rect.top && x < view.rect.right && y < view.rect.bottom;
+        }
+      }
+      return false;
+    },
+
+    isInScale(x, y) {
+      for (const view of this.block.views) {
+        if (view.id === 'scale') {
+          return x > view.rect.left && y > view.rect.top && x < view.rect.right && y < view.rect.bottom;
+        }
+      }
+      return false;
+    },
+
+    touchedView: {},
+    findedIndex: -1,
+    onClick() {
+      const x = this.startX;
+      const y = this.startY;
+      const totalLayerCount = this.currentPalette.views.length;
+      let canBeTouched = [];
+      let isDelete = false;
+      let deleteIndex = -1;
+      for (let i = totalLayerCount - 1; i >= 0; i--) {
+        const view = this.currentPalette.views[i];
+        const { rect } = view;
+        if (this.touchedView && this.touchedView.id && this.touchedView.id === view.id && this.isInDelete(x, y, rect)) {
+          canBeTouched.length = 0;
+          deleteIndex = i;
+          isDelete = true;
+          break;
+        }
+        if (this.isInView(x, y, rect)) {
+          canBeTouched.push({
+            view,
+            index: i,
+          });
+        }
+      }
+      this.touchedView = {};
+      if (canBeTouched.length === 0) {
+        this.findedIndex = -1;
+      } else {
+        let i = 0;
+        const touchAble = canBeTouched.filter(item => Boolean(item.view.id));
+        if (touchAble.length === 0) {
+          this.findedIndex = canBeTouched[0].index;
+        } else {
+          for (i = 0; i < touchAble.length; i++) {
+            if (this.findedIndex === touchAble[i].index) {
+              i++;
+              break;
+            }
+          }
+          if (i === touchAble.length) {
+            i = 0;
+          }
+          this.touchedView = touchAble[i].view;
+          this.findedIndex = touchAble[i].index;
+          this.triggerEvent('viewClicked', {
+            view: this.touchedView,
+          });
+        }
+      }
+      if (this.findedIndex < 0 || (this.touchedView && !this.touchedView.id)) {
+        // 证明点击了背景 或无法移动的view
+        this.frontContext.draw();
+        if (isDelete) {
+          this.triggerEvent('touchEnd', {
+            view: this.currentPalette.views[deleteIndex],
+            index: deleteIndex,
+            type: 'delete',
+          });
+          this.doAction();
+        } else if (this.findedIndex < 0) {
+          this.triggerEvent('viewClicked', {});
+        }
+        this.findedIndex = -1;
+        this.prevFindedIndex = -1;
+      } else if (this.touchedView && this.touchedView.id) {
+        this.sliceLayers();
+      }
+    },
+
+    sliceLayers() {
+      const bottomLayers = this.currentPalette.views.slice(0, this.findedIndex);
+      const topLayers = this.currentPalette.views.slice(this.findedIndex + 1);
+      const bottomDraw = {
+        width: this.currentPalette.width,
+        height: this.currentPalette.height,
+        background: this.currentPalette.background,
+        views: bottomLayers,
+      };
+      const topDraw = {
+        width: this.currentPalette.width,
+        height: this.currentPalette.height,
+        views: topLayers,
+      };
+      if (this.prevFindedIndex < this.findedIndex) {
+        new Pen(this.bottomContext, bottomDraw).paint();
+        this.doAction();
+        new Pen(this.topContext, topDraw).paint();
+      } else {
+        new Pen(this.topContext, topDraw).paint();
+        this.doAction();
+        new Pen(this.bottomContext, bottomDraw).paint();
+      }
+      this.prevFindedIndex = this.findedIndex;
+    },
+
+    startX: 0,
+    startY: 0,
+    startH: 0,
+    startW: 0,
+    isScale: false,
+    startTimeStamp: 0,
+    onTouchStart(event) {
+      if (this.isDisabled) {
+        return;
+      }
+      const { x, y } = event.touches[0];
+      this.startX = x;
+      this.startY = y;
+      this.startTimeStamp = new Date().getTime();
+      if (this.touchedView && !this.isEmpty(this.touchedView)) {
+        const { rect } = this.touchedView;
+        if (this.isInScale(x, y, rect)) {
+          this.isScale = true;
+          this.startH = rect.bottom - rect.top;
+          this.startW = rect.right - rect.left;
+        } else {
+          this.isScale = false;
+        }
+      } else {
+        this.isScale = false;
+      }
+    },
+
+    onTouchEnd(e) {
+      if (this.isDisabled) {
+        return;
+      }
+      const current = new Date().getTime();
+      if (current - this.startTimeStamp <= 500 && !this.hasMove) {
+        !this.isScale && this.onClick(e);
+      } else if (this.touchedView && !this.isEmpty(this.touchedView)) {
+        this.triggerEvent('touchEnd', {
+          view: this.touchedView,
+        });
+      }
+      this.hasMove = false;
+    },
+
+    onTouchCancel(e) {
+      if (this.isDisabled) {
+        return;
+      }
+      this.onTouchEnd(e);
+    },
+
+    hasMove: false,
+    onTouchMove(event) {
+      if (this.isDisabled) {
+        return;
+      }
+      this.hasMove = true;
+      if (!this.touchedView || (this.touchedView && !this.touchedView.id)) {
+        return;
+      }
+      const { x, y } = event.touches[0];
+      const offsetX = x - this.startX;
+      const offsetY = y - this.startY;
+      const { rect, type } = this.touchedView;
+      let css = {};
+      if (this.isScale) {
+        clearPenCache(this.touchedView.id);
+        const newW = this.startW + offsetX > 1 ? this.startW + offsetX : 1;
+        if (this.touchedView.css && this.touchedView.css.minWidth) {
+          if (newW < this.touchedView.css.minWidth.toPx()) {
+            return;
+          }
+        }
+        if (this.touchedView.rect && this.touchedView.rect.minWidth) {
+          if (newW < this.touchedView.rect.minWidth) {
+            return;
+          }
+        }
+        const newH = this.startH + offsetY > 1 ? this.startH + offsetY : 1;
+        css = {
+          width: `${newW}px`,
+        };
+        if (type !== 'text') {
+          if (type === 'image') {
+            css.height = `${(newW * this.startH) / this.startW}px`;
+          } else {
+            css.height = `${newH}px`;
+          }
+        }
+      } else {
+        this.startX = x;
+        this.startY = y;
+        css = {
+          left: `${rect.x + offsetX}px`,
+          top: `${rect.y + offsetY}px`,
+          right: undefined,
+          bottom: undefined,
+        };
+      }
+      this.doAction(
+        {
+          view: {
+            css,
+          },
+        },
+        null,
+        !this.isScale,
+      );
+    },
+
+    initScreenK() {
+      if (!(getApp() && getApp().systemInfo && getApp().systemInfo.screenWidth)) {
+        try {
+          getApp().systemInfo = wx.getSystemInfoSync();
+        } catch (e) {
+          console.error(`Painter get system info failed, ${JSON.stringify(e)}`);
+          return;
+        }
+      }
+      this.screenK = 0.5;
+      if (getApp() && getApp().systemInfo && getApp().systemInfo.screenWidth) {
+        this.screenK = getApp().systemInfo.screenWidth / 750;
+      }
+      setStringPrototype(this.screenK, this.properties.scaleRatio);
+    },
+
+    initDancePalette() {
+      if (this.properties.use2D) {
+        return;
+      }
+      this.isDisabled = true;
+      this.initScreenK();
+      this.downloadImages(this.properties.dancePalette).then(async palette => {
+        this.currentPalette = palette;
+        const { width, height } = palette;
+
+        if (!width || !height) {
+          console.error(`You should set width and height correctly for painter, width: ${width}, height: ${height}`);
+          return;
+        }
+        this.setData({
+          painterStyle: `width:${width.toPx()}px;height:${height.toPx()}px;`,
+        });
+        this.frontContext || (this.frontContext = await this.getCanvasContext(this.properties.use2D, 'front'));
+        this.bottomContext || (this.bottomContext = await this.getCanvasContext(this.properties.use2D, 'bottom'));
+        this.topContext || (this.topContext = await this.getCanvasContext(this.properties.use2D, 'top'));
+        this.globalContext || (this.globalContext = await this.getCanvasContext(this.properties.use2D, 'k-canvas'));
+        new Pen(this.bottomContext, palette, this.properties.use2D).paint(() => {
+          this.isDisabled = false;
+          this.isDisabled = this.outterDisabled;
+          this.triggerEvent('didShow');
+        });
+        this.globalContext.draw();
+        this.frontContext.draw();
+        this.topContext.draw();
+      });
+      this.touchedView = {};
+    },
+
+    startPaint() {
+      this.initScreenK();
+      const { width, height } = this.properties.palette;
+      console.log("startPaint width: ",width)
+      if (!width || !height) {
+        console.error(`You should set width and height correctly for painter, width: ${width}, height: ${height}`);
+        return;
+      }
+
+      let needScale = false;
+      // 生成图片时，根据设置的像素值重新绘制
+      if (width.toPx() !== this.canvasWidthInPx) {
+        console.log("this ..............")
+        console.log("width.toPx(): ", width.toPx())
+        console.log("this.canvasWidthInPx: ", this.canvasWidthInPx)
+
+        this.canvasWidthInPx = width.toPx();
+        needScale = this.properties.use2D;
+      }
+
+      console.log("this.properties.widthPixels: ", this.properties.widthPixels)
+      if (this.properties.widthPixels) {
+        console.log("that ......")
+        setStringPrototype(this.screenK, this.properties.widthPixels / this.canvasWidthInPx);
+        this.canvasWidthInPx = this.properties.widthPixels;
+      }
+
+      if (this.canvasHeightInPx !== height.toPx()) {
+        this.canvasHeightInPx = height.toPx();
+        needScale = needScale || this.properties.use2D;
+      }
+      this.setData(
+        {
+          photoStyle: `width:${this.canvasWidthInPx}px;height:${this.canvasHeightInPx}px;`,
+        },
+        function () {
+          this.downloadImages(this.properties.palette).then(async palette => {
+            if (!this.photoContext) {
+              this.photoContext = await this.getCanvasContext(this.properties.use2D, 'photo');
+            }
+            if (needScale) {
+              const scale = getApp().systemInfo.pixelRatio;
+              this.photoContext.width = this.canvasWidthInPx * scale;
+              this.photoContext.height = this.canvasHeightInPx * scale;
+              this.photoContext.scale(scale, scale);
+            }
+            new Pen(this.photoContext, palette).paint(() => {
+              this.saveImgToLocal();
+            });
+            setStringPrototype(this.screenK, this.properties.scaleRatio);
+          });
+        },
+      );
+    },
+
+    downloadImages(palette) {
+      return new Promise((resolve, reject) => {
+        let preCount = 0;
+        let completeCount = 0;
+        const paletteCopy = JSON.parse(JSON.stringify(palette));
+        if (paletteCopy.background) {
+          preCount++;
+          downloader.download(paletteCopy.background, this.properties.LRU).then(
+            path => {
+              paletteCopy.background = path;
+              completeCount++;
+              if (preCount === completeCount) {
+                resolve(paletteCopy);
+              }
+            },
+            () => {
+              completeCount++;
+              if (preCount === completeCount) {
+                resolve(paletteCopy);
+              }
+            },
+          );
+        }
+        if (paletteCopy.views) {
+          for (const view of paletteCopy.views) {
+            if (view && view.type === 'image' && view.url) {
+              preCount++;
+              /* eslint-disable no-loop-func */
+              downloader.download(view.url, this.properties.LRU).then(
+                path => {
+                  view.originUrl = view.url;
+                  view.url = path;
+                  wx.getImageInfo({
+                    src: path,
+                    success: res => {
+                      // 获得一下图片信息，供后续裁减使用
+                      view.sWidth = res.width;
+                      view.sHeight = res.height;
+                    },
+                    fail: error => {
+                      // 如果图片坏了，则直接置空，防止坑爹的 canvas 画崩溃了
+                      console.warn(`getImageInfo ${view.originUrl} failed, ${JSON.stringify(error)}`);
+                      view.url = '';
+                    },
+                    complete: () => {
+                      completeCount++;
+                      if (preCount === completeCount) {
+                        resolve(paletteCopy);
+                      }
+                    },
+                  });
+                },
+                () => {
+                  completeCount++;
+                  if (preCount === completeCount) {
+                    resolve(paletteCopy);
+                  }
+                },
+              );
+            }
+          }
+        }
+        if (preCount === 0) {
+          resolve(paletteCopy);
+        }
+      });
+    },
+
+    saveImgToLocal() {
+      const that = this;
+      const optionsOf2d = {
+        canvas: that.canvasNode,
+      }
+      const optionsOfOld = {
+        canvasId: 'photo',
+        destWidth: that.canvasWidthInPx,
+        destHeight: that.canvasHeightInPx,
+      }
+      setTimeout(() => {
+        wx.canvasToTempFilePath(
+          {
+            ...(that.properties.use2D ? optionsOf2d : optionsOfOld),
+            success: function (res) {
+              that.getImageInfo(res.tempFilePath);
+            },
+            fail: function (error) {
+              console.error(`canvasToTempFilePath failed, ${JSON.stringify(error)}`);
+              that.triggerEvent('imgErr', {
+                error: error,
+              });
+            },
+          },
+          this,
+        );
+      }, 300);
+    },
+
+    getCanvasContext(use2D, id) {
+      const that = this;
+      return new Promise(resolve => {
+        if (use2D) {
+          const query = wx.createSelectorQuery().in(that);
+          const selectId = `#${id}`;
+          query
+            .select(selectId)
+            .fields({ node: true, size: true })
+            .exec(res => {
+              that.canvasNode = res[0].node;
+              const ctx = that.canvasNode.getContext('2d');
+              const wxCanvas = new WxCanvas('2d', ctx, id, true, that.canvasNode);
+              resolve(wxCanvas);
+            });
+        } else {
+          const temp = wx.createCanvasContext(id, that);
+          resolve(new WxCanvas('mina', temp, id, true));
+        }
+      });
+    },
+
+    getImageInfo(filePath) {
+      const that = this;
+      wx.getImageInfo({
+        src: filePath,
+        success: infoRes => {
+          if (that.paintCount > MAX_PAINT_COUNT) {
+            const error = `The result is always fault, even we tried ${MAX_PAINT_COUNT} times`;
+            console.error(error);
+            that.triggerEvent('imgErr', {
+              error: error,
+            });
+            return;
+          }
+          // 比例相符时才证明绘制成功，否则进行强制重绘制
+          if (
+            Math.abs(
+              (infoRes.width * that.canvasHeightInPx - that.canvasWidthInPx * infoRes.height) /
+                (infoRes.height * that.canvasHeightInPx),
+            ) < 0.01
+          ) {
+            that.triggerEvent('imgOK', {
+              path: filePath,
+            });
+          } else {
+            that.startPaint();
+          }
+          that.paintCount++;
+        },
+        fail: error => {
+          console.error(`getImageInfo failed, ${JSON.stringify(error)}`);
+          that.triggerEvent('imgErr', {
+            error: error,
+          });
+        },
+      });
+    },
+  },
+});
+
+function setStringPrototype(screenK, scale) {
+  /* eslint-disable no-extend-native */
+  /**
+   * string 到对应的 px
+   * @param {Number} baseSize 当设置了 % 号时，设置的基准值
+   */
+  String.prototype.toPx = function toPx(_, baseSize) {
+    if (this === '0') {
+      return 0;
+    }
+    const REG = /-?[0-9]+(\.[0-9]+)?(rpx|px|%)/;
+
+    const parsePx = origin => {
+      const results = new RegExp(REG).exec(origin);
+      if (!origin || !results) {
+        console.error(`The size: ${origin} is illegal`);
+        return 0;
+      }
+      const unit = results[2];
+      const value = parseFloat(origin);
+
+      let res = 0;
+      if (unit === 'rpx') {
+        res = Math.round(value * (screenK || 0.5) * (scale || 1));
+      } else if (unit === 'px') {
+        res = Math.round(value * (scale || 1));
+      } else if (unit === '%') {
+        res = Math.round((value * baseSize) / 100);
+      }
+      return res;
+    };
+    const formula = /^calc\((.+)\)$/.exec(this);
+    if (formula && formula[1]) {
+      // 进行 calc 计算
+      const afterOne = formula[1].replace(/([^\s\(\+\-\*\/]+)\.(left|right|bottom|top|width|height)/g, word => {
+        const [id, attr] = word.split('.');
+        return penCache.viewRect[id][attr];
+      });
+      const afterTwo = afterOne.replace(new RegExp(REG, 'g'), parsePx);
+      return calc(afterTwo);
+    } else {
+      return parsePx(this);
+    }
+  };
+}

components/painter/painter.json

@@ -0,0 +1,4 @@
+{
+  "component": true,
+  "usingComponents": {}
+}

components/painter/painter.wxml

@@ -0,0 +1,21 @@
+<view style="position: relative;{{customStyle}};{{painterStyle}}">
+  <block wx:if="{{!use2D}}">
+    <canvas canvas-id="photo" style="{{photoStyle}}" />
+    <block wx:if="{{dancePalette}}">
+      <canvas canvas-id="bottom" style="{{painterStyle}};position: absolute;" />
+      <canvas canvas-id="k-canvas" style="{{painterStyle}};position: absolute;" />
+      <canvas canvas-id="top" style="{{painterStyle}};position: absolute;" />
+      <canvas 
+        canvas-id="front" 
+        style="{{painterStyle}};position: absolute;"
+        bindtouchstart="onTouchStart"
+        bindtouchmove="onTouchMove"
+        bindtouchend="onTouchEnd"
+        bindtouchcancel="onTouchCancel"
+        disable-scroll="{{true}}" />
+      </block>
+  </block>
+  <block wx:if="{{use2D}}">
+    <canvas type="2d" id="photo" style="{{photoStyle}}" />
+  </block>
+</view>

components/painter/painter.wxss

@@ -0,0 +1 @@
+/* commpents/painter/painter.wxss */

components/tabBar/tabBar.js

@@ -0,0 +1,24 @@
+// components/tabBar/tabBar.js
+Component({
+
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+
+    }
+})

components/tabBar/tabBar.json

@@ -0,0 +1,7 @@
+{
+    "component": true,
+    "usingComponents": {
+        "van-tabbar": "@vant/weapp/tabbar/index",
+        "van-tabbar-item": "@vant/weapp/tabbar-item/index"
+    }
+}

components/tabBar/tabBar.wxml

@@ -0,0 +1,2 @@
+<!--components/tabBar/tabBar.wxml-->
+<text>components/tabBar/tabBar.wxml</text>

components/tabBar/tabBar.wxss

@@ -0,0 +1 @@
+/* components/tabBar/tabBar.wxss */

custom-tab-bar/index.js

@@ -0,0 +1,166 @@
+// components/tabBar/tabBar.js
+const app=getApp();
+import {throttle} from "../utils/util"
+import {storeBindingsBehavior} from "mobx-miniprogram-bindings"
+import {store} from '../store/store.js'
+import {getSign,getProjectStatus} from "../api/api"
+Component({
+    behaviors:[storeBindingsBehavior],
+    storeBindings:{
+        store,
+        fields:{
+            active:"active"
+        },
+        actions:{
+            updateActive:"updateActive"
+        }
+    },
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+
+    },
+    lifetimes: {
+        // 生命周期函数，可以为函数，或一个在methods段中定义的方法名
+        attached: function () { 
+            var info=wx.getSystemInfoSync()
+            if(info.platform == 'ios'){
+                this.setData({
+                    isIos:true
+                })
+            }
+        },
+        moved: function () { },
+        detached: function () { },
+      },
+    /**
+     * 组件的初始数据
+     */
+    data: {
+        isIos:false,
+        showAgree:false,
+        //active:'list',
+        img_host:app.hostConfig().imghost,
+      tabList:[{
+          id:'list',
+          name:'病例列表',
+          normal:app.hostConfig().imghost+'/list.png',
+          active:app.hostConfig().imghost+'/list_on.png'
+      },
+      {
+        id:'center',
+        name:'个人中心',
+        normal:app.hostConfig().imghost+'/center.png',
+        active:app.hostConfig().imghost+'/center_on.png'
+    }
+    ],
+     showDraft:false
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        handleGetProjectStatus(){
+            getProjectStatus().then(res=>{
+                    this.handleGetSign() 
+            }).catch((error)=>{
+                if(error.code==30007){
+                    wx.showToast({
+                        title: '您未登录',
+                        icon:'none',
+                        duration:4000
+                      })
+                    app.method.navigateTo({
+                      url: '/case/pages/mobileLogin/mobileLogin',
+                    })
+                 }
+            })
+        },
+        onConfirmDraft(){
+          this.setData({
+            showDraft:false
+          })
+          app.method.navigateTo({
+            url: '/case/pages/createCase/createCase',
+          })
+        },
+        onCancelDraft(){
+            this.setData({
+                showDraft:false
+            })
+        },
+        handleGetSign(){
+            getSign().then(res=>{
+                if(res && res.signImg){
+                    let caseDraft=wx.getStorageSync('caseDraft');
+                    if(caseDraft){
+                        this.setData({
+                            showDraft:true
+                        })
+                    }else{
+                      app.method.navigateTo({
+                        url: '/case/pages/createCase/createCase',
+                      })
+                    }
+                   
+                }else{
+                    this.setData({
+                        showAgree:true
+                    })
+                }  
+            }).catch(error=>{
+                 if(error.code==30007){
+                    wx.showToast({
+                        title: '您未登录',
+                        icon:'none',
+                        duration:4000
+                      })
+                    app.method.navigateTo({
+                      url: '/case/pages/mobileLogin/mobileLogin',
+                    })
+                 }
+            })
+          },
+        onConfirmAgree(){
+            this.setData({
+                showAgree:false
+            });
+            app.method.navigateTo({
+                url:'/case/pages/agreement/agreement'
+            })
+          },
+          onCancelAgree(){
+            this.setData({
+                showAgree:false
+            })
+          },
+        goCreate:throttle(function(){
+            this.handleGetProjectStatus()
+          }),
+        onChange(event) {
+            this.updateActive(event.detail)
+            // this.setData({ 
+            //     active:event.detail 
+            // });
+     
+            //console.log(event.detail )
+           let url=event.detail=='list'?'/pages/index/index':'/pages/personCenter/personCenter'
+           console.log(url);
+           let THIS=this;
+           wx.switchTab({
+             url: url,
+             success:function(){
+                //  THIS.setData({
+                //   active:app.globalData.tabBar_active
+                //  })
+                // console.log(app.globalData.tabBar_active);
+             }
+           })
+          
+         
+           
+          },
+    }
+})

custom-tab-bar/index.json

@@ -0,0 +1,8 @@
+{
+    "component": true,
+    "usingComponents": {
+        "dialog":"../components/dialog/dialog",
+        "van-tabbar": "@vant/weapp/tabbar/index",
+        "van-tabbar-item": "@vant/weapp/tabbar-item/index"
+    }
+}

custom-tab-bar/index.wxml

@@ -0,0 +1,25 @@
+<!--components/tabBar/tabBar.wxml-->
+<view class="tab"> 
+    <van-tabbar active="{{ active }}" bind:change="onChange" border="{{false}}" z-index="9999">
+  <van-tabbar-item name="{{item.id}}" wx:for="{{tabList}}" key="id">
+    <image
+      slot="icon"
+      src="{{item.normal }}"
+      mode="aspectFit"
+      style="width:48rpx; height: 48rpx;"
+    />
+    <image
+      slot="icon-active"
+      src="{{ item.active }}"
+      mode="aspectFit"
+      style="width:48rpx; height: 48rpx;"
+    />
+   {{item.name}}
+  </van-tabbar-item>
+  
+</van-tabbar>
+  <image src="{{img_host+'/create.png'}}" alt="" class="create {{isIos?'isIos':''}}" bind:tap="goCreate"/>
+</view>
+<dialog showDialog="{{showAgree}}" showCancel="{{showCancel}}" bind:confirm="onConfirmAgree" bind:cancel="onCancelAgree"  title="项目协议"  confirmText="查看" message="创建病例前需签署《人工肝病例登记系统》电子协议书"></dialog>
+
+<dialog showDialog="{{showDraft}}" title="注意" message="您已有一条草稿，是否去编辑？" confirmText="确定" bind:confirm="onConfirmDraft" bind:cancel="onCancelDraft"></dialog>

custom-tab-bar/index.wxss

@@ -0,0 +1,20 @@
+/* components/tabBar/tabBar.wxss */
+.tab{
+    position: relative;
+}
+.create{
+    position: fixed;
+    left:50%;
+    width: 153rpx;
+    padding:0px;
+    box-shadow: 0 -0.5px 0.5px rgba(0, 0, 0, 0.1); 
+    background-color: #fff;
+    height: 153rpx;
+    transform:translateX(-50%) ;
+    bottom:-3rpx;
+    border-radius: 50%;
+    z-index:9999;
+}
+.create.isIos{
+    bottom:63rpx;
+}

filters/filter.wxs

@@ -0,0 +1,53 @@
+
+function transforDay(time, type) {
+  if (time == null || type == '') {
+    return ''
+  }
+  if (arguments.length === 0) {
+    return null
+  }
+  var  time_cur=0
+  if(typeof time=="string"){
+    var reg = getRegExp("-", "g");
+  var timeS=time.replace(reg, '/');
+    time_cur = getDate(timeS).getTime();
+  }else{
+    time_cur=time*1000
+  }
+  var date = getDate(time_cur);//在wxs中不能使用new Date()来处理日期
+  console.log("date", date);
+  var y = date.getFullYear();
+  var m = addZero(date.getMonth() + 1);
+  var d = addZero(date.getDate());
+  var h =addZero(date.getHours());
+  var i = addZero(date.getMinutes());
+  var s =addZero(date.getSeconds());
+  var a = addZero(date.getDay());
+  var time_str = "";
+  if (type == 'month') {
+    time_str = y + '-' + m;
+  }else if(type=='day'){
+    time_str = m + '-' + d;
+  } else if(type=='HM'){
+    time_str =h + ':' + s;
+  }else if (type == 'date') {
+    time_str = y + '-' + m + '-' + d;
+  } else if(type == 'dateminute'){
+    time_str = y + '-' + m + '-' + d + ' ' + h + ':' + i 
+  }else if (type == 'datetime') {
+    time_str = y + '-' + m + '-' + d + ' ' + h + ':' + i + ':' + s;
+  } else if (type == 'onlyMonth') {
+    time_str = m;
+  } else if (type == 'onlyYear') {
+    time_str = y;
+  }
+  return time_str
+};
+function addZero(n) {
+  n = n.toString()
+  return n[1] ? n : '0' + n
+};
+
+module.exports = {
+    transforDay: transforDay
+};

package.json

@@ -0,0 +1,7 @@
+{
+  "dependencies": {
+    "@vant/weapp": "^1.10.12",
+    "mobx-miniprogram": "^4.13.2",
+    "mobx-miniprogram-bindings": "^2.1.5"
+  }
+}

pages/index/index.js

@@ -0,0 +1,426 @@
+// index.js
+ const app = getApp()
+ import {caseList,getSign,getProjectStatus} from "../../api/api"
+import {throttle} from "../../utils/util"
+import {createStoreBindings} from "mobx-miniprogram-bindings"
+import {store} from '../../store/store.js'
+Page({
+  data: {
+    showDelDraft:false,
+    editId:'',
+    showDraft:true,
+    reason:'',
+    status_title:'病例状态',
+    casetype_title:'病例类型',
+    draftTime:'',
+    caseDraft:{},
+    hasDraft:false,
+    showEntryTip:false,
+    showEntryTip_second:false,
+    statusList: [
+      { text: '待提交', value: -1,select:false },
+      { text: '待审核', value: 0,select:false },
+      { text: '待修改', value: 2,select:false },
+      { text: '已通过', value: 1,select:false },
+    ],
+    typeList:[{
+        text:'四次及以上疗程化',
+        value:1,
+        select:false,
+    },{
+        text:'早前期(INR≤1.5)',
+        value:2,
+        select:false,
+    }],
+    select_status:false,
+    select_type:false,
+    lock:false,
+    showCheck:false,
+    showAgree:false,
+    isTriggered:false,
+    list:[],
+    showCancel:true,
+    caseType:'',
+    status:'',
+    sortItemList:[{
+        column:0,
+        isAsc:true
+    }],
+    name:'',
+    pageNum:1,
+    pageSize:10,
+    img_host:app.hostConfig().imghost
+  },
+  handleGetProjectStatus(){
+    getProjectStatus().then(res=>{
+            this.handleGetSign() 
+    }).catch((error)=>{
+        if(error.code==30007){
+            wx.showToast({
+                title: '您未登录',
+                icon:'none',
+                duration:4000
+              })
+            app.method.navigateTo({
+              url: '/case/pages/mobileLogin/mobileLogin',
+            })
+         }
+    })
+},
+  onConfirmDelDraft(){
+    wx.setStorageSync('caseDraft', '');
+    this.setData({
+        showDelDraft:false,
+        hasDraft:false,
+        showDraft:false
+    });
+  },
+  onCancelDelDraft(){
+    this.setData({
+        showDelDraft:false,
+    })
+  },
+  onCloseSwipe(event){
+    const { position, instance } = event.detail;
+    switch (position) {
+      case 'left':
+      case 'cell':
+        instance.close();
+        break;
+      case 'right':
+       this.setData({
+           showDelDraft:true
+       })
+        break;
+    }
+  },
+  goDetail:throttle(function(event){
+      let {id,status,reason}=event.currentTarget.dataset;
+      if(status==2){
+         this.setData({
+            reason,
+            editId:id,
+            showCheck:true
+         })
+      }else{
+        app.method.navigateTo({
+            url: '/case/pages/createCase/createCase?medicalRecordId='+id+"&status="+status,
+          })
+      }
+    
+  }),
+  goCreate:throttle(function(){
+    this.handleGetProjectStatus();
+  
+    // app.method.navigateTo({
+    //     url: '/case/pages/createCase/createCase',
+    //   })
+   
+  }),
+  goAgreement:throttle(function(event){
+    app.method.navigateTo({
+      url:"/case/pages/privacy/privacy"
+    })
+  }),
+  handleGetSign(){
+    getSign().then(res=>{
+        if(res && res.signImg){
+            app.method.navigateTo({
+                url: '/case/pages/createCase/createCase',
+              })
+        }else{
+            this.setData({
+                showAgree:true
+            })
+        }  
+    }).catch(error=>{
+      
+         if(error.code==30007){
+            wx.showToast({
+                title: '您未登录',
+                icon:'none',
+                duration:4000
+              })
+            app.method.navigateTo({
+              url: '/case/pages/mobileLogin/mobileLogin',
+            })
+         }
+    })
+  },
+  handleCaseList(){
+      let { caseType,pageNum,pageSize,searchCount,status,name}=this.data;
+
+    caseList({
+        caseType,
+        pageNum,
+        name,
+        pageSize,
+        searchCount,
+        status
+    }).then(res=>{
+        if(status==='' && caseType===''){
+            this.toggleDraft();
+        };
+        this.setData({
+              isTriggered:false
+          })
+        // if(pageNum==1){
+        //    this.setData({
+        //        isTriggered:false
+        //    })
+        // }
+         if(res.list.length==0){
+             this.setData({
+                lock:true
+             });
+             return;
+         };
+         this.setData({
+             list:this.data.list.concat(res.list)
+         })
+       
+    }).catch(error=>{
+        this.setData({
+            isTriggered:false
+        })
+    })
+  },
+  onConfirm(){
+      let id=this.data.editId;
+    this.setData({
+        showCheck:false
+    })
+    app.method.navigateTo({
+        url: '/case/pages/createCase/createCase?medicalRecordId='+id+"&status=2",
+      })
+  },
+  onCancel(){
+    this.setData({
+        showCheck:false
+    })
+  },
+  onConfirmAgree(){
+    this.setData({
+        showAgree:false
+    });
+    app.method.navigateTo({
+        url:'/case/pages/agreement/agreement'
+    })
+  },
+  onCancelAgree(){
+    this.setData({
+        showAgree:false
+    })
+  },
+  goSearch(value){
+    this.setData({
+        lock:false,
+        pageNum:1,
+        name:value.detail,
+        list:[]
+      });
+      this.handleCaseList()
+  },
+  handleRefresher(){
+     let {status}=this.data;
+     if(status!=-1){
+        this.setData({
+            lock:false,
+            pageNum:1,
+            list:[]
+          });
+          this.handleCaseList()
+     }else{
+         this.setData({
+            isTriggered:false
+         })
+     }
+    
+   },
+   lower(e) {
+      
+    let {lock}=this.data;
+    let addPage=this.data.pageNum+1;
+    if(!lock){
+      this.setData({
+        pageNum:addPage
+      });
+      this.handleCaseList();
+    }  
+  },
+  chooseStatus(e){
+    let {hasDraft,statusList,typeList}=this.data;
+      let {id,value,name,select,index}=e.currentTarget.dataset;
+      this.selectComponent('#'+id).toggle(false);
+    
+      if(id=="item1"){
+        statusList.forEach((item,key)=>{
+            let cur_obj='statusList['+key+'].select'
+            this.setData({
+                [cur_obj]:false
+            })
+        })
+        let obj='statusList['+index+'].select';
+         this.setData({
+            status:!select?value:'',
+            status_title:!select?name:'病例状态',
+            [obj]:!select,   
+         })
+        if(value==-1 && this.data.statusList[0].select){
+            this.setData({
+                showDraft:hasDraft?true:false,
+                list:[]
+            })
+        }else if(value==-1 && !this.data.statusList[0].select){
+           
+            this.handleRefresher();
+         }else{
+            this.setData({
+                showDraft:false
+            })
+          this.handleRefresher();
+           
+        }
+        let hasSelect=this.data.statusList.some(item=> item.select==true );
+        if(hasSelect){
+            this.setData({
+                select_status:true
+            })
+        }else{
+            this.setData({
+                select_status:false
+            })
+        }
+
+      }else{
+        typeList.forEach((item,i)=>{
+            let cur_obj='typeList['+i+'].select'
+            this.setData({
+                [cur_obj]:false
+            })
+        })
+        let obj='typeList['+index+'].select';
+        this.setData({
+            caseType:!select?value:'',
+            [obj]:!select,
+            casetype_title:!select?name:'病例类型'
+         })
+         if(this.data.status==-1 && this.data.statusList[0].select){
+           
+            this.setData({
+                showDraft:hasDraft?true:false,
+                list:[]
+            })
+         }else if(this.data.status==-1 && !this.data.statusList[0].select){
+            this.handleRefresher();
+         }else{
+            this.setData({
+                showDraft:false
+            })
+            this.handleRefresher();
+         }
+         let hasSelect=this.data.typeList.some(item=> item.select==true );
+         if(hasSelect){
+             this.setData({
+                select_type:true
+             })
+         }else{
+            this.setData({
+                select_type:false
+             })  
+         }
+        console.log(this.data.typeList);
+      }
+      
+    
+  },
+  onConfirmEntry(){
+    this.setData({
+      showEntryTip:false
+    })
+  },
+  onCloseEntry(){
+    this.setData({
+       showEntryTip:true,
+      showEntryTip_second:true
+    })
+  },
+  onConfirmEntry_second(){
+    this.setData({
+      showEntryTip_second:false,
+    });
+    //wx.setStorageSync('hasEntry', true);
+   
+  },
+  onCloseEntry_second(){
+     wx.exitMiniProgram({success: (res) => {}})
+     this.setData({
+      showEntryTip_second:false,
+      showEntryTip:false,
+    });
+    
+   },
+   toggleDraft(){
+    let caseDraft=wx.getStorageSync('caseDraft');
+    let draftTime=wx.getStorageSync('draftTime')
+    if(caseDraft){
+        this.setData({
+            caseDraft:JSON.parse(caseDraft),
+            hasDraft:true,
+            showDraft:true,
+            draftTime:draftTime
+        })
+    }else{
+        this.setData({
+            showDraft:false,
+            hasDraft:false
+        })
+    }
+   },
+  onLoad(){
+    this.storeBindings = createStoreBindings(this, {
+        store,
+        fields: [,"active"],
+        actions: ["updateActive"],
+      });
+  },
+  onUnload() {
+    this.storeBindings.destroyStoreBindings();
+},
+  onShow(){
+      console.log("show")
+    this.updateActive('list');
+    let nav=this.selectComponent('#nav');
+    nav.clearKeyWord();
+    this.setData({
+        name:'',
+        select_status:false,
+        select_type:false,
+        status_title:'病例状态',
+        casetype_title:'病例类型',
+        status:'',
+        caseType:''
+    })
+    this.toggleDraft();
+    this.handleRefresher();
+    
+    wx.getPrivacySetting({
+        success: res => {
+          console.log(res) // 返回结果为: res = { needAuthorization: true/false, privacyContractName: '《xxx隐私保护指引》' }
+          if (res.needAuthorization) {
+            // 需要弹出隐私协议
+            this.setData({
+              showEntryTip:true
+            });
+          } else {
+            this.setData({
+              showEntryTip:false
+            })
+            // 用户已经同意过隐私协议，所以不需要再弹出隐私协议，也能调用已声明过的隐私
+          }
+        },
+        fail: () => {},
+        complete: () => {}
+      })
+  }
+});

pages/index/index.json

@@ -0,0 +1,13 @@
+{
+  "usingComponents": {
+    "dialog":"../../components/dialog/dialog",
+    "van-image": "@vant/weapp/image/index",
+    "van-overlay": "@vant/weapp/overlay/index",
+    "van-swipe-cell": "@vant/weapp/swipe-cell/index",
+    "nav":"../../components/nav/nav",
+    "van-dropdown-menu": "@vant/weapp/dropdown-menu/index",
+    "van-dropdown-item": "@vant/weapp/dropdown-item/index"
+  },
+  "disableScroll": true,
+  "navigationStyle":"custom"
+}

pages/index/index.wxml

@@ -0,0 +1,102 @@
+<wxs src="../../filters/filter.wxs" module="filters"></wxs>
+<nav bind:goSearch="goSearch" id="nav"></nav>
+<view class="page">
+    <view class="banner">
+      <image src="../../static/banner.png" mode="widthFix" class="bannerImg"/>
+    </view>
+<van-dropdown-menu active-color="#3881F7">
+  <van-dropdown-item id="item1" title="{{status_title}}"  title-class="droptitle {{select_status?'active':''}}">
+    <view class="row">
+      <view class="rowcell {{item.select?'active':''}}" wx:for="{{statusList}}" wx:key="value" bindtap="chooseStatus" data-id="item1" data-value="{{item.value}}" data-name="{{item.text}}" data-select="{{item.select}}" data-index="{{index}}">{{item.text}}</view>
+    </view>
+  </van-dropdown-item>
+  <van-dropdown-item id="item2" title="{{casetype_title}}" title-class="droptitle {{select_type?'active':''}}">
+    <view class="row type">
+      <view class="rowcell {{item.select?'active':''}}" wx:for="{{typeList}}" wx:key="value" bindtap="chooseStatus" data-id="item2" data-value="{{item.value}}" data-name="{{item.text}}" data-select="{{item.select}}" data-index="{{index}}">{{item.text}}</view>
+    </view>
+  </van-dropdown-item>
+</van-dropdown-menu>
+
+<view class="scrollwraper">
+    <scroll-view scroll-y style="width: 100%;height:100%" 	bindrefresherrefresh="handleRefresher" refresher-triggered="{{isTriggered}}"	refresher-threshold="100"	refresher-enabled="true"  bindscrolltolower="lower"  id="scroller" 	bounces="false">
+  
+<view class="viewcon" style="padding-bottom: 0;margin: 0 32rpx 16rpx;" >
+    <van-swipe-cell right-width="{{65 }}" wx:if="{{hasDraft && showDraft}}"  async-close
+  bind:close="onCloseSwipe">
+        <van-cell-group>
+           <view class="viewcell" bind:tap="goCreate" style="margin: 0;" > 
+            <view class="left">
+                <van-image width="94rpx" height="94rpx"  round src="{{caseDraft.sex==1?img_host+'/man.png':img_host+'/woman.png'}}" />
+                <view class="info">
+                   <view class="name">草稿</view>
+                   <view class="date">{{draftTime}}</view>
+                </view>
+            </view>
+            <view class="btn">待提交</view>
+          </view> 
+        </van-cell-group>
+   <view slot="right" class="van-swipe-cell__right">删除</view>
+</van-swipe-cell>
+       
+      </view>
+      <view wx:if="{{list.length>0 }}" class="viewcon">
+         
+         <view class="viewcell" wx:for="{{list}}" wx:key="id" bind:tap="goDetail" data-id="{{item.id}}" data-status="{{item.status}}" data-reason="{{item.reason}}">
+            <view class="left">
+                <van-image width="94rpx" height="94rpx"  round src="{{item.sex==1?img_host+'/man.png':img_host+'/woman.png'}}" />
+                <view class="info">
+                   <view class="name">{{item.userName}}({{item.uid}})</view>
+                   <view class="date">{{filters.transforDay(item.createTime,'date')}}</view>
+                </view>
+            </view>
+            <view class="btn {{item.status==1?'active':item.status==2?'red':''}}">{{item.status==0?'待审核':item.status==1?'已通过':item.status==2?'待修改':'未知'}}</view>
+         </view> 
+        
+        
+     </view>
+     
+      <view class="nonedata" wx:elif="{{!showDraft && list.length==0}}">
+         <image src="{{img_host+'/noCase.png'}}"  class="nocase" />
+         <view class="nodatatip">暂无病例，<text class="link" bind:tap="goCreate">点击创建病例</text></view>
+      </view>
+    </scroll-view>
+  </view>
+</view>
+<dialog showDialog="{{showCheck}}" showCancel="{{showCancel}}" bind:confirm="onConfirm" bind:cancel="onCancel"  title="审核未通过"  confirmText="去修改" showTip="{{true}}" message="{{reason}}"></dialog>
+<dialog showDialog="{{showAgree}}" showCancel="{{showCancel}}" bind:confirm="onConfirmAgree" bind:cancel="onCancelAgree"  title="项目协议"  confirmText="查看" message="创建病例前需签署《人工肝病例登记系统》电子协议书"></dialog>
+<dialog showDialog="{{showDelDraft}}" showCancel="{{showCancel}}" bind:confirm="onConfirmDelDraft" bind:cancel="onCancelDelDraft"  title="注意"  confirmText="确定"  message="确定删除草稿？"></dialog>
+<van-overlay show="{{ showEntryTip }}" zIndex="9999999">
+ <view class="wrapper">
+  <view class="privacyBox">
+  <view class="title">温馨提示</view>
+  <view class="entrymsg">
+    <view> 亲爱的用户，感谢您信任并使用人工肝病例登录系统！我们依据最新法律法规的要求，制定了<text class="navigator" bindtap="goAgreement" data-id="2">《隐私协议》</text>。请您仔细阅《隐私协议》，并确认了解我们对您的个人信息处理原则。</view>
+    <view>如您同意《隐私协议》，请点击“同意”开始使用我们的产品和服务。</view>
+  </view>
+<view class="btnbox">
+   <view class="cancel" bindtap="onCloseEntry">不同意</view>
+  <button id="agree-btn" 
+  plain
+  class="confirm" 
+  open-type="agreePrivacyAuthorization" bindagreeprivacyauthorization="onConfirmEntry">同意并继续</button>
+</view>
+</view>
+ </view>
+</van-overlay> 
+<van-overlay show="{{ showEntryTip_second }}" zIndex="99999999">
+ <view class="wrapper">
+  <view class="privacyBox">
+  <view class="title">温馨提示</view>
+<view class="entrymsg" >
+ <view> 很抱歉，如您不同意《隐私协议》，可能无法继续正常使用我们的服务，请您先同意哦~</view>
+</view>
+<view class="btnbox">
+   <view class="cancel" bindtap="onCloseEntry_second">不同意</view>
+  <button id="agree-btn" 
+  plain
+  class="confirm" 
+  bindtap="onConfirmEntry_second">好的</button>
+</view>
+</view>
+ </view>
+</van-overlay> 

pages/index/index.wxss

@@ -0,0 +1,208 @@
+page{
+    background-image: linear-gradient( #cdf0ff,#fff 30%);
+}
+.page {
+    margin-top: 290rpx;
+    overflow: hidden;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+   
+}
+.viewcon{
+    padding-bottom: 140rpx;
+}
+.banner {
+    margin: 24rpx 32rpx 0;
+    height: 264rpx;
+    background: #D8D8D8;
+    border-radius: 16rpx;
+}
+.banner .bannerImg{
+    width:100%;
+}
+.row {
+    margin: 24rpx 0;
+    display: flex;
+    padding: 0 32rpx;
+    justify-content: space-between;
+}
+
+.row .rowcell {
+    width: 160rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 72rpx;
+    color: rgba(0, 0, 0, 0.65);
+    font-size: 32rpx;
+    background: rgba(0, 0, 0, 0.06);
+    border-radius: 36rpx;
+}
+.type .rowcell{
+    width:auto;
+    padding:0 24rpx;
+}
+.row .rowcell.active {
+    color: #3881F7;
+    background: #EBF3FF;
+}
+
+.scrollwraper {
+    flex: 1;
+    overflow-y: scroll;
+    -webkit-overflow-scrolling: touch;
+    background: #f7f9f9;
+    padding-top: 30rpx;
+}
+
+.viewcell {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin: 0 32rpx 16rpx;
+    padding: 24rpx 21rpx;
+    background-color: #fff;
+    box-shadow: 0rpx 12rpx 28rpx 0rpx rgba(0, 0, 0, 0.03);
+    border-radius: 16rpx;
+}
+
+.viewcell .left {
+    display: flex;
+    align-items: center;
+}
+
+.viewcell .left .name {
+    font-size: 32rpx;
+    font-weight: 400;
+    color: rgba(0, 0, 0, 0.85);
+}
+
+.viewcell .left .date {
+    margin-top: 10rpx;
+    font-size: 28rpx;
+    font-weight: 400;
+    color: rgba(0, 0, 0, 0.25);
+}
+
+.viewcell .left .info {
+    margin-left: 13rpx;
+}
+
+.viewcell .btn {
+    width: 132rpx;
+    height: 56rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: #FFFFFF;
+    border-radius: 8rpx;
+    font-size: 28rpx;
+    font-weight: 400;
+    color: rgba(0, 0, 0, 0.65);
+    border: 2rpx solid rgba(0, 0, 0, 0.15);
+}
+
+.viewcell .btn.active {
+    color: #52C41A;
+    border: 2rpx solid #52C41A;
+}
+.viewcell .btn.red {
+    color: red;
+    border: 2rpx solid red;
+}
+.van-dropdown-menu {
+    margin:0 32rpx;
+    box-shadow: none!important;
+}
+.van-dropdown-menu__item{
+    flex:none!important;
+    margin-right: 20rpx;
+}
+.nocase{
+    width:300rpx;
+    height: 218rpx;
+}
+.nodatatip{
+    margin-top: 16rpx;
+    font-size: 28rpx;
+font-weight: 400;
+color: rgba(0,0,0,0.45);
+}
+.link{
+    color:#3881F7;
+}
+.droptitle{
+    font-size: 32rpx!important;
+}
+.droptitle.active{
+  
+    color:#3881F7!important;
+}
+.wrapper {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    height: 100%;
+  
+  }
+  .privacyBox {
+    width:90%;
+    background-color: #fff;
+    border-radius: 30rpx;
+  }
+  .privacyBox .title{
+    margin: 0;
+    text-align: center;
+    font-weight: 500;
+      line-height:24px;
+      padding-top:24px;
+      text-align: center;
+    font-size:16px;
+  }
+  .privacyBox .btnbox{
+    display: flex;
+    align-items: center;
+    border-top:1rpx solid #efefef;
+    width:100%;
+    font-size: 17px;
+  }
+  .privacyBox .btnbox .cancel{
+    flex:1;
+    height: 50px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .privacyBox .btnbox .confirm{
+    margin: 0;
+    height: 50px;
+    padding: 0;
+    color: #3881F7;
+    flex:1; 
+    font-size: 17px;
+    border: none!important;
+    border-left:1rpx solid #efefef!important;
+    display: flex;
+    background-color: none!important;
+    justify-content: center;
+    align-items: center;
+  }
+  .entrymsg{
+    -webkit-overflow-scrolling: touch;
+      font-size: 28rpx;
+      line-height: 40rpx;
+      max-height: 60vh;
+      overflow-y: auto;
+      padding: 48rpx;
+      text-align: left;
+  }
+  .van-swipe-cell__right{
+      width:65px;
+   display: flex;
+   font-size: 28rpx;
+   justify-content: center;
+   align-items: center;
+   color: #fff;
+   background-color: red;
+  }

pages/personCenter/personCenter.js

@@ -0,0 +1,149 @@
+// pages/personCenter/personCenter.js
+import {getInfo,logout} from "../../api/api"
+import {throttle} from "../../utils/util"
+import {createStoreBindings} from "mobx-miniprogram-bindings"
+import {store} from '../../store/store.js'
+const app=getApp();
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        isLogin:false,
+        userInfo:{
+            hospitalName:'',
+            name:'',
+            photo:'',
+            passNum:'',
+            waitNum:'',
+            refuseNum:'',
+           
+        },
+        waitSubmitNum:0,
+        img_host:app.hostConfig().imghost
+    },
+    goLogin:throttle(function(){
+        app.method.navigateTo({
+            url:'/case/pages/mobileLogin/mobileLogin'
+          })
+      }),
+      goAgree:throttle(function(){
+        app.method.navigateTo({
+            url: '/case/pages/agreement/agreement',
+          })
+      }),
+      goDescription:throttle(function(){
+        app.method.navigateTo({
+            url: '/case/pages/agreement/agreement?type=description',
+          })
+      }),
+      handleLogout:throttle(function(){
+        logout().then(res=>{
+           // wx.clearStorageSync()
+            const { envVersion } = wx.getAccountInfoSync().miniProgram;
+            let token=''
+            if(envVersion=="develop" || envVersion=="trial"){
+                token="DEV_CASE_TOKEN"
+            }else{
+                token="PROD_CASE_TOKEN"
+            }
+           wx.setStorageSync(token,'');
+           wx.setStorageSync('draftTime','');
+            wx.reLaunch({
+                url:'/case/pages/mobileLogin/mobileLogin'
+            })
+        })
+      }),
+    handleGetInfo(){
+        let {userInfo}=this.data;
+        getInfo().then(res=>{
+            this.setData({
+                isLogin:true
+            });
+            for (const key in userInfo) {
+               this.setData({
+                   ['userInfo.'+key]:res[key]
+               })
+            }
+        }).catch(error=>{
+            if(error.code==30007){
+                this.setData({
+                    isLogin:false
+                })
+            }
+        })
+    },
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad(options) {
+    
+     this.storeBindings = createStoreBindings(this, {
+        store,
+        fields: [,"active"],
+        actions: ["updateActive"],
+      });
+  
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow(){
+       let caseDraft=wx.getStorageSync('caseDraft');
+       if(caseDraft){
+           this.setData({
+            waitSubmitNum:1
+           })
+       }else{
+        this.setData({
+            waitSubmitNum:0
+           }) 
+       }
+       this.handleGetInfo();
+       this.updateActive('center')
+      },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide() {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload() {
+        this.storeBindings.destroyStoreBindings();
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh() {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom() {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    // onShareAppMessage() {
+
+    // }
+})

pages/personCenter/personCenter.json

@@ -0,0 +1,7 @@
+{
+    "usingComponents": {
+        "van-image": "@vant/weapp/image/index",
+        "van-icon": "@vant/weapp/icon/index"
+    },
+    "navigationStyle":"custom"
+}

pages/personCenter/personCenter.wxml

@@ -0,0 +1,58 @@
+<!--pages/personCenter/personCenter.wxml-->
+<view class="nav">
+    <view class="title">个人中心</view>
+</view>
+<view class="page">
+  
+    <view class="headbox" wx:if="{{isLogin}}">
+        <van-image round class="headImg" width="240rpx" height="240rpx" src="{{userInfo.photo?userInfo.photo:img_host+'/default_avatar.png'}}"
+/>
+   <view class="name">{{userInfo.name}}</view>
+   <view class="hospital">{{userInfo.hospitalName}}</view>
+    </view>
+    <view class="headbox" wx:else bind:tap="goLogin">
+        <van-image round class="headImg" width="240rpx" height="240rpx" src="{{img_host+'/default_avatar.png'}}"
+/>
+   <view class="name">点击登录</view>
+   <view class="hospital">-</view>
+    </view>
+    <view class="databox">
+      <videw class="datacell">
+         <view class="num">{{isLogin?userInfo.passNum:'-'}}</view>
+          <view class="name">已通过</view>
+      </videw>
+      <videw class="datacell">
+         <view class="num">{{isLogin?userInfo.waitNum:'-'}}</view>
+          <view class="name">待审核</view>
+      </videw>
+      <videw class="datacell">
+         <view class="num {{isLogin?'active':'-'}}">{{isLogin?userInfo.refuseNum:'-'}}</view>
+          <view class="name">待修改</view>
+      </videw>
+      <videw class="datacell">
+         <view class="num {{isLogin?'active':'-'}}">{{isLogin?waitSubmitNum:'-'}}</view>
+          <view class="name">待提交</view>
+      </videw>
+    </view>
+    <view class="itembox">
+       <view class="cell" bind:tap="goAgree">
+          <view class="row">
+            <view class="left">
+              <image src="{{img_host+'/xiangmu.png'}}" mode="" class="item"/>
+              <view class="name">项目协议</view>
+            </view>
+            <van-icon name="arrow" color="#8c8c8c"/>
+          </view>
+       </view>
+       <view class="cell"  bind:tap="goDescription">
+          <view class="row">
+            <view class="left">
+              <image src="{{img_host+'/caozuo.png'}}" mode="" class="item"/>
+              <view class="name">操作说明</view>
+            </view>
+            <van-icon name="arrow" color="#8c8c8c"/>
+          </view>
+       </view>  
+    </view>
+    <view class="logout" wx:if="{{isLogin}}" bind:tap="handleLogout">退出登录</view>
+</view>

pages/personCenter/personCenter.wxss

@@ -0,0 +1,116 @@
+/* pages/personCenter/personCenter.wxss */
+page{
+    background-image: linear-gradient( #cdf0ff,#F7F9F9 30%);
+}
+.page{
+    margin-top: 180rpx;
+}
+.nav{
+    position: fixed;
+    top:0;
+    height:290rpx;
+    width:750rpx;
+}
+.nav .title{
+    font-size: 36rpx;
+    font-weight: 600;
+    color: #272B34;
+    margin: 106rpx 32rpx 0;
+}
+.headbox{
+    margin:0 32rpx 24rpx;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+.headbox .name{
+    margin-top: 15rpx;
+font-size: 36rpx;
+line-height: 54rpx;
+font-weight: 550;
+color: rgba(0,0,0,0.85);
+}
+.hospital{
+    line-height: 44rpx;
+    font-size: 28rpx;
+    font-weight: 400;
+    color: rgba(0,0,0,0.65);  
+}
+.van-image--round{
+    box-shadow: 0 5rpx 10rpx 0 #ccc;
+}
+
+.databox{
+    padding:24rpx 0 ;
+    margin:0 32rpx;
+    display: flex;
+    background: #FFFFFF;
+   box-shadow: 0rpx 12rpx 28rpx 0rpx rgba(0,0,0,0.03);
+   border-radius: 16rpx;
+    justify-content: space-around;
+}
+.datacell{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+.datacell .num{
+   font-size: 40rpx;
+   font-weight: bold;
+   color: #333333;
+   line-height: 48rpx;
+}
+.datacell .num.active{
+    color: #3881F7;
+}
+.datacell .name{
+    font-size: 28rpx;
+    font-weight: 400;
+    color: rgba(0,0,0,0.45);
+    line-height: 44rpx; 
+}
+.itembox{
+    margin:24rpx 32rpx 0;
+    background: #FFFFFF;
+    box-shadow: 0rpx 12rpx 28rpx 0rpx rgba(0,0,0,0.03);
+    border-radius: 16rpx 
+}
+.itembox .cell{
+    padding:0 24rpx;
+}
+.cell .row{
+    padding:32rpx 0;
+    border-bottom: 1rpx solid rgba(0,0,0,0.1);
+    align-items: center;
+    display: flex;
+    justify-content: space-between;
+}
+.cell:last-child .row{
+    border-bottom:none
+}
+.cell .left{
+    display: flex;
+    align-items: center;
+}
+.cell .item{
+    width:40rpx;
+    height:40rpx;
+}
+.itembox .left .name{
+    font-size: 32rpx;
+    margin-left: 12rpx;
+font-weight: 400;
+color: rgba(0,0,0,0.65);
+}
+.logout{
+    margin:32rpx 32rpx 0;
+    height: 88rpx;
+    font-size: 32rpx;
+font-weight: 400;
+color: #FF4D4F;
+    background: #FFFFFF;
+    border-radius: 8rpx;
+    align-items: center;
+    display: flex;
+    justify-content: center;
+}

project.config.json

@@ -0,0 +1,36 @@
+{
+    "appid": "wx415cbcf96f4a3b27",
+    "compileType": "miniprogram",
+    "libVersion": "3.3.2",
+    "packOptions": {
+        "ignore": [],
+        "include": []
+    },
+    "setting": {
+        "coverView": true,
+        "es6": true,
+        "postcss": true,
+        "minified": true,
+        "enhance": true,
+        "showShadowRootInWxmlPanel": true,
+        "ignoreDevUnusedFiles": false,
+        "ignoreUploadUnusedFiles": false,
+        "packNpmRelationList": [
+            {
+                "packageJsonPath": "./package.json",
+                "miniprogramNpmDistDir": "./"
+            }
+        ],
+        "babelSetting": {
+            "ignore": [],
+            "disablePlugins": [],
+            "outputPath": ""
+        },
+        "packNpmManually": true
+    },
+    "condition": {},
+    "editorSetting": {
+        "tabIndent": "insertSpaces",
+        "tabSize": 4
+    }
+}