This commit is contained in:
lnn19986213
parent
7229361393
commit
616b3bedf7
|
|
@ -4969,9 +4969,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"caniuse-lite": {
|
"caniuse-lite": {
|
||||||
"version": "1.0.30001418",
|
"version": "1.0.30001478",
|
||||||
"resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001418.tgz",
|
"resolved": "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001478.tgz",
|
||||||
"integrity": "sha512-oIs7+JL3K9JRQ3jPZjlH6qyYDp+nBTCais7hjh0s+fuBwufc7uZ7hPYMXrDOJhV360KGMTcczMRObk0/iMqZRg=="
|
"integrity": "sha512-gMhDyXGItTHipJj2ApIvR+iVB5hd0KP3svMWWXDvZOmjzJJassGLMfxRkQCSYgGd2gtdL/ReeiyvMSFD1Ss6Mw=="
|
||||||
},
|
},
|
||||||
"capture-exit": {
|
"capture-exit": {
|
||||||
"version": "2.0.0",
|
"version": "2.0.0",
|
||||||
|
|
|
||||||
|
|
@ -135,7 +135,12 @@
|
||||||
</u-popup>
|
</u-popup>
|
||||||
<!-- 立即弹框ed -->
|
<!-- 立即弹框ed -->
|
||||||
<view class="operation">
|
<view class="operation">
|
||||||
<view class="start_icon" @click="ClickBuy">
|
<view class="start_icon" @click="goTalk" v-if="buyType == '4'">
|
||||||
|
<view class="col_icon " style="position: relative;">
|
||||||
|
<image style="width: 100%; height: 100%;" src='../../static/FamousArts/Talk.png'></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="start_icon" @click="ClickBuy" v-else>>
|
||||||
<view class="col_icon " style="position: relative;">
|
<view class="col_icon " style="position: relative;">
|
||||||
<image style="width: 100%; height: 100%;" src='../../static/shop/car.png'></image>
|
<image style="width: 100%; height: 100%;" src='../../static/shop/car.png'></image>
|
||||||
</view>
|
</view>
|
||||||
|
|
|
||||||
|
|
@ -1,9 +1,7 @@
|
||||||
<template>
|
<template>
|
||||||
<view>
|
<view>
|
||||||
|
|
||||||
<view class="wanShan" v-if="userInfoObj.userType!=='fws'">
|
<view class="wanShan" v-if="userInfoObj.userType!=='fws'">
|
||||||
<view class="person_itm">
|
<view class="person_itm">
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('姓名',userInfoObj.userName)">
|
<view class="person_itm_sign" @click="goChangeInfo('姓名',userInfoObj.userName)">
|
||||||
<text class="person_itm_sign_tit">姓名</text>
|
<text class="person_itm_sign_tit">姓名</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -18,7 +16,6 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('出生日期',userInfoObj.birthDay )">
|
<view class="person_itm_sign" @click="goChangeInfo('出生日期',userInfoObj.birthDay )">
|
||||||
<text class="person_itm_sign_tit">出生日期</text>
|
<text class="person_itm_sign_tit">出生日期</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -26,7 +23,6 @@
|
||||||
<u-icon name="calendar"></u-icon>
|
<u-icon name="calendar"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- <view class="person_itm_sign" @click="goChangeInfo('身份证号码',userInfoObj.idCard)">
|
<!-- <view class="person_itm_sign" @click="goChangeInfo('身份证号码',userInfoObj.idCard)">
|
||||||
<text class="person_itm_sign_tit">身份证号码</text>
|
<text class="person_itm_sign_tit">身份证号码</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -35,8 +31,6 @@
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
</view> -->
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<view class="person_itm">
|
<view class="person_itm">
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('民族',userInfoObj.nation)">
|
<view class="person_itm_sign" @click="goChangeInfo('民族',userInfoObj.nation)">
|
||||||
<text class="person_itm_sign_tit">民族</text>
|
<text class="person_itm_sign_tit">民族</text>
|
||||||
|
|
@ -45,9 +39,6 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('籍贯',userInfoObj.base)">
|
<view class="person_itm_sign" @click="goChangeInfo('籍贯',userInfoObj.base)">
|
||||||
<text class="person_itm_sign_tit">籍贯</text>
|
<text class="person_itm_sign_tit">籍贯</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -55,7 +46,6 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('政治面貌',userInfoObj.politics)">
|
<view class="person_itm_sign" @click="goChangeInfo('政治面貌',userInfoObj.politics)">
|
||||||
<text class="person_itm_sign_tit">政治面貌</text>
|
<text class="person_itm_sign_tit">政治面貌</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -82,17 +72,13 @@
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('头像',userInfoObj.images)">
|
<view class="person_itm_sign" @click="goChangeInfo('头像',userInfoObj.images)">
|
||||||
<text class="person_itm_sign_tit">头像</text>
|
<text class="person_itm_sign_tit">头像</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
||||||
<image class="avator" :src='imgUrl'>
|
<image class="avator" :src='imgUrl'>
|
||||||
</image>
|
</image>
|
||||||
|
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<!-- 协会会员个人中心 -->
|
<!-- 协会会员个人中心 -->
|
||||||
<view class="person_itm" v-if="userInfoObj.userType=='xhhy'">
|
<view class="person_itm" v-if="userInfoObj.userType=='xhhy'">
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('所属协会',userInfoObj.association.name )">
|
<view class="person_itm_sign" @click="goChangeInfo('所属协会',userInfoObj.association.name )">
|
||||||
|
|
@ -102,9 +88,6 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('入会时间',userInfoObj.comeTime)">
|
<view class="person_itm_sign" @click="goChangeInfo('入会时间',userInfoObj.comeTime)">
|
||||||
<text class="person_itm_sign_tit">入会时间</text>
|
<text class="person_itm_sign_tit">入会时间</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -122,9 +105,6 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<!-- <view class="person_itm_sign" @click="goChangeInfo('艺术成就',JSON.parse(userInfoObj.artAtt))"> -->
|
<!-- <view class="person_itm_sign" @click="goChangeInfo('艺术成就',JSON.parse(userInfoObj.artAtt))"> -->
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('艺术成就',JSON.parse(userInfoObj.artAtt))">
|
<view class="person_itm_sign" @click="goChangeInfo('艺术成就',JSON.parse(userInfoObj.artAtt))">
|
||||||
<text class="person_itm_sign_tit">艺术成就</text>
|
<text class="person_itm_sign_tit">艺术成就</text>
|
||||||
|
|
@ -147,14 +127,12 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('是否已入协会',JSON.parse(userInfoObj.isAssociation))">
|
<view class="person_itm_sign" @click="goChangeInfo('是否已入协会',JSON.parse(userInfoObj.isAssociation))">
|
||||||
<text class="person_itm_sign_tit">是否已入协会</text>
|
<text class="person_itm_sign_tit">是否已入协会</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
<u-switch disabled v-model="userInfoObj.isAssociation" activeColor="#99241B" size=20></u-switch>
|
<u-switch disabled v-model="userInfoObj.isAssociation" activeColor="#99241B" size=20></u-switch>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('入会时间',userInfoObj.comeTime)"
|
<view class="person_itm_sign" @click="goChangeInfo('入会时间',userInfoObj.comeTime)"
|
||||||
v-if="userInfoObj.isAssociation">
|
v-if="userInfoObj.isAssociation">
|
||||||
<text class="person_itm_sign_tit">入会时间</text>
|
<text class="person_itm_sign_tit">入会时间</text>
|
||||||
|
|
@ -174,7 +152,6 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('地址',userInfoObj.serviceAddress)">
|
<view class="person_itm_sign" @click="goChangeInfo('地址',userInfoObj.serviceAddress)">
|
||||||
<text class="person_itm_sign_tit">地址</text>
|
<text class="person_itm_sign_tit">地址</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -182,7 +159,6 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('实景照',userInfoObj.photo)">
|
<view class="person_itm_sign" @click="goChangeInfo('实景照',userInfoObj.photo)">
|
||||||
<text class="person_itm_sign_tit">实景照</text>
|
<text class="person_itm_sign_tit">实景照</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -190,18 +166,13 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('资质证',userInfoObj.cfPhoto)">
|
<view class="person_itm_sign" @click="goChangeInfo('资质证',userInfoObj.cfPhoto)">
|
||||||
<text class="person_itm_sign_tit">资质证</text>
|
<text class="person_itm_sign_tit">资质证</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<view class="person_itm">
|
<view class="person_itm">
|
||||||
<view @click="goChangeInfo('服务内容介绍',userInfoObj.info)">
|
<view @click="goChangeInfo('服务内容介绍',userInfoObj.info)">
|
||||||
<view class="textAreaCss">
|
<view class="textAreaCss">
|
||||||
|
|
@ -211,7 +182,6 @@
|
||||||
<u--textarea v-model="userInfoObj.info" placeholder="请输入介绍" style="background-color: #F8F8F8;">
|
<u--textarea v-model="userInfoObj.info" placeholder="请输入介绍" style="background-color: #F8F8F8;">
|
||||||
</u--textarea>
|
</u--textarea>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('负责人姓名',userInfoObj.fzr)">
|
<view class="person_itm_sign" @click="goChangeInfo('负责人姓名',userInfoObj.fzr)">
|
||||||
<text class="person_itm_sign_tit">负责人姓名</text>
|
<text class="person_itm_sign_tit">负责人姓名</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -219,7 +189,6 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('服务开始时间',userInfoObj.timeStart)">
|
<view class="person_itm_sign" @click="goChangeInfo('服务开始时间',userInfoObj.timeStart)">
|
||||||
<text class="person_itm_sign_tit">服务开始时间</text>
|
<text class="person_itm_sign_tit">服务开始时间</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -234,7 +203,6 @@
|
||||||
<u-icon name="calendar"></u-icon>
|
<u-icon name="calendar"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- <view class="person_itm_sign" @click="goChangeInfo('电话','13888888888')">
|
<!-- <view class="person_itm_sign" @click="goChangeInfo('电话','13888888888')">
|
||||||
<text class="person_itm_sign_tit">电话</text>
|
<text class="person_itm_sign_tit">电话</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
|
|
@ -242,8 +210,15 @@
|
||||||
<u-icon name="arrow-right"></u-icon>
|
<u-icon name="arrow-right"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view> -->
|
</view> -->
|
||||||
|
<view class="person_itm_sign" @click="goChangeInfo('头像',userInfoObj.images)">
|
||||||
<view class="person_itm_sign" @click="goChangeInfo('密码',userInfoObj.pasw)">
|
<text class="person_itm_sign_tit">头像</text>
|
||||||
|
<view class="person_itm_sign_right">
|
||||||
|
<image class="avator" :src='imgUrl'>
|
||||||
|
</image>
|
||||||
|
<u-icon name="arrow-right"></u-icon>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="person_itm_sign" @click="goChangePasw">
|
||||||
<text class="person_itm_sign_tit">密码</text>
|
<text class="person_itm_sign_tit">密码</text>
|
||||||
<view class="person_itm_sign_right">
|
<view class="person_itm_sign_right">
|
||||||
<text> {{userInfoObj.pasw}}</text>
|
<text> {{userInfoObj.pasw}}</text>
|
||||||
|
|
@ -252,7 +227,6 @@
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 服务商个人中心 ed-->
|
<!-- 服务商个人中心 ed-->
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -268,7 +242,6 @@
|
||||||
stanWorkList: ['蒙娜丽莎', '高月'],
|
stanWorkList: ['蒙娜丽莎', '高月'],
|
||||||
userInfoObj: {},
|
userInfoObj: {},
|
||||||
baseurl: http.config.baseUrl.replace('/h5/api', ''), //'http://192.168.0.29:8080'
|
baseurl: http.config.baseUrl.replace('/h5/api', ''), //'http://192.168.0.29:8080'
|
||||||
|
|
||||||
xieName: '',
|
xieName: '',
|
||||||
userType: '',
|
userType: '',
|
||||||
imgUrl: ''
|
imgUrl: ''
|
||||||
|
|
@ -280,7 +253,6 @@
|
||||||
uni.navigateTo({
|
uni.navigateTo({
|
||||||
url: `/pages/PersonalCenter/ReEditSingleInfo?key=${JSON.stringify(k)}&value=${JSON.stringify(v)}`
|
url: `/pages/PersonalCenter/ReEditSingleInfo?key=${JSON.stringify(k)}&value=${JSON.stringify(v)}`
|
||||||
})
|
})
|
||||||
|
|
||||||
},
|
},
|
||||||
requestUserinfo() {
|
requestUserinfo() {
|
||||||
this.http.request('/user/userInfo', {}, "GET").then((res) => {
|
this.http.request('/user/userInfo', {}, "GET").then((res) => {
|
||||||
|
|
@ -288,9 +260,7 @@
|
||||||
console.log("res", res.data);
|
console.log("res", res.data);
|
||||||
this.userInfoObj = res.data;
|
this.userInfoObj = res.data;
|
||||||
if(res.data.artAtt==""){
|
if(res.data.artAtt==""){
|
||||||
|
|
||||||
this.userInfoObj.artAtt= JSON.stringify([""])
|
this.userInfoObj.artAtt= JSON.stringify([""])
|
||||||
|
|
||||||
}
|
}
|
||||||
if(res.data.greats==""){
|
if(res.data.greats==""){
|
||||||
this.userInfoObj.greats= JSON.stringify([""])
|
this.userInfoObj.greats= JSON.stringify([""])
|
||||||
|
|
@ -298,16 +268,12 @@
|
||||||
if(res.data.opus=="[]"){
|
if(res.data.opus=="[]"){
|
||||||
this.userInfoObj.opus= JSON.stringify([""])
|
this.userInfoObj.opus= JSON.stringify([""])
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// this.imgUrl=baseurl+JSON.parse(this.userInfoObj.images)[0]
|
// this.imgUrl=baseurl+JSON.parse(this.userInfoObj.images)[0]
|
||||||
this.imgUrl = JSON.parse(this.userInfoObj.images)[0]
|
this.imgUrl = JSON.parse(this.userInfoObj.images)[0]
|
||||||
|
|
||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: error
|
title: error
|
||||||
})
|
})
|
||||||
|
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
goChangePasw() {
|
goChangePasw() {
|
||||||
|
|
|
||||||
|
|
@ -137,14 +137,6 @@
|
||||||
<u-button class="custom-style" :disabled='!isSubmit'
|
<u-button class="custom-style" :disabled='!isSubmit'
|
||||||
style="background-color:#99241B ; color: #FFFFFF; margin-top: 32rpx; width: calc(100% - 96rpx);"
|
style="background-color:#99241B ; color: #FFFFFF; margin-top: 32rpx; width: calc(100% - 96rpx);"
|
||||||
type="default" @click="submit()">保存</u-button>
|
type="default" @click="submit()">保存</u-button>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -181,8 +173,6 @@
|
||||||
},
|
},
|
||||||
timeMode: 'date', //时间选择器模式 date tiem
|
timeMode: 'date', //时间选择器模式 date tiem
|
||||||
postFileList2: [], //用来上传的数组
|
postFileList2: [], //用来上传的数组
|
||||||
baseurl: http.config.baseUrl.replace('/h5/api', ''),
|
|
||||||
// baseurl: '',
|
|
||||||
fileList4: [], //头像上传
|
fileList4: [], //头像上传
|
||||||
fileList1: [], //资质证 实景照
|
fileList1: [], //资质证 实景照
|
||||||
fileList2: [], //代表作照片
|
fileList2: [], //代表作照片
|
||||||
|
|
@ -261,16 +251,16 @@
|
||||||
if (this.Edkey == '头像') {
|
if (this.Edkey == '头像') {
|
||||||
|
|
||||||
this.fileList4.push({
|
this.fileList4.push({
|
||||||
url: this.baseurl + this.Edvalue
|
url: this.Edvalue
|
||||||
})
|
})
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.Edkey == '实景照' || this.Edkey == '资质证') {
|
if (this.Edkey == '实景照' || this.Edkey == '资质证') {
|
||||||
let urL = this.baseurl
|
let arr = this.Edvalue.split(",")
|
||||||
let arr = JSON.parse(this.Edvalue).map((vv, ii) => {
|
// JSON.parse(this.Edvalue).map((vv, ii) => {
|
||||||
return urL + vv
|
// return urL + vv
|
||||||
})
|
// })
|
||||||
for (let i = 0; i < arr.length; i++) {
|
for (let i = 0; i < arr.length; i++) {
|
||||||
this.fileList1.push({
|
this.fileList1.push({
|
||||||
url: arr[i]
|
url: arr[i]
|
||||||
|
|
|
||||||
|
|
@ -1,47 +1,36 @@
|
||||||
<template>
|
<template>
|
||||||
<view>
|
<view>
|
||||||
|
|
||||||
<u--form :model="model1" ref="form1" labelPosition="top" labelWidth='auto' :labelStyle='{fontWeight:800}'>
|
<u--form :model="model1" ref="form1" labelPosition="top" labelWidth='auto' :labelStyle='{fontWeight:800}'>
|
||||||
|
|
||||||
<!-- 完善资料 -->
|
<!-- 完善资料 -->
|
||||||
<!-- 这里加了 v-for 导致 ref 失效 -->
|
<!-- 这里加了 v-for 导致 ref 失效 -->
|
||||||
<view class="wanShan" v-if="pageTypeId!=='fws'">
|
<view class="wanShan" v-if="pageTypeId!=='fws'">
|
||||||
<view class="data_itm_box">
|
<view class="data_itm_box">
|
||||||
|
|
||||||
<u-form-item prop="userInfo.name" ref="item1" class="data_itm">
|
<u-form-item prop="userInfo.name" ref="item1" class="data_itm">
|
||||||
<text class="label_t"><text style="color: #99241B;">*</text>姓名</text>
|
<text class="label_t"><text style="color: #99241B;">*</text>姓名</text>
|
||||||
<u--input class="p32" placeholder="请填写姓名" inputAlign="right" clearable
|
<u--input class="p32" placeholder="请填写姓名" inputAlign="right" clearable
|
||||||
v-model="model1.userInfo.name" border="none"></u--input>
|
v-model="model1.userInfo.name" border="none"></u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
<u-form-item prop="userInfo.sex" ref="item1" @click="showSex=true" class="data_itm">
|
<u-form-item prop="userInfo.sex" ref="item1" @click="showSex=true" class="data_itm">
|
||||||
<text class="label_t"><text style="color: #99241B;">*</text>性别</text>
|
<text class="label_t"><text style="color: #99241B;">*</text>性别</text>
|
||||||
<u--input class="p32" placeholder="请填选择性别" v-model="model1.userInfo.sex" readonly
|
<u--input class="p32" placeholder="请填选择性别" v-model="model1.userInfo.sex" readonly
|
||||||
inputAlign="right" border="none">
|
inputAlign="right" border="none">
|
||||||
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
</u--input>
|
</u--input>
|
||||||
|
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
<u-form-item ref="item1" @click="showBirthday=true" class="data_itm">
|
<u-form-item ref="item1" @click="showBirthday=true" class="data_itm">
|
||||||
<text class="label_t"><text style="color: #99241B;">*</text>出生日期</text>
|
<text class="label_t"><text style="color: #99241B;">*</text>出生日期</text>
|
||||||
<u--input class="p32" placeholder="请填选择出生日期" v-model="model1.userInfo.birthday" readonly
|
<u--input class="p32" placeholder="请填选择出生日期" v-model="model1.userInfo.birthday" readonly
|
||||||
inputAlign="right" border="none">
|
inputAlign="right" border="none">
|
||||||
<u-icon slot="suffix" name="calendar"></u-icon>
|
<u-icon slot="suffix" name="calendar"></u-icon>
|
||||||
</u--input>
|
</u--input>
|
||||||
|
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
<u-form-item prop="userInfo.idCOde" ref="item1" class="data_itm">
|
<u-form-item prop="userInfo.idCOde" ref="item1" class="data_itm">
|
||||||
<text class="label_t"><text style="color: #99241B;">*</text>身份证号</text>
|
<text class="label_t"><text style="color: #99241B;">*</text>身份证号</text>
|
||||||
<u--input class="p32" placeholder="请输入身份证号码" inputAlign="right" clearable
|
<u--input class="p32" placeholder="请输入身份证号码" inputAlign="right" clearable
|
||||||
v-model="model1.userInfo.idCOde" border="none"></u--input>
|
v-model="model1.userInfo.idCOde" border="none"></u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="data_itm_box">
|
<view class="data_itm_box">
|
||||||
|
|
||||||
<!-- <u-form-item ref="item1" @click="zuShow=true" class="data_itm"> -->
|
<!-- <u-form-item ref="item1" @click="zuShow=true" class="data_itm"> -->
|
||||||
<u-form-item ref="item1" class="data_itm">
|
<u-form-item ref="item1" class="data_itm">
|
||||||
<text class="label_t"><text style="color: #99241B;">*</text>民族</text>
|
<text class="label_t"><text style="color: #99241B;">*</text>民族</text>
|
||||||
|
|
@ -49,7 +38,6 @@
|
||||||
<!-- <u-icon slot="suffix" name="arrow-right"></u-icon> -->
|
<!-- <u-icon slot="suffix" name="arrow-right"></u-icon> -->
|
||||||
</u--input>
|
</u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
<!-- <u-form-item ref="item1" @click="jigaunShow=true" class="data_itm"> -->
|
<!-- <u-form-item ref="item1" @click="jigaunShow=true" class="data_itm"> -->
|
||||||
<u-form-item ref="item1" class="data_itm">
|
<u-form-item ref="item1" class="data_itm">
|
||||||
<text class="label_t"><text style="color: #99241B;">*</text>籍贯</text>
|
<text class="label_t"><text style="color: #99241B;">*</text>籍贯</text>
|
||||||
|
|
@ -65,10 +53,7 @@
|
||||||
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
</u--input>
|
</u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="data_itm_box">
|
<view class="data_itm_box">
|
||||||
<!-- <u-form-item prop="userInfo.phoneNum" ref="item1" class="data_itm">
|
<!-- <u-form-item prop="userInfo.phoneNum" ref="item1" class="data_itm">
|
||||||
<text class="label_t">联系电话</text>
|
<text class="label_t">联系电话</text>
|
||||||
|
|
@ -81,10 +66,7 @@
|
||||||
v-model="model1.userInfo.pasw" border="none"></u--input>
|
v-model="model1.userInfo.pasw" border="none"></u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
|
||||||
<view class="data_itm_box" style="padding: 32rpx ;">
|
<view class="data_itm_box" style="padding: 32rpx ;">
|
||||||
|
|
||||||
<view class="data_itm">
|
<view class="data_itm">
|
||||||
<view class="data_itm_key label_t">
|
<view class="data_itm_key label_t">
|
||||||
<text style="color: #99241B;">*</text>头像上传
|
<text style="color: #99241B;">*</text>头像上传
|
||||||
|
|
@ -93,15 +75,11 @@
|
||||||
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList3"
|
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList3"
|
||||||
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="1">
|
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="1">
|
||||||
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
||||||
|
|
||||||
</u-upload>
|
</u-upload>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 协会会员 -->
|
<!-- 协会会员 -->
|
||||||
<view class="data_itm_box" v-if='pageTypeId=="xhhy"'>
|
<view class="data_itm_box" v-if='pageTypeId=="xhhy"'>
|
||||||
|
|
||||||
<u-form-item ref="item1" @click="xieShow=true" class="data_itm">
|
<u-form-item ref="item1" @click="xieShow=true" class="data_itm">
|
||||||
<text class="label_t">*所属协会</text>
|
<text class="label_t">*所属协会</text>
|
||||||
<u--input class="p32" placeholder="请选择所属协会" v-model="xieValue" readonly inputAlign="right"
|
<u--input class="p32" placeholder="请选择所属协会" v-model="xieValue" readonly inputAlign="right"
|
||||||
|
|
@ -116,13 +94,11 @@
|
||||||
<u-icon slot="suffix" name="calendar"></u-icon>
|
<u-icon slot="suffix" name="calendar"></u-icon>
|
||||||
</u--input>
|
</u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<!-- 文艺人才 -->
|
<!-- 文艺人才 -->
|
||||||
<view class="wenyi" v-if="pageTypeId=='wyrc'">
|
<view class="wenyi" v-if="pageTypeId=='wyrc'">
|
||||||
<!-- <view class="wenyi"> -->
|
<!-- <view class="wenyi"> -->
|
||||||
<view class="data_itm_box">
|
<view class="data_itm_box">
|
||||||
|
|
||||||
<u-form-item ref="item1" @click="renCaiShow=true" class="data_itm">
|
<u-form-item ref="item1" @click="renCaiShow=true" class="data_itm">
|
||||||
<text class="label_t">人才类型</text>
|
<text class="label_t">人才类型</text>
|
||||||
<u--input class="p32" placeholder="请选择类型" v-model="renCaiValue" readonly inputAlign="right"
|
<u--input class="p32" placeholder="请选择类型" v-model="renCaiValue" readonly inputAlign="right"
|
||||||
|
|
@ -130,13 +106,9 @@
|
||||||
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
</u--input>
|
</u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
|
|
||||||
<u-form-item ref="item1" label='艺术成就' class="data_itm te">
|
<u-form-item ref="item1" label='艺术成就' class="data_itm te">
|
||||||
|
|
||||||
<view class="chen_itm" v-for="(v,i) in artlist" :key="i">
|
<view class="chen_itm" v-for="(v,i) in artlist" :key="i">
|
||||||
<input type="text" v-model.trim="artlist[i]" placeholder="请输入艺术成就" class="chengjiu" />
|
<input type="text" v-model.trim="artlist[i]" placeholder="请输入艺术成就" class="chengjiu" />
|
||||||
|
|
||||||
<view class="right_img_box">
|
<view class="right_img_box">
|
||||||
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(0)"
|
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(0)"
|
||||||
v-if="artlist.length==i+1">
|
v-if="artlist.length==i+1">
|
||||||
|
|
@ -146,7 +118,6 @@
|
||||||
<img style="width: 40rpx; height: 40rpx;" src="../../static/improveData/del.png"
|
<img style="width: 40rpx; height: 40rpx;" src="../../static/improveData/del.png"
|
||||||
alt="">
|
alt="">
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
@ -154,7 +125,6 @@
|
||||||
<view class="chen_itm" v-for="(va,ind) in honorList" :key="ind">
|
<view class="chen_itm" v-for="(va,ind) in honorList" :key="ind">
|
||||||
<input type="text" v-model.trim="honorList[ind]" placeholder="请输入荣誉奖项" class="chengjiu" />
|
<input type="text" v-model.trim="honorList[ind]" placeholder="请输入荣誉奖项" class="chengjiu" />
|
||||||
<view class="right_img_box">
|
<view class="right_img_box">
|
||||||
|
|
||||||
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(1)"
|
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(1)"
|
||||||
v-if="honorList.length==ind+1">
|
v-if="honorList.length==ind+1">
|
||||||
<image src="../../static/improveData/redAdd.png" mode=""></image>
|
<image src="../../static/improveData/redAdd.png" mode=""></image>
|
||||||
|
|
@ -168,13 +138,11 @@
|
||||||
</view>
|
</view>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
<u-form-item ref="item1" label='代表作' class="data_itm te">
|
<u-form-item ref="item1" label='代表作' class="data_itm te">
|
||||||
|
|
||||||
<view v-for="(val,index) in StandradList" :key="index">
|
<view v-for="(val,index) in StandradList" :key="index">
|
||||||
<view class="tt"
|
<view class="tt"
|
||||||
style="display: flex; justify-content: space-between; align-items: center; ">
|
style="display: flex; justify-content: space-between; align-items: center; ">
|
||||||
<input type="text" v-model.trim="StandradList[index]" placeholder="请输入作品名称"
|
<input type="text" v-model.trim="StandradList[index]" placeholder="请输入作品名称"
|
||||||
class="chengjiu" />
|
class="chengjiu" />
|
||||||
|
|
||||||
<view class="right_img_box" style="margin-left: 16rpx;">
|
<view class="right_img_box" style="margin-left: 16rpx;">
|
||||||
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(2)"
|
<view style="width: 80rpx; height: 80rpx;" class="addImg" @click="AddItem(2)"
|
||||||
v-if="StandradList.length==index+1">
|
v-if="StandradList.length==index+1">
|
||||||
|
|
@ -186,10 +154,8 @@
|
||||||
alt="">
|
alt="">
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="chen_itm ">
|
<view class="chen_itm ">
|
||||||
|
|
||||||
<u-upload class="WenYiUpload" accept="image" width="172rpx" height="172rpx"
|
<u-upload class="WenYiUpload" accept="image" width="172rpx" height="172rpx"
|
||||||
:fileList="fileList2[index]" @afterRead="afterRead1" @delete="deletePic1"
|
:fileList="fileList2[index]" @afterRead="afterRead1" @delete="deletePic1"
|
||||||
:name='String(index)' multiple>
|
:name='String(index)' multiple>
|
||||||
|
|
@ -197,7 +163,6 @@
|
||||||
src="../../static/improveData/imgjia.png">
|
src="../../static/improveData/imgjia.png">
|
||||||
</image>
|
</image>
|
||||||
</u-upload>
|
</u-upload>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
@ -214,18 +179,14 @@
|
||||||
</u-radio-group>
|
</u-radio-group>
|
||||||
</view>
|
</view>
|
||||||
<!-- <u-switch v-model="isJioned" activeColor="#99241B" size=20></u-switch> -->
|
<!-- <u-switch v-model="isJioned" activeColor="#99241B" size=20></u-switch> -->
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
|
<u-form-item ref="item1" @click="xieShow=true" class="data_itm" v-if="isJioned">
|
||||||
<u-form-item ref="item1" @click="xieShow=true" class="data_itm">
|
|
||||||
<text class="label_t">*所属协会</text>
|
<text class="label_t">*所属协会</text>
|
||||||
<u--input class="p32" placeholder="请选择所属协会" v-model="xieValue" readonly inputAlign="right"
|
<u--input class="p32" placeholder="请选择所属协会" v-model="xieValue" readonly inputAlign="right"
|
||||||
border="none">
|
border="none">
|
||||||
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
<u-icon slot="suffix" name="arrow-right"></u-icon>
|
||||||
</u--input>
|
</u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
|
|
||||||
<u-form-item ref="item1" @click="showJionmeet=true" class="data_itm" v-if="isJioned">
|
<u-form-item ref="item1" @click="showJionmeet=true" class="data_itm" v-if="isJioned">
|
||||||
<text class="label_t">入会时间</text>
|
<text class="label_t">入会时间</text>
|
||||||
<u--input class="p32" placeholder="请选择时间" v-model="model1.userInfo.jionTime" readonly
|
<u--input class="p32" placeholder="请选择时间" v-model="model1.userInfo.jionTime" readonly
|
||||||
|
|
@ -240,57 +201,58 @@
|
||||||
<view class="fuwushang" v-if="pageTypeId=='fws'">
|
<view class="fuwushang" v-if="pageTypeId=='fws'">
|
||||||
<view class="data_itm_box">
|
<view class="data_itm_box">
|
||||||
<u-form-item prop="userInfo.ServerName" ref="item1" class="data_itm">
|
<u-form-item prop="userInfo.ServerName" ref="item1" class="data_itm">
|
||||||
<text class="label_t">服务名称</text>
|
<text class="label_t">*服务商名称</text>
|
||||||
<u--input class="p32" placeholder="请输入服务名称" inputAlign="right" clearable
|
<u--input class="p32" placeholder="请输入服务商名称" inputAlign="right" clearable
|
||||||
v-model="model1.userInfo.ServerName" border="none"></u--input>
|
v-model="model1.userInfo.ServerName" border="none"></u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
<view class="data_itm">
|
||||||
|
<view class="data_itm_key label_t">
|
||||||
|
*服务商头像上传
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList3"
|
||||||
|
@afterRead="afterRead" @delete="deletePic" name="3" multiple :maxCount="1">
|
||||||
|
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
||||||
|
</u-upload>
|
||||||
<u-form-item prop="userInfo.Address" ref="item1" class="data_itm">
|
<u-form-item prop="userInfo.Address" ref="item1" class="data_itm">
|
||||||
<text class="label_t">地址</text>
|
<text class="label_t">*地址</text>
|
||||||
<u--input class="p32" placeholder="请输入地址" inputAlign="right" clearable
|
<u--input class="p32" placeholder="*请输入地址" inputAlign="right" clearable
|
||||||
v-model="model1.userInfo.Address" border="none"></u--input>
|
v-model="model1.userInfo.Address" border="none"></u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
<u-form-item ref="item1" label="实景照片上传" class="data_itm">
|
<u-form-item ref="item1" label="*实景照片上传" class="data_itm">
|
||||||
|
|
||||||
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList1"
|
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList1"
|
||||||
@afterRead="afterRead" @delete="deletePic" name="1" multiple>
|
@afterRead="afterRead" @delete="deletePic" name="1" multiple>
|
||||||
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
||||||
</u-upload>
|
</u-upload>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
<u-form-item ref="item1" label="*资质照片上传" class="data_itm">
|
||||||
<u-form-item ref="item1" label="资质照片上传" class="data_itm">
|
|
||||||
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList4"
|
<u-upload class="upload" accept="image" width="172rpx" height="172rpx" :fileList="fileList4"
|
||||||
@afterRead="afterRead" @delete="deletePic" name="4" multiple>
|
@afterRead="afterRead" @delete="deletePic" name="4" multiple>
|
||||||
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
<image style="width: 172rpx;height: 172rpx;" src="../../static/improveData/jia.png"></image>
|
||||||
</u-upload>
|
</u-upload>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="data_itm_box">
|
<view class="data_itm_box">
|
||||||
|
<u-form-item prop="userInfo.serverInstrutor" label="*服务内容介绍" ref="item1">
|
||||||
<u-form-item prop="userInfo.serverInstrutor" label="服务内容介绍" ref="item1">
|
|
||||||
<u--textarea v-model="model1.userInfo.serverInstrutor" placeholder="请输入介绍"
|
<u--textarea v-model="model1.userInfo.serverInstrutor" placeholder="请输入介绍"
|
||||||
style="background-color: #F8F8F8;"></u--textarea>
|
style="background-color: #F8F8F8;"></u--textarea>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
<u-form-item ref="item1" @click="showServeTime=true" class="data_itm">
|
<u-form-item ref="item1" @click="showServeTime=true" class="data_itm">
|
||||||
<text class="label_t">服务开始时间</text>
|
<text class="label_t">*服务开始时间</text>
|
||||||
<u--input class="p32" placeholder="请选择服务开始时间" v-model="model1.userInfo.serveTime" readonly
|
<u--input class="p32" placeholder="请选择服务开始时间" v-model="model1.userInfo.serveTime" readonly
|
||||||
inputAlign="right" border="none">
|
inputAlign="right" border="none">
|
||||||
<u-icon slot="suffix" name="calendar"></u-icon>
|
<u-icon slot="suffix" name="calendar"></u-icon>
|
||||||
</u--input>
|
</u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
<u-form-item ref="item1" @click="showServeTimeend=true" class="data_itm">
|
<u-form-item ref="item1" @click="showServeTimeend=true" class="data_itm">
|
||||||
<text class="label_t">服务结束时间</text>
|
<text class="label_t">*服务结束时间</text>
|
||||||
<u--input class="p32" placeholder="请选择服务结束时间" v-model="model1.userInfo.serveTimeend" readonly
|
<u--input class="p32" placeholder="请选择服务结束时间" v-model="model1.userInfo.serveTimeend" readonly
|
||||||
inputAlign="right" border="none">
|
inputAlign="right" border="none">
|
||||||
<u-icon slot="suffix" name="calendar"></u-icon>
|
<u-icon slot="suffix" name="calendar"></u-icon>
|
||||||
</u--input>
|
</u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
||||||
|
|
||||||
<u-form-item prop="userInfo.DutyPeopleName" ref="item1" class="data_itm">
|
<u-form-item prop="userInfo.DutyPeopleName" ref="item1" class="data_itm">
|
||||||
<text class="label_t">负责人姓名</text>
|
<text class="label_t">*负责人姓名</text>
|
||||||
<u--input class="p32" placeholder="请输入负责人姓名" inputAlign="right" clearable
|
<u--input class="p32" placeholder="请输入负责人姓名" inputAlign="right" clearable
|
||||||
v-model="model1.userInfo.DutyPeopleName" border="none"></u--input>
|
v-model="model1.userInfo.DutyPeopleName" border="none"></u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
|
|
@ -300,8 +262,8 @@
|
||||||
v-model="model1.userInfo.ServephoneNum" border="none"></u--input>
|
v-model="model1.userInfo.ServephoneNum" border="none"></u--input>
|
||||||
</u-form-item> -->
|
</u-form-item> -->
|
||||||
<u-form-item prop="userInfo.pasw" ref="item1" class="data_itm">
|
<u-form-item prop="userInfo.pasw" ref="item1" class="data_itm">
|
||||||
<text class="label_t">密码</text>
|
<text class="label_t">*密码</text>
|
||||||
<u--input class="p32" placeholder="请输入密码" inputAlign="right" clearable
|
<u--input class="p32" placeholder="请设置登录密码" inputAlign="right" clearable
|
||||||
v-model="model1.userInfo.pasw" border="none"></u--input>
|
v-model="model1.userInfo.pasw" border="none"></u--input>
|
||||||
</u-form-item>
|
</u-form-item>
|
||||||
</view>
|
</view>
|
||||||
|
|
@ -318,7 +280,7 @@
|
||||||
customStyle="padding: 16px;">
|
customStyle="padding: 16px;">
|
||||||
<u-radio-group @change="selectForm" v-model="radiovalue7" :borderBottom="true" placement="column"
|
<u-radio-group @change="selectForm" v-model="radiovalue7" :borderBottom="true" placement="column"
|
||||||
iconPlacement="right">
|
iconPlacement="right">
|
||||||
<u-radio :customStyle="{marginBottom: '16px' }" v-for="(item, index) in radiolist7" :key="index+100*2"
|
<u-radio :customStyle="{marginBottom: '16px' }" v-for="(item, index) in radiolist7" :key="index"
|
||||||
:label="item.name" labelSize="28rpx" labelColor="#231F1C" :name="item.name" activeColor="#99241B ">
|
:label="item.name" labelSize="28rpx" labelColor="#231F1C" :name="item.name" activeColor="#99241B ">
|
||||||
</u-radio>
|
</u-radio>
|
||||||
<u-button class="custom-style" style="background-color:#99241B ; color: #FFFFFF; margin-top: 32rpx;"
|
<u-button class="custom-style" style="background-color:#99241B ; color: #FFFFFF; margin-top: 32rpx;"
|
||||||
|
|
@ -589,6 +551,7 @@
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
groupChange(n) {
|
groupChange(n) {
|
||||||
|
this.isJioned = n
|
||||||
console.log('groupChange', n);
|
console.log('groupChange', n);
|
||||||
},
|
},
|
||||||
radioChange(n) {
|
radioChange(n) {
|
||||||
|
|
@ -773,22 +736,24 @@
|
||||||
var fl3 = ''
|
var fl3 = ''
|
||||||
}
|
}
|
||||||
// 营业执照
|
// 营业执照
|
||||||
if (this.fileList4) {
|
if (this.fileList4.length > 0) {
|
||||||
var fl4 = JSON.stringify(this.fileList4.map((v, i) => {
|
var fl4 = this.fileList4.map((v, i) => {
|
||||||
return v.url
|
return v.url
|
||||||
// return v.thumb
|
// return v.thumb
|
||||||
}))
|
})
|
||||||
|
fl4 = fl4.join(",")
|
||||||
} else {
|
} else {
|
||||||
var fl4 = '[]'
|
var fl4 = ''
|
||||||
}
|
}
|
||||||
// 实景
|
// 实景
|
||||||
if (this.fileList1) {
|
if (this.fileList1.length > 0) {
|
||||||
var fl1 = JSON.stringify(this.fileList1.map((v, i) => {
|
var fl1 = this.fileList1.map((v, i) => {
|
||||||
return v.url
|
return v.url
|
||||||
// return v.thumb
|
// return v.thumb
|
||||||
}))
|
})
|
||||||
|
fl1 = fl1.join(",")
|
||||||
} else {
|
} else {
|
||||||
var fl1 = '[]'
|
var fl1 = ''
|
||||||
}
|
}
|
||||||
var opsArr = []
|
var opsArr = []
|
||||||
if (this.StandradList[0]) {
|
if (this.StandradList[0]) {
|
||||||
|
|
@ -850,9 +815,17 @@
|
||||||
"fzr": that.DutyPeopleName,
|
"fzr": that.DutyPeopleName,
|
||||||
"wyrc": this.wyrc,
|
"wyrc": this.wyrc,
|
||||||
}
|
}
|
||||||
|
if(this.pageTypeId=='fws'){
|
||||||
|
if (!data.serviceName || !data.fzr || !data.cfPhoto || !data.photo || !data.serviceAddress || !data.info || !data.password || !data.images) {
|
||||||
|
this.upLoadReady = false
|
||||||
|
}else{
|
||||||
|
data.userName = data.serviceName
|
||||||
|
}
|
||||||
|
}else{
|
||||||
if (!data.userName || !data.sex || !data.idCard || !data.images || !data.password || !data.politics) {
|
if (!data.userName || !data.sex || !data.idCard || !data.images || !data.password || !data.politics) {
|
||||||
this.upLoadReady = false
|
this.upLoadReady = false
|
||||||
}
|
}
|
||||||
|
}
|
||||||
if (this.upLoadReady) {
|
if (this.upLoadReady) {
|
||||||
this.http.request('/auth/init', data, "POST").then(res => {
|
this.http.request('/auth/init', data, "POST").then(res => {
|
||||||
if (res.code == 200) {
|
if (res.code == 200) {
|
||||||
|
|
|
||||||
|
|
@ -225,8 +225,20 @@
|
||||||
showH: false,
|
showH: false,
|
||||||
value: '',
|
value: '',
|
||||||
star: 0,
|
star: 0,
|
||||||
|
iswx: 0
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
onReady() {
|
||||||
|
// this.load = false
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
this.iswx = 0
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
// #ifndef MP-WEIXIN
|
||||||
|
//除了小程序
|
||||||
|
this.iswx = 1
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
onLoad() {
|
onLoad() {
|
||||||
this.isAdmin = uni.getStorageSync('isAdmin')
|
this.isAdmin = uni.getStorageSync('isAdmin')
|
||||||
this.userType = uni.getStorageSync('userType')
|
this.userType = uni.getStorageSync('userType')
|
||||||
|
|
@ -392,7 +404,26 @@
|
||||||
},
|
},
|
||||||
scanCode() {
|
scanCode() {
|
||||||
let that = this
|
let that = this
|
||||||
// 调用uni提供的调用相机api
|
if(this.iswx == 0){
|
||||||
|
// 允许从相机和相册扫码
|
||||||
|
uni.scanCode({
|
||||||
|
success: function (res) {
|
||||||
|
that.http.request('/activityUser/sing/' + res.result, {}, "POST").then(res => {
|
||||||
|
if (res.code == 200) {
|
||||||
|
that.pages = 1
|
||||||
|
that.list2 = []
|
||||||
|
that.getData()
|
||||||
|
}
|
||||||
|
}).catch(e => {
|
||||||
|
uni.showToast({
|
||||||
|
title: e.data.message,
|
||||||
|
icon: "none",
|
||||||
|
});
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
else{
|
||||||
uni.chooseImage({
|
uni.chooseImage({
|
||||||
sizeType: ['original'],
|
sizeType: ['original'],
|
||||||
count: 1,
|
count: 1,
|
||||||
|
|
@ -425,6 +456,7 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
}
|
||||||
},
|
},
|
||||||
// 取消报名
|
// 取消报名
|
||||||
qxBm(val0, val1) {
|
qxBm(val0, val1) {
|
||||||
|
|
|
||||||
|
|
@ -35,7 +35,8 @@
|
||||||
</view>
|
</view>
|
||||||
<view class="codeImg">
|
<view class="codeImg">
|
||||||
<view class="codeEle">
|
<view class="codeEle">
|
||||||
<uqrcode :id="'uQRCode'+index" ref="uQRCode0" :size='QRsize' :text='item.text' />
|
<uqrcode ref="uQRCode" canvas-id="uQRCode" :value="item.text" :size="QRsize" :start="true" :auto="true"></uqrcode>
|
||||||
|
<!-- <uqrcode :id="'uQRCode'+index" ref="uQRCode0" :size='QRsize' :text='item.text' /> -->
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,201 @@
|
||||||
|
Apache License
|
||||||
|
Version 2.0, January 2004
|
||||||
|
http://www.apache.org/licenses/
|
||||||
|
|
||||||
|
TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
|
||||||
|
|
||||||
|
1. Definitions.
|
||||||
|
|
||||||
|
"License" shall mean the terms and conditions for use, reproduction,
|
||||||
|
and distribution as defined by Sections 1 through 9 of this document.
|
||||||
|
|
||||||
|
"Licensor" shall mean the copyright owner or entity authorized by
|
||||||
|
the copyright owner that is granting the License.
|
||||||
|
|
||||||
|
"Legal Entity" shall mean the union of the acting entity and all
|
||||||
|
other entities that control, are controlled by, or are under common
|
||||||
|
control with that entity. For the purposes of this definition,
|
||||||
|
"control" means (i) the power, direct or indirect, to cause the
|
||||||
|
direction or management of such entity, whether by contract or
|
||||||
|
otherwise, or (ii) ownership of fifty percent (50%) or more of the
|
||||||
|
outstanding shares, or (iii) beneficial ownership of such entity.
|
||||||
|
|
||||||
|
"You" (or "Your") shall mean an individual or Legal Entity
|
||||||
|
exercising permissions granted by this License.
|
||||||
|
|
||||||
|
"Source" form shall mean the preferred form for making modifications,
|
||||||
|
including but not limited to software source code, documentation
|
||||||
|
source, and configuration files.
|
||||||
|
|
||||||
|
"Object" form shall mean any form resulting from mechanical
|
||||||
|
transformation or translation of a Source form, including but
|
||||||
|
not limited to compiled object code, generated documentation,
|
||||||
|
and conversions to other media types.
|
||||||
|
|
||||||
|
"Work" shall mean the work of authorship, whether in Source or
|
||||||
|
Object form, made available under the License, as indicated by a
|
||||||
|
copyright notice that is included in or attached to the work
|
||||||
|
(an example is provided in the Appendix below).
|
||||||
|
|
||||||
|
"Derivative Works" shall mean any work, whether in Source or Object
|
||||||
|
form, that is based on (or derived from) the Work and for which the
|
||||||
|
editorial revisions, annotations, elaborations, or other modifications
|
||||||
|
represent, as a whole, an original work of authorship. For the purposes
|
||||||
|
of this License, Derivative Works shall not include works that remain
|
||||||
|
separable from, or merely link (or bind by name) to the interfaces of,
|
||||||
|
the Work and Derivative Works thereof.
|
||||||
|
|
||||||
|
"Contribution" shall mean any work of authorship, including
|
||||||
|
the original version of the Work and any modifications or additions
|
||||||
|
to that Work or Derivative Works thereof, that is intentionally
|
||||||
|
submitted to Licensor for inclusion in the Work by the copyright owner
|
||||||
|
or by an individual or Legal Entity authorized to submit on behalf of
|
||||||
|
the copyright owner. For the purposes of this definition, "submitted"
|
||||||
|
means any form of electronic, verbal, or written communication sent
|
||||||
|
to the Licensor or its representatives, including but not limited to
|
||||||
|
communication on electronic mailing lists, source code control systems,
|
||||||
|
and issue tracking systems that are managed by, or on behalf of, the
|
||||||
|
Licensor for the purpose of discussing and improving the Work, but
|
||||||
|
excluding communication that is conspicuously marked or otherwise
|
||||||
|
designated in writing by the copyright owner as "Not a Contribution."
|
||||||
|
|
||||||
|
"Contributor" shall mean Licensor and any individual or Legal Entity
|
||||||
|
on behalf of whom a Contribution has been received by Licensor and
|
||||||
|
subsequently incorporated within the Work.
|
||||||
|
|
||||||
|
2. Grant of Copyright License. Subject to the terms and conditions of
|
||||||
|
this License, each Contributor hereby grants to You a perpetual,
|
||||||
|
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||||
|
copyright license to reproduce, prepare Derivative Works of,
|
||||||
|
publicly display, publicly perform, sublicense, and distribute the
|
||||||
|
Work and such Derivative Works in Source or Object form.
|
||||||
|
|
||||||
|
3. Grant of Patent License. Subject to the terms and conditions of
|
||||||
|
this License, each Contributor hereby grants to You a perpetual,
|
||||||
|
worldwide, non-exclusive, no-charge, royalty-free, irrevocable
|
||||||
|
(except as stated in this section) patent license to make, have made,
|
||||||
|
use, offer to sell, sell, import, and otherwise transfer the Work,
|
||||||
|
where such license applies only to those patent claims licensable
|
||||||
|
by such Contributor that are necessarily infringed by their
|
||||||
|
Contribution(s) alone or by combination of their Contribution(s)
|
||||||
|
with the Work to which such Contribution(s) was submitted. If You
|
||||||
|
institute patent litigation against any entity (including a
|
||||||
|
cross-claim or counterclaim in a lawsuit) alleging that the Work
|
||||||
|
or a Contribution incorporated within the Work constitutes direct
|
||||||
|
or contributory patent infringement, then any patent licenses
|
||||||
|
granted to You under this License for that Work shall terminate
|
||||||
|
as of the date such litigation is filed.
|
||||||
|
|
||||||
|
4. Redistribution. You may reproduce and distribute copies of the
|
||||||
|
Work or Derivative Works thereof in any medium, with or without
|
||||||
|
modifications, and in Source or Object form, provided that You
|
||||||
|
meet the following conditions:
|
||||||
|
|
||||||
|
(a) You must give any other recipients of the Work or
|
||||||
|
Derivative Works a copy of this License; and
|
||||||
|
|
||||||
|
(b) You must cause any modified files to carry prominent notices
|
||||||
|
stating that You changed the files; and
|
||||||
|
|
||||||
|
(c) You must retain, in the Source form of any Derivative Works
|
||||||
|
that You distribute, all copyright, patent, trademark, and
|
||||||
|
attribution notices from the Source form of the Work,
|
||||||
|
excluding those notices that do not pertain to any part of
|
||||||
|
the Derivative Works; and
|
||||||
|
|
||||||
|
(d) If the Work includes a "NOTICE" text file as part of its
|
||||||
|
distribution, then any Derivative Works that You distribute must
|
||||||
|
include a readable copy of the attribution notices contained
|
||||||
|
within such NOTICE file, excluding those notices that do not
|
||||||
|
pertain to any part of the Derivative Works, in at least one
|
||||||
|
of the following places: within a NOTICE text file distributed
|
||||||
|
as part of the Derivative Works; within the Source form or
|
||||||
|
documentation, if provided along with the Derivative Works; or,
|
||||||
|
within a display generated by the Derivative Works, if and
|
||||||
|
wherever such third-party notices normally appear. The contents
|
||||||
|
of the NOTICE file are for informational purposes only and
|
||||||
|
do not modify the License. You may add Your own attribution
|
||||||
|
notices within Derivative Works that You distribute, alongside
|
||||||
|
or as an addendum to the NOTICE text from the Work, provided
|
||||||
|
that such additional attribution notices cannot be construed
|
||||||
|
as modifying the License.
|
||||||
|
|
||||||
|
You may add Your own copyright statement to Your modifications and
|
||||||
|
may provide additional or different license terms and conditions
|
||||||
|
for use, reproduction, or distribution of Your modifications, or
|
||||||
|
for any such Derivative Works as a whole, provided Your use,
|
||||||
|
reproduction, and distribution of the Work otherwise complies with
|
||||||
|
the conditions stated in this License.
|
||||||
|
|
||||||
|
5. Submission of Contributions. Unless You explicitly state otherwise,
|
||||||
|
any Contribution intentionally submitted for inclusion in the Work
|
||||||
|
by You to the Licensor shall be under the terms and conditions of
|
||||||
|
this License, without any additional terms or conditions.
|
||||||
|
Notwithstanding the above, nothing herein shall supersede or modify
|
||||||
|
the terms of any separate license agreement you may have executed
|
||||||
|
with Licensor regarding such Contributions.
|
||||||
|
|
||||||
|
6. Trademarks. This License does not grant permission to use the trade
|
||||||
|
names, trademarks, service marks, or product names of the Licensor,
|
||||||
|
except as required for reasonable and customary use in describing the
|
||||||
|
origin of the Work and reproducing the content of the NOTICE file.
|
||||||
|
|
||||||
|
7. Disclaimer of Warranty. Unless required by applicable law or
|
||||||
|
agreed to in writing, Licensor provides the Work (and each
|
||||||
|
Contributor provides its Contributions) on an "AS IS" BASIS,
|
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
|
||||||
|
implied, including, without limitation, any warranties or conditions
|
||||||
|
of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
|
||||||
|
PARTICULAR PURPOSE. You are solely responsible for determining the
|
||||||
|
appropriateness of using or redistributing the Work and assume any
|
||||||
|
risks associated with Your exercise of permissions under this License.
|
||||||
|
|
||||||
|
8. Limitation of Liability. In no event and under no legal theory,
|
||||||
|
whether in tort (including negligence), contract, or otherwise,
|
||||||
|
unless required by applicable law (such as deliberate and grossly
|
||||||
|
negligent acts) or agreed to in writing, shall any Contributor be
|
||||||
|
liable to You for damages, including any direct, indirect, special,
|
||||||
|
incidental, or consequential damages of any character arising as a
|
||||||
|
result of this License or out of the use or inability to use the
|
||||||
|
Work (including but not limited to damages for loss of goodwill,
|
||||||
|
work stoppage, computer failure or malfunction, or any and all
|
||||||
|
other commercial damages or losses), even if such Contributor
|
||||||
|
has been advised of the possibility of such damages.
|
||||||
|
|
||||||
|
9. Accepting Warranty or Additional Liability. While redistributing
|
||||||
|
the Work or Derivative Works thereof, You may choose to offer,
|
||||||
|
and charge a fee for, acceptance of support, warranty, indemnity,
|
||||||
|
or other liability obligations and/or rights consistent with this
|
||||||
|
License. However, in accepting such obligations, You may act only
|
||||||
|
on Your own behalf and on Your sole responsibility, not on behalf
|
||||||
|
of any other Contributor, and only if You agree to indemnify,
|
||||||
|
defend, and hold each Contributor harmless for any liability
|
||||||
|
incurred by, or claims asserted against, such Contributor by reason
|
||||||
|
of your accepting any such warranty or additional liability.
|
||||||
|
|
||||||
|
END OF TERMS AND CONDITIONS
|
||||||
|
|
||||||
|
APPENDIX: How to apply the Apache License to your work.
|
||||||
|
|
||||||
|
To apply the Apache License to your work, attach the following
|
||||||
|
boilerplate notice, with the fields enclosed by brackets "[]"
|
||||||
|
replaced with your own identifying information. (Don't include
|
||||||
|
the brackets!) The text should be enclosed in the appropriate
|
||||||
|
comment syntax for the file format. We also recommend that a
|
||||||
|
file or class name and description of purpose be included on the
|
||||||
|
same "printed page" as the copyright notice for easier
|
||||||
|
identification within third-party archives.
|
||||||
|
|
||||||
|
Copyright [yyyy] [name of copyright owner]
|
||||||
|
|
||||||
|
Licensed under the Apache License, Version 2.0 (the "License");
|
||||||
|
you may not use this file except in compliance with the License.
|
||||||
|
You may obtain a copy of the License at
|
||||||
|
|
||||||
|
http://www.apache.org/licenses/LICENSE-2.0
|
||||||
|
|
||||||
|
Unless required by applicable law or agreed to in writing, software
|
||||||
|
distributed under the License is distributed on an "AS IS" BASIS,
|
||||||
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||||
|
See the License for the specific language governing permissions and
|
||||||
|
limitations under the License.
|
||||||
|
|
@ -1,18 +1,12 @@
|
||||||
## 3.0.1（2022-01-05）
|
## 4.0.6（2022-12-12）
|
||||||
3.0.1 gcanvas引用目录调整。
|
修复`getDrawModules`，第一次获取结果正常，后续获取`tile`模块不存在的问题；
|
||||||
## 3.0.0（2022-01-04）
|
修复安卓type:normal因Canvas API使用了小数或为0的参数导致生成异常的问题（注：安卓非2d Canvas部分API参数不支持携带小数，部分API参数必须大于0）。
|
||||||
3.0.0 uQRCode 3.0 全新版本来袭。
|
## 4.0.1（2022-11-28）
|
||||||
## 2.0.4（2021-11-19）
|
优化组件loading属性的表现；
|
||||||
2.0.4 新增绘制模式；新增绘制延时、canvas导入文件延时属性。
|
新增组件type选项normal，以便于在某些条件编译初始为type=2d时还可以选择使用非2d组件类型；
|
||||||
## 2.0.3（2021-10-18）
|
修复组件条件编译在其他编辑器语法提示报错；
|
||||||
2.0.3 修复在部分安卓设备生成异常；移除延迟绘制；新增批量生成示例。
|
修复原生对es5的支持。
|
||||||
## 2.0.23（2021-08-09）
|
## 4.0.0（2022-11-21）
|
||||||
|
v4版本源代码全面开放，开源地址：[https://github.com/Sansnn/uQRCode](https://github.com/Sansnn/uQRCode)；
|
||||||
|
|
||||||
## 2.0.22（2021-08-09）
|
升级说明：v4为大版本更新，虽然已尽可能兼容上一代版本，但不可避免的还是存在一些细节差异，若更新后出现问题，请参考对照[v3 文档](https://uqrcode.cn/doc/v3)，[v4 文档](https://uqrcode.cn/doc)进行修改。
|
||||||
|
|
||||||
## 2.0.21（2021-07-28）
|
|
||||||
|
|
||||||
## 2.0.2（2021-07-28）
|
|
||||||
2.0.2 新增延迟绘制。
|
|
||||||
## 2.0.1（2021-07-26）
|
|
||||||
2.0.1 调整为uni_modules目录规范。
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1 @@
|
||||||
|
export const cacheImageList = [];
|
||||||
|
|
@ -0,0 +1,41 @@
|
||||||
|
function Queue() {
|
||||||
|
let waitingQueue = this.waitingQueue = [];
|
||||||
|
let isRunning = this.isRunning = false; // 记录是否有未完成的任务
|
||||||
|
|
||||||
|
function execute(task, resolve, reject) {
|
||||||
|
task()
|
||||||
|
.then((data) => {
|
||||||
|
resolve(data);
|
||||||
|
})
|
||||||
|
.catch((e) => {
|
||||||
|
reject(e);
|
||||||
|
})
|
||||||
|
.finally(() => {
|
||||||
|
// 等待任务队列中如果有任务，则触发它；否则设置isRunning = false,表示无任务状态
|
||||||
|
if (waitingQueue.length) {
|
||||||
|
const next = waitingQueue.shift();
|
||||||
|
execute(next.task, next.resolve, next.reject);
|
||||||
|
} else {
|
||||||
|
isRunning = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.exec = function(task) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
if (isRunning) {
|
||||||
|
waitingQueue.push({
|
||||||
|
task,
|
||||||
|
resolve,
|
||||||
|
reject
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
isRunning = true;
|
||||||
|
execute(task, resolve, reject);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 队列实例，某些平台一起使用多个组件时需要通过队列逐一绘制，否则部分绘制方法异常，nvue端的iOS gcanvas尤其明显，在不通过队列绘制时会出现图片丢失的情况 */
|
||||||
|
export const queueDraw = new Queue();
|
||||||
|
export const queueLoadImage = new Queue();
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
declare module '*/common/cache' {
|
||||||
|
export const cacheImageList: Array;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
declare module '*/common/queue' {
|
||||||
|
export const queueDraw: any;
|
||||||
|
export const queueLoadImage: any;
|
||||||
|
}
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,241 @@
|
||||||
|
const isWeex = typeof WXEnvironment !== 'undefined';
|
||||||
|
const isWeexIOS = isWeex && /ios/i.test(WXEnvironment.platform);
|
||||||
|
const isWeexAndroid = isWeex && !isWeexIOS;
|
||||||
|
|
||||||
|
import GLmethod from '../context-webgl/GLmethod';
|
||||||
|
|
||||||
|
const GCanvasModule =
|
||||||
|
(typeof weex !== 'undefined' && weex.requireModule) ? (weex.requireModule('gcanvas')) :
|
||||||
|
(typeof __weex_require__ !== 'undefined') ? (__weex_require__('@weex-module/gcanvas')) : {};
|
||||||
|
|
||||||
|
let isDebugging = false;
|
||||||
|
|
||||||
|
let isComboDisabled = false;
|
||||||
|
|
||||||
|
const logCommand = (function () {
|
||||||
|
const methodQuery = [];
|
||||||
|
Object.keys(GLmethod).forEach(key => {
|
||||||
|
methodQuery[GLmethod[key]] = key;
|
||||||
|
})
|
||||||
|
const queryMethod = (id) => {
|
||||||
|
return methodQuery[parseInt(id)] || 'NotFoundMethod';
|
||||||
|
}
|
||||||
|
const logCommand = (id, cmds) => {
|
||||||
|
const mId = cmds.split(',')[0];
|
||||||
|
const mName = queryMethod(mId);
|
||||||
|
console.log(`=== callNative - componentId:${id}; method: ${mName}; cmds: ${cmds}`);
|
||||||
|
}
|
||||||
|
return logCommand;
|
||||||
|
})();
|
||||||
|
|
||||||
|
function joinArray(arr, sep) {
|
||||||
|
let res = '';
|
||||||
|
for (let i = 0; i < arr.length; i++) {
|
||||||
|
if (i !== 0) {
|
||||||
|
res += sep;
|
||||||
|
}
|
||||||
|
res += arr[i];
|
||||||
|
}
|
||||||
|
return res;
|
||||||
|
}
|
||||||
|
|
||||||
|
const commandsCache = {}
|
||||||
|
|
||||||
|
const GBridge = {
|
||||||
|
|
||||||
|
callEnable: (ref, configArray) => {
|
||||||
|
|
||||||
|
commandsCache[ref] = [];
|
||||||
|
|
||||||
|
return GCanvasModule.enable({
|
||||||
|
componentId: ref,
|
||||||
|
config: configArray
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
callEnableDebug: () => {
|
||||||
|
isDebugging = true;
|
||||||
|
},
|
||||||
|
|
||||||
|
callEnableDisableCombo: () => {
|
||||||
|
isComboDisabled = true;
|
||||||
|
},
|
||||||
|
|
||||||
|
callSetContextType: function (componentId, context_type) {
|
||||||
|
GCanvasModule.setContextType(context_type, componentId);
|
||||||
|
},
|
||||||
|
|
||||||
|
callReset: function(id){
|
||||||
|
GCanvasModule.resetComponent && canvasModule.resetComponent(componentId);
|
||||||
|
},
|
||||||
|
|
||||||
|
render: isWeexIOS ? function (componentId) {
|
||||||
|
return GCanvasModule.extendCallNative({
|
||||||
|
contextId: componentId,
|
||||||
|
type: 0x60000001
|
||||||
|
});
|
||||||
|
} : function (componentId) {
|
||||||
|
return callGCanvasLinkNative(componentId, 0x60000001, 'render');
|
||||||
|
},
|
||||||
|
|
||||||
|
render2d: isWeexIOS ? function (componentId, commands, callback) {
|
||||||
|
|
||||||
|
if (isDebugging) {
|
||||||
|
console.log('>>> >>> render2d ===');
|
||||||
|
console.log('>>> commands: ' + commands);
|
||||||
|
}
|
||||||
|
|
||||||
|
GCanvasModule.render([commands, callback?true:false], componentId, callback);
|
||||||
|
|
||||||
|
} : function (componentId, commands,callback) {
|
||||||
|
|
||||||
|
if (isDebugging) {
|
||||||
|
console.log('>>> >>> render2d ===');
|
||||||
|
console.log('>>> commands: ' + commands);
|
||||||
|
}
|
||||||
|
|
||||||
|
callGCanvasLinkNative(componentId, 0x20000001, commands);
|
||||||
|
if(callback){
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
callExtendCallNative: isWeexIOS ? function (componentId, cmdArgs) {
|
||||||
|
|
||||||
|
throw 'should not be here anymore ' + cmdArgs;
|
||||||
|
|
||||||
|
} : function (componentId, cmdArgs) {
|
||||||
|
|
||||||
|
throw 'should not be here anymore ' + cmdArgs;
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
flushNative: isWeexIOS ? function (componentId) {
|
||||||
|
|
||||||
|
const cmdArgs = joinArray(commandsCache[componentId], ';');
|
||||||
|
commandsCache[componentId] = [];
|
||||||
|
|
||||||
|
if (isDebugging) {
|
||||||
|
console.log('>>> >>> flush native ===');
|
||||||
|
console.log('>>> commands: ' + cmdArgs);
|
||||||
|
}
|
||||||
|
|
||||||
|
const result = GCanvasModule.extendCallNative({
|
||||||
|
"contextId": componentId,
|
||||||
|
"type": 0x60000000,
|
||||||
|
"args": cmdArgs
|
||||||
|
});
|
||||||
|
|
||||||
|
const res = result && result.result;
|
||||||
|
|
||||||
|
if (isDebugging) {
|
||||||
|
console.log('>>> result: ' + res);
|
||||||
|
}
|
||||||
|
|
||||||
|
return res;
|
||||||
|
|
||||||
|
} : function (componentId) {
|
||||||
|
|
||||||
|
const cmdArgs = joinArray(commandsCache[componentId], ';');
|
||||||
|
commandsCache[componentId] = [];
|
||||||
|
|
||||||
|
if (isDebugging) {
|
||||||
|
console.log('>>> >>> flush native ===');
|
||||||
|
console.log('>>> commands: ' + cmdArgs);
|
||||||
|
}
|
||||||
|
|
||||||
|
const result = callGCanvasLinkNative(componentId, 0x60000000, cmdArgs);
|
||||||
|
|
||||||
|
if (isDebugging) {
|
||||||
|
console.log('>>> result: ' + result);
|
||||||
|
}
|
||||||
|
|
||||||
|
return result;
|
||||||
|
},
|
||||||
|
|
||||||
|
callNative: function (componentId, cmdArgs, cache) {
|
||||||
|
|
||||||
|
if (isDebugging) {
|
||||||
|
logCommand(componentId, cmdArgs);
|
||||||
|
}
|
||||||
|
|
||||||
|
commandsCache[componentId].push(cmdArgs);
|
||||||
|
|
||||||
|
if (!cache || isComboDisabled) {
|
||||||
|
return GBridge.flushNative(componentId);
|
||||||
|
} else {
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
texImage2D(componentId, ...args) {
|
||||||
|
if (isWeexIOS) {
|
||||||
|
if (args.length === 6) {
|
||||||
|
const [target, level, internalformat, format, type, image] = args;
|
||||||
|
GBridge.callNative(
|
||||||
|
componentId,
|
||||||
|
GLmethod.texImage2D + ',' + 6 + ',' + target + ',' + level + ',' + internalformat + ',' + format + ',' + type + ',' + image.src
|
||||||
|
)
|
||||||
|
} else if (args.length === 9) {
|
||||||
|
const [target, level, internalformat, width, height, border, format, type, image] = args;
|
||||||
|
GBridge.callNative(
|
||||||
|
componentId,
|
||||||
|
GLmethod.texImage2D + ',' + 9 + ',' + target + ',' + level + ',' + internalformat + ',' + width + ',' + height + ',' + border + ',' +
|
||||||
|
+ format + ',' + type + ',' + (image ? image.src : 0)
|
||||||
|
)
|
||||||
|
}
|
||||||
|
} else if (isWeexAndroid) {
|
||||||
|
if (args.length === 6) {
|
||||||
|
const [target, level, internalformat, format, type, image] = args;
|
||||||
|
GCanvasModule.texImage2D(componentId, target, level, internalformat, format, type, image.src);
|
||||||
|
} else if (args.length === 9) {
|
||||||
|
const [target, level, internalformat, width, height, border, format, type, image] = args;
|
||||||
|
GCanvasModule.texImage2D(componentId, target, level, internalformat, width, height, border, format, type, (image ? image.src : 0));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
texSubImage2D(componentId, target, level, xoffset, yoffset, format, type, image) {
|
||||||
|
if (isWeexIOS) {
|
||||||
|
if (arguments.length === 8) {
|
||||||
|
GBridge.callNative(
|
||||||
|
componentId,
|
||||||
|
GLmethod.texSubImage2D + ',' + 6 + ',' + target + ',' + level + ',' + xoffset + ',' + yoffset, + ',' + format + ',' + type + ',' + image.src
|
||||||
|
)
|
||||||
|
}
|
||||||
|
} else if (isWeexAndroid) {
|
||||||
|
GCanvasModule.texSubImage2D(componentId, target, level, xoffset, yoffset, format, type, image.src);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
bindImageTexture(componentId, src, imageId) {
|
||||||
|
GCanvasModule.bindImageTexture([src, imageId], componentId);
|
||||||
|
},
|
||||||
|
|
||||||
|
perloadImage([url, id], callback) {
|
||||||
|
GCanvasModule.preLoadImage([url, id], function (image) {
|
||||||
|
image.url = url;
|
||||||
|
image.id = id;
|
||||||
|
callback(image);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
measureText(text, fontStyle, componentId) {
|
||||||
|
return GCanvasModule.measureText([text, fontStyle], componentId);
|
||||||
|
},
|
||||||
|
|
||||||
|
getImageData (componentId, x, y, w, h, callback) {
|
||||||
|
GCanvasModule.getImageData([x, y,w,h],componentId,callback);
|
||||||
|
},
|
||||||
|
|
||||||
|
putImageData (componentId, data, x, y, w, h, callback) {
|
||||||
|
GCanvasModule.putImageData([x, y,w,h,data],componentId,callback);
|
||||||
|
},
|
||||||
|
|
||||||
|
toTempFilePath(componentId, x, y, width, height, destWidth, destHeight, fileType, quality, callback){
|
||||||
|
GCanvasModule.toTempFilePath([x, y, width,height, destWidth, destHeight, fileType, quality], componentId, callback);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default GBridge;
|
||||||
|
|
@ -0,0 +1,18 @@
|
||||||
|
class FillStyleLinearGradient {
|
||||||
|
|
||||||
|
constructor(x0, y0, x1, y1) {
|
||||||
|
this._start_pos = { _x: x0, _y: y0 };
|
||||||
|
this._end_pos = { _x: x1, _y: y1 };
|
||||||
|
this._stop_count = 0;
|
||||||
|
this._stops = [0, 0, 0, 0, 0];
|
||||||
|
}
|
||||||
|
|
||||||
|
addColorStop = function (pos, color) {
|
||||||
|
if (this._stop_count < 5 && 0.0 <= pos && pos <= 1.0) {
|
||||||
|
this._stops[this._stop_count] = { _pos: pos, _color: color };
|
||||||
|
this._stop_count++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default FillStyleLinearGradient;
|
||||||
|
|
@ -0,0 +1,8 @@
|
||||||
|
class FillStylePattern {
|
||||||
|
constructor(img, pattern) {
|
||||||
|
this._style = pattern;
|
||||||
|
this._img = img;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default FillStylePattern;
|
||||||
|
|
@ -0,0 +1,17 @@
|
||||||
|
class FillStyleRadialGradient {
|
||||||
|
constructor(x0, y0, r0, x1, y1, r1) {
|
||||||
|
this._start_pos = { _x: x0, _y: y0, _r: r0 };
|
||||||
|
this._end_pos = { _x: x1, _y: y1, _r: r1 };
|
||||||
|
this._stop_count = 0;
|
||||||
|
this._stops = [0, 0, 0, 0, 0];
|
||||||
|
}
|
||||||
|
|
||||||
|
addColorStop(pos, color) {
|
||||||
|
if (this._stop_count < 5 && 0.0 <= pos && pos <= 1.0) {
|
||||||
|
this._stops[this._stop_count] = { _pos: pos, _color: color };
|
||||||
|
this._stop_count++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default FillStyleRadialGradient;
|
||||||
|
|
@ -0,0 +1,666 @@
|
||||||
|
import FillStylePattern from './FillStylePattern';
|
||||||
|
import FillStyleLinearGradient from './FillStyleLinearGradient';
|
||||||
|
import FillStyleRadialGradient from './FillStyleRadialGradient';
|
||||||
|
import GImage from '../env/image.js';
|
||||||
|
import {
|
||||||
|
ArrayBufferToBase64,
|
||||||
|
Base64ToUint8ClampedArray
|
||||||
|
} from '../env/tool.js';
|
||||||
|
|
||||||
|
export default class CanvasRenderingContext2D {
|
||||||
|
|
||||||
|
_drawCommands = '';
|
||||||
|
|
||||||
|
_globalAlpha = 1.0;
|
||||||
|
|
||||||
|
_fillStyle = 'rgb(0,0,0)';
|
||||||
|
_strokeStyle = 'rgb(0,0,0)';
|
||||||
|
|
||||||
|
_lineWidth = 1;
|
||||||
|
_lineCap = 'butt';
|
||||||
|
_lineJoin = 'miter';
|
||||||
|
|
||||||
|
_miterLimit = 10;
|
||||||
|
|
||||||
|
_globalCompositeOperation = 'source-over';
|
||||||
|
|
||||||
|
_textAlign = 'start';
|
||||||
|
_textBaseline = 'alphabetic';
|
||||||
|
|
||||||
|
_font = '10px sans-serif';
|
||||||
|
|
||||||
|
_savedGlobalAlpha = [];
|
||||||
|
|
||||||
|
timer = null;
|
||||||
|
componentId = null;
|
||||||
|
|
||||||
|
_notCommitDrawImageCache = [];
|
||||||
|
_needRedrawImageCache = [];
|
||||||
|
_redrawCommands = '';
|
||||||
|
_autoSaveContext = true;
|
||||||
|
// _imageMap = new GHashMap();
|
||||||
|
// _textureMap = new GHashMap();
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this.className = 'CanvasRenderingContext2D';
|
||||||
|
//this.save()
|
||||||
|
}
|
||||||
|
|
||||||
|
setFillStyle(value) {
|
||||||
|
this.fillStyle = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set fillStyle(value) {
|
||||||
|
this._fillStyle = value;
|
||||||
|
|
||||||
|
if (typeof(value) == 'string') {
|
||||||
|
this._drawCommands = this._drawCommands.concat("F" + value + ";");
|
||||||
|
} else if (value instanceof FillStylePattern) {
|
||||||
|
const image = value._img;
|
||||||
|
if (!image.complete) {
|
||||||
|
image.onload = () => {
|
||||||
|
var index = this._needRedrawImageCache.indexOf(image);
|
||||||
|
if (index > -1) {
|
||||||
|
this._needRedrawImageCache.splice(index, 1);
|
||||||
|
CanvasRenderingContext2D.GBridge.bindImageTexture(this.componentId, image.src, image._id);
|
||||||
|
this._redrawflush(true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this._notCommitDrawImageCache.push(image);
|
||||||
|
} else {
|
||||||
|
CanvasRenderingContext2D.GBridge.bindImageTexture(this.componentId, image.src, image._id);
|
||||||
|
}
|
||||||
|
|
||||||
|
//CanvasRenderingContext2D.GBridge.bindImageTexture(this.componentId, image.src, image._id);
|
||||||
|
this._drawCommands = this._drawCommands.concat("G" + image._id + "," + value._style + ";");
|
||||||
|
} else if (value instanceof FillStyleLinearGradient) {
|
||||||
|
var command = "D" + value._start_pos._x.toFixed(2) + "," + value._start_pos._y.toFixed(2) + "," +
|
||||||
|
value._end_pos._x.toFixed(2) + "," + value._end_pos._y.toFixed(2) + "," +
|
||||||
|
value._stop_count;
|
||||||
|
for (var i = 0; i < value._stop_count; ++i) {
|
||||||
|
command += ("," + value._stops[i]._pos + "," + value._stops[i]._color);
|
||||||
|
}
|
||||||
|
this._drawCommands = this._drawCommands.concat(command + ";");
|
||||||
|
} else if (value instanceof FillStyleRadialGradient) {
|
||||||
|
var command = "H" + value._start_pos._x.toFixed(2) + "," + value._start_pos._y.toFixed(2) + "," + value._start_pos._r
|
||||||
|
.toFixed(2) + "," +
|
||||||
|
value._end_pos._x.toFixed(2) + "," + value._end_pos._y.toFixed(2) + "," + value._end_pos._r.toFixed(2) + "," +
|
||||||
|
value._stop_count;
|
||||||
|
for (var i = 0; i < value._stop_count; ++i) {
|
||||||
|
command += ("," + value._stops[i]._pos + "," + value._stops[i]._color);
|
||||||
|
}
|
||||||
|
this._drawCommands = this._drawCommands.concat(command + ";");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
get fillStyle() {
|
||||||
|
return this._fillStyle;
|
||||||
|
}
|
||||||
|
|
||||||
|
get globalAlpha() {
|
||||||
|
return this._globalAlpha;
|
||||||
|
}
|
||||||
|
|
||||||
|
setGlobalAlpha(value) {
|
||||||
|
this.globalAlpha = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set globalAlpha(value) {
|
||||||
|
this._globalAlpha = value;
|
||||||
|
this._drawCommands = this._drawCommands.concat("a" + value.toFixed(2) + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
get strokeStyle() {
|
||||||
|
return this._strokeStyle;
|
||||||
|
}
|
||||||
|
|
||||||
|
setStrokeStyle(value) {
|
||||||
|
this.strokeStyle = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set strokeStyle(value) {
|
||||||
|
|
||||||
|
this._strokeStyle = value;
|
||||||
|
|
||||||
|
if (typeof(value) == 'string') {
|
||||||
|
this._drawCommands = this._drawCommands.concat("S" + value + ";");
|
||||||
|
} else if (value instanceof FillStylePattern) {
|
||||||
|
CanvasRenderingContext2D.GBridge.bindImageTexture(this.componentId, image.src, image._id);
|
||||||
|
this._drawCommands = this._drawCommands.concat("G" + image._id + "," + value._style + ";");
|
||||||
|
} else if (value instanceof FillStyleLinearGradient) {
|
||||||
|
var command = "D" + value._start_pos._x.toFixed(2) + "," + value._start_pos._y.toFixed(2) + "," +
|
||||||
|
value._end_pos._x.toFixed(2) + "," + value._end_pos._y.toFixed(2) + "," +
|
||||||
|
value._stop_count;
|
||||||
|
|
||||||
|
for (var i = 0; i < value._stop_count; ++i) {
|
||||||
|
command += ("," + value._stops[i]._pos + "," + value._stops[i]._color);
|
||||||
|
}
|
||||||
|
this._drawCommands = this._drawCommands.concat(command + ";");
|
||||||
|
} else if (value instanceof FillStyleRadialGradient) {
|
||||||
|
var command = "H" + value._start_pos._x.toFixed(2) + "," + value._start_pos._y.toFixed(2) + "," + value._start_pos._r
|
||||||
|
.toFixed(2) + "," +
|
||||||
|
value._end_pos._x.toFixed(2) + "," + value._end_pos._y + ",".toFixed(2) + value._end_pos._r.toFixed(2) + "," +
|
||||||
|
value._stop_count;
|
||||||
|
|
||||||
|
for (var i = 0; i < value._stop_count; ++i) {
|
||||||
|
command += ("," + value._stops[i]._pos + "," + value._stops[i]._color);
|
||||||
|
}
|
||||||
|
this._drawCommands = this._drawCommands.concat(command + ";");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
get lineWidth() {
|
||||||
|
return this._lineWidth;
|
||||||
|
}
|
||||||
|
|
||||||
|
setLineWidth(value) {
|
||||||
|
this.lineWidth = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set lineWidth(value) {
|
||||||
|
this._lineWidth = value;
|
||||||
|
this._drawCommands = this._drawCommands.concat("W" + value + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
get lineCap() {
|
||||||
|
return this._lineCap;
|
||||||
|
}
|
||||||
|
|
||||||
|
setLineCap(value) {
|
||||||
|
this.lineCap = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
set lineCap(value) {
|
||||||
|
this._lineCap = value;
|
||||||
|
this._drawCommands = this._drawCommands.concat("C" + value + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
get lineJoin() {
|
||||||
|
return this._lineJoin;
|
||||||
|
}
|
||||||
|
|
||||||
|
setLineJoin(value) {
|
||||||
|
this.lineJoin = value
|
||||||
|
}
|
||||||
|
|
||||||
|
set lineJoin(value) {
|
||||||
|
this._lineJoin = value;
|
||||||
|
this._drawCommands = this._drawCommands.concat("J" + value + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
get miterLimit() {
|
||||||
|
return this._miterLimit;
|
||||||
|
}
|
||||||
|
|
||||||
|
setMiterLimit(value) {
|
||||||
|
this.miterLimit = value
|
||||||
|
}
|
||||||
|
|
||||||
|
set miterLimit(value) {
|
||||||
|
this._miterLimit = value;
|
||||||
|
this._drawCommands = this._drawCommands.concat("M" + value + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
get globalCompositeOperation() {
|
||||||
|
return this._globalCompositeOperation;
|
||||||
|
}
|
||||||
|
|
||||||
|
set globalCompositeOperation(value) {
|
||||||
|
|
||||||
|
this._globalCompositeOperation = value;
|
||||||
|
let mode = 0;
|
||||||
|
switch (value) {
|
||||||
|
case "source-over":
|
||||||
|
mode = 0;
|
||||||
|
break;
|
||||||
|
case "source-atop":
|
||||||
|
mode = 5;
|
||||||
|
break;
|
||||||
|
case "source-in":
|
||||||
|
mode = 0;
|
||||||
|
break;
|
||||||
|
case "source-out":
|
||||||
|
mode = 2;
|
||||||
|
break;
|
||||||
|
case "destination-over":
|
||||||
|
mode = 4;
|
||||||
|
break;
|
||||||
|
case "destination-atop":
|
||||||
|
mode = 4;
|
||||||
|
break;
|
||||||
|
case "destination-in":
|
||||||
|
mode = 4;
|
||||||
|
break;
|
||||||
|
case "destination-out":
|
||||||
|
mode = 3;
|
||||||
|
break;
|
||||||
|
case "lighter":
|
||||||
|
mode = 1;
|
||||||
|
break;
|
||||||
|
case "copy":
|
||||||
|
mode = 2;
|
||||||
|
break;
|
||||||
|
case "xor":
|
||||||
|
mode = 6;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
mode = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
this._drawCommands = this._drawCommands.concat("B" + mode + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
get textAlign() {
|
||||||
|
return this._textAlign;
|
||||||
|
}
|
||||||
|
|
||||||
|
setTextAlign(value) {
|
||||||
|
this.textAlign = value
|
||||||
|
}
|
||||||
|
|
||||||
|
set textAlign(value) {
|
||||||
|
|
||||||
|
this._textAlign = value;
|
||||||
|
let Align = 0;
|
||||||
|
switch (value) {
|
||||||
|
case "start":
|
||||||
|
Align = 0;
|
||||||
|
break;
|
||||||
|
case "end":
|
||||||
|
Align = 1;
|
||||||
|
break;
|
||||||
|
case "left":
|
||||||
|
Align = 2;
|
||||||
|
break;
|
||||||
|
case "center":
|
||||||
|
Align = 3;
|
||||||
|
break;
|
||||||
|
case "right":
|
||||||
|
Align = 4;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
Align = 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
this._drawCommands = this._drawCommands.concat("A" + Align + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
get textBaseline() {
|
||||||
|
return this._textBaseline;
|
||||||
|
}
|
||||||
|
|
||||||
|
setTextBaseline(value) {
|
||||||
|
this.textBaseline = value
|
||||||
|
}
|
||||||
|
|
||||||
|
set textBaseline(value) {
|
||||||
|
this._textBaseline = value;
|
||||||
|
let baseline = 0;
|
||||||
|
switch (value) {
|
||||||
|
case "alphabetic":
|
||||||
|
baseline = 0;
|
||||||
|
break;
|
||||||
|
case "middle":
|
||||||
|
baseline = 1;
|
||||||
|
break;
|
||||||
|
case "top":
|
||||||
|
baseline = 2;
|
||||||
|
break;
|
||||||
|
case "hanging":
|
||||||
|
baseline = 3;
|
||||||
|
break;
|
||||||
|
case "bottom":
|
||||||
|
baseline = 4;
|
||||||
|
break;
|
||||||
|
case "ideographic":
|
||||||
|
baseline = 5;
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
baseline = 0;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
this._drawCommands = this._drawCommands.concat("E" + baseline + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
get font() {
|
||||||
|
return this._font;
|
||||||
|
}
|
||||||
|
|
||||||
|
setFontSize(size) {
|
||||||
|
var str = this._font;
|
||||||
|
var strs = str.trim().split(/\s+/);
|
||||||
|
for (var i = 0; i < strs.length; i++) {
|
||||||
|
var values = ["normal", "italic", "oblique", "normal", "small-caps", "normal", "bold",
|
||||||
|
"bolder", "lighter", "100", "200", "300", "400", "500", "600", "700", "800", "900",
|
||||||
|
"normal", "ultra-condensed", "extra-condensed", "condensed", "semi-condensed",
|
||||||
|
"semi-expanded", "expanded", "extra-expanded", "ultra-expanded"
|
||||||
|
];
|
||||||
|
|
||||||
|
if (-1 == values.indexOf(strs[i].trim())) {
|
||||||
|
if (typeof size === 'string') {
|
||||||
|
strs[i] = size;
|
||||||
|
} else if (typeof size === 'number') {
|
||||||
|
strs[i] = String(size) + 'px';
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.font = strs.join(" ");
|
||||||
|
}
|
||||||
|
|
||||||
|
set font(value) {
|
||||||
|
this._font = value;
|
||||||
|
this._drawCommands = this._drawCommands.concat("j" + value + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
setTransform(a, b, c, d, tx, ty) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("t" +
|
||||||
|
(a === 1 ? "1" : a.toFixed(2)) + "," +
|
||||||
|
(b === 0 ? "0" : b.toFixed(2)) + "," +
|
||||||
|
(c === 0 ? "0" : c.toFixed(2)) + "," +
|
||||||
|
(d === 1 ? "1" : d.toFixed(2)) + "," + tx.toFixed(2) + "," + ty.toFixed(2) + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
transform(a, b, c, d, tx, ty) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("f" +
|
||||||
|
(a === 1 ? "1" : a.toFixed(2)) + "," +
|
||||||
|
(b === 0 ? "0" : b.toFixed(2)) + "," +
|
||||||
|
(c === 0 ? "0" : c.toFixed(2)) + "," +
|
||||||
|
(d === 1 ? "1" : d.toFixed(2)) + "," + tx + "," + ty + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
resetTransform() {
|
||||||
|
this._drawCommands = this._drawCommands.concat("m;");
|
||||||
|
}
|
||||||
|
|
||||||
|
scale(a, d) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("k" + a.toFixed(2) + "," +
|
||||||
|
d.toFixed(2) + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
rotate(angle) {
|
||||||
|
this._drawCommands = this._drawCommands
|
||||||
|
.concat("r" + angle.toFixed(6) + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
translate(tx, ty) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("l" + tx.toFixed(2) + "," + ty.toFixed(2) + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
save() {
|
||||||
|
this._savedGlobalAlpha.push(this._globalAlpha);
|
||||||
|
this._drawCommands = this._drawCommands.concat("v;");
|
||||||
|
}
|
||||||
|
|
||||||
|
restore() {
|
||||||
|
this._drawCommands = this._drawCommands.concat("e;");
|
||||||
|
this._globalAlpha = this._savedGlobalAlpha.pop();
|
||||||
|
}
|
||||||
|
|
||||||
|
createPattern(img, pattern) {
|
||||||
|
if (typeof img === 'string') {
|
||||||
|
var imgObj = new GImage();
|
||||||
|
imgObj.src = img;
|
||||||
|
img = imgObj;
|
||||||
|
}
|
||||||
|
return new FillStylePattern(img, pattern);
|
||||||
|
}
|
||||||
|
|
||||||
|
createLinearGradient(x0, y0, x1, y1) {
|
||||||
|
return new FillStyleLinearGradient(x0, y0, x1, y1);
|
||||||
|
}
|
||||||
|
|
||||||
|
createRadialGradient = function(x0, y0, r0, x1, y1, r1) {
|
||||||
|
return new FillStyleRadialGradient(x0, y0, r0, x1, y1, r1);
|
||||||
|
};
|
||||||
|
|
||||||
|
createCircularGradient = function(x0, y0, r0) {
|
||||||
|
return new FillStyleRadialGradient(x0, y0, 0, x0, y0, r0);
|
||||||
|
};
|
||||||
|
|
||||||
|
strokeRect(x, y, w, h) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("s" + x + "," + y + "," + w + "," + h + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
clearRect(x, y, w, h) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("c" + x + "," + y + "," + w +
|
||||||
|
"," + h + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
clip() {
|
||||||
|
this._drawCommands = this._drawCommands.concat("p;");
|
||||||
|
}
|
||||||
|
|
||||||
|
resetClip() {
|
||||||
|
this._drawCommands = this._drawCommands.concat("q;");
|
||||||
|
}
|
||||||
|
|
||||||
|
closePath() {
|
||||||
|
this._drawCommands = this._drawCommands.concat("o;");
|
||||||
|
}
|
||||||
|
|
||||||
|
moveTo(x, y) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("g" + x.toFixed(2) + "," + y.toFixed(2) + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
lineTo(x, y) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("i" + x.toFixed(2) + "," + y.toFixed(2) + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
quadraticCurveTo = function(cpx, cpy, x, y) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("u" + cpx + "," + cpy + "," + x + "," + y + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
bezierCurveTo(cp1x, cp1y, cp2x, cp2y, x, y, ) {
|
||||||
|
this._drawCommands = this._drawCommands.concat(
|
||||||
|
"z" + cp1x.toFixed(2) + "," + cp1y.toFixed(2) + "," + cp2x.toFixed(2) + "," + cp2y.toFixed(2) + "," +
|
||||||
|
x.toFixed(2) + "," + y.toFixed(2) + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
arcTo(x1, y1, x2, y2, radius) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("h" + x1 + "," + y1 + "," + x2 + "," + y2 + "," + radius + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
beginPath() {
|
||||||
|
this._drawCommands = this._drawCommands.concat("b;");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
fillRect(x, y, w, h) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("n" + x + "," + y + "," + w +
|
||||||
|
"," + h + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
rect(x, y, w, h) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("w" + x + "," + y + "," + w + "," + h + ";");
|
||||||
|
}
|
||||||
|
|
||||||
|
fill() {
|
||||||
|
this._drawCommands = this._drawCommands.concat("L;");
|
||||||
|
}
|
||||||
|
|
||||||
|
stroke(path) {
|
||||||
|
this._drawCommands = this._drawCommands.concat("x;");
|
||||||
|
}
|
||||||
|
|
||||||
|
arc(x, y, radius, startAngle, endAngle, anticlockwise) {
|
||||||
|
|
||||||
|
let ianticlockwise = 0;
|
||||||
|
if (anticlockwise) {
|
||||||
|
ianticlockwise = 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
this._drawCommands = this._drawCommands.concat(
|
||||||
|
"y" + x.toFixed(2) + "," + y.toFixed(2) + "," +
|
||||||
|
radius.toFixed(2) + "," + startAngle + "," + endAngle + "," + ianticlockwise +
|
||||||
|
";"
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
fillText(text, x, y) {
|
||||||
|
let tmptext = text.replace(/!/g, "!!");
|
||||||
|
tmptext = tmptext.replace(/,/g, "!,");
|
||||||
|
tmptext = tmptext.replace(/;/g, "!;");
|
||||||
|
this._drawCommands = this._drawCommands.concat("T" + tmptext + "," + x + "," + y + ",0.0;");
|
||||||
|
}
|
||||||
|
|
||||||
|
strokeText = function(text, x, y) {
|
||||||
|
let tmptext = text.replace(/!/g, "!!");
|
||||||
|
tmptext = tmptext.replace(/,/g, "!,");
|
||||||
|
tmptext = tmptext.replace(/;/g, "!;");
|
||||||
|
this._drawCommands = this._drawCommands.concat("U" + tmptext + "," + x + "," + y + ",0.0;");
|
||||||
|
}
|
||||||
|
|
||||||
|
measureText(text) {
|
||||||
|
return CanvasRenderingContext2D.GBridge.measureText(text, this.font, this.componentId);
|
||||||
|
}
|
||||||
|
|
||||||
|
isPointInPath = function(x, y) {
|
||||||
|
throw new Error('GCanvas not supported yet');
|
||||||
|
}
|
||||||
|
|
||||||
|
drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh) {
|
||||||
|
if (typeof image === 'string') {
|
||||||
|
var imgObj = new GImage();
|
||||||
|
imgObj.src = image;
|
||||||
|
image = imgObj;
|
||||||
|
}
|
||||||
|
if (image instanceof GImage) {
|
||||||
|
if (!image.complete) {
|
||||||
|
imgObj.onload = () => {
|
||||||
|
var index = this._needRedrawImageCache.indexOf(image);
|
||||||
|
if (index > -1) {
|
||||||
|
this._needRedrawImageCache.splice(index, 1);
|
||||||
|
CanvasRenderingContext2D.GBridge.bindImageTexture(this.componentId, image.src, image._id);
|
||||||
|
this._redrawflush(true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this._notCommitDrawImageCache.push(image);
|
||||||
|
} else {
|
||||||
|
CanvasRenderingContext2D.GBridge.bindImageTexture(this.componentId, image.src, image._id);
|
||||||
|
}
|
||||||
|
var srcArgs = [image, sx, sy, sw, sh, dx, dy, dw, dh];
|
||||||
|
var args = [];
|
||||||
|
for (var arg in srcArgs) {
|
||||||
|
if (typeof(srcArgs[arg]) != 'undefined') {
|
||||||
|
args.push(srcArgs[arg]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.__drawImage.apply(this, args);
|
||||||
|
//this.__drawImage(image,sx, sy, sw, sh, dx, dy, dw, dh);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
__drawImage(image, sx, sy, sw, sh, dx, dy, dw, dh) {
|
||||||
|
const numArgs = arguments.length;
|
||||||
|
|
||||||
|
function drawImageCommands() {
|
||||||
|
|
||||||
|
if (numArgs === 3) {
|
||||||
|
const x = parseFloat(sx) || 0.0;
|
||||||
|
const y = parseFloat(sy) || 0.0;
|
||||||
|
|
||||||
|
return ("d" + image._id + ",0,0," +
|
||||||
|
image.width + "," + image.height + "," +
|
||||||
|
x + "," + y + "," + image.width + "," + image.height + ";");
|
||||||
|
} else if (numArgs === 5) {
|
||||||
|
const x = parseFloat(sx) || 0.0;
|
||||||
|
const y = parseFloat(sy) || 0.0;
|
||||||
|
const width = parseInt(sw) || image.width;
|
||||||
|
const height = parseInt(sh) || image.height;
|
||||||
|
|
||||||
|
return ("d" + image._id + ",0,0," +
|
||||||
|
image.width + "," + image.height + "," +
|
||||||
|
x + "," + y + "," + width + "," + height + ";");
|
||||||
|
} else if (numArgs === 9) {
|
||||||
|
sx = parseFloat(sx) || 0.0;
|
||||||
|
sy = parseFloat(sy) || 0.0;
|
||||||
|
sw = parseInt(sw) || image.width;
|
||||||
|
sh = parseInt(sh) || image.height;
|
||||||
|
dx = parseFloat(dx) || 0.0;
|
||||||
|
dy = parseFloat(dy) || 0.0;
|
||||||
|
dw = parseInt(dw) || image.width;
|
||||||
|
dh = parseInt(dh) || image.height;
|
||||||
|
|
||||||
|
return ("d" + image._id + "," +
|
||||||
|
sx + "," + sy + "," + sw + "," + sh + "," +
|
||||||
|
dx + "," + dy + "," + dw + "," + dh + ";");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this._drawCommands += drawImageCommands();
|
||||||
|
}
|
||||||
|
|
||||||
|
_flush(reserve, callback) {
|
||||||
|
const commands = this._drawCommands;
|
||||||
|
this._drawCommands = '';
|
||||||
|
CanvasRenderingContext2D.GBridge.render2d(this.componentId, commands, callback);
|
||||||
|
this._needRender = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
_redrawflush(reserve, callback) {
|
||||||
|
const commands = this._redrawCommands;
|
||||||
|
CanvasRenderingContext2D.GBridge.render2d(this.componentId, commands, callback);
|
||||||
|
if (this._needRedrawImageCache.length == 0) {
|
||||||
|
this._redrawCommands = '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
draw(reserve, callback) {
|
||||||
|
if (!reserve) {
|
||||||
|
this._globalAlpha = this._savedGlobalAlpha.pop();
|
||||||
|
this._savedGlobalAlpha.push(this._globalAlpha);
|
||||||
|
this._redrawCommands = this._drawCommands;
|
||||||
|
this._needRedrawImageCache = this._notCommitDrawImageCache;
|
||||||
|
if (this._autoSaveContext) {
|
||||||
|
this._drawCommands = ("v;" + this._drawCommands);
|
||||||
|
this._autoSaveContext = false;
|
||||||
|
} else {
|
||||||
|
this._drawCommands = ("e;X;v;" + this._drawCommands);
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
this._needRedrawImageCache = this._needRedrawImageCache.concat(this._notCommitDrawImageCache);
|
||||||
|
this._redrawCommands += this._drawCommands;
|
||||||
|
if (this._autoSaveContext) {
|
||||||
|
this._drawCommands = ("v;" + this._drawCommands);
|
||||||
|
this._autoSaveContext = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this._notCommitDrawImageCache = [];
|
||||||
|
if (this._flush) {
|
||||||
|
this._flush(reserve, callback);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
getImageData(x, y, w, h, callback) {
|
||||||
|
CanvasRenderingContext2D.GBridge.getImageData(this.componentId, x, y, w, h, function(res) {
|
||||||
|
res.data = Base64ToUint8ClampedArray(res.data);
|
||||||
|
if (typeof(callback) == 'function') {
|
||||||
|
callback(res);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
putImageData(data, x, y, w, h, callback) {
|
||||||
|
if (data instanceof Uint8ClampedArray) {
|
||||||
|
data = ArrayBufferToBase64(data);
|
||||||
|
CanvasRenderingContext2D.GBridge.putImageData(this.componentId, data, x, y, w, h, function(res) {
|
||||||
|
if (typeof(callback) == 'function') {
|
||||||
|
callback(res);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
toTempFilePath(x, y, width, height, destWidth, destHeight, fileType, quality, callback) {
|
||||||
|
CanvasRenderingContext2D.GBridge.toTempFilePath(this.componentId, x, y, width, height, destWidth, destHeight,
|
||||||
|
fileType, quality,
|
||||||
|
function(res) {
|
||||||
|
if (typeof(callback) == 'function') {
|
||||||
|
callback(res);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,11 @@
|
||||||
|
export default class WebGLActiveInfo {
|
||||||
|
className = 'WebGLActiveInfo';
|
||||||
|
|
||||||
|
constructor({
|
||||||
|
type, name, size
|
||||||
|
}) {
|
||||||
|
this.type = type;
|
||||||
|
this.name = name;
|
||||||
|
this.size = size;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
import {getTransferedObjectUUID} from './classUtils';
|
||||||
|
|
||||||
|
const name = 'WebGLBuffer';
|
||||||
|
|
||||||
|
function uuid(id) {
|
||||||
|
return getTransferedObjectUUID(name, id);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class WebGLBuffer {
|
||||||
|
className = name;
|
||||||
|
|
||||||
|
constructor(id) {
|
||||||
|
this.id = id;
|
||||||
|
}
|
||||||
|
|
||||||
|
static uuid = uuid;
|
||||||
|
|
||||||
|
uuid() {
|
||||||
|
return uuid(this.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
import {getTransferedObjectUUID} from './classUtils';
|
||||||
|
|
||||||
|
const name = 'WebGLFrameBuffer';
|
||||||
|
|
||||||
|
function uuid(id) {
|
||||||
|
return getTransferedObjectUUID(name, id);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class WebGLFramebuffer {
|
||||||
|
className = name;
|
||||||
|
|
||||||
|
constructor(id) {
|
||||||
|
this.id = id;
|
||||||
|
}
|
||||||
|
|
||||||
|
static uuid = uuid;
|
||||||
|
|
||||||
|
uuid() {
|
||||||
|
return uuid(this.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,298 @@
|
||||||
|
export default {
|
||||||
|
"DEPTH_BUFFER_BIT": 256,
|
||||||
|
"STENCIL_BUFFER_BIT": 1024,
|
||||||
|
"COLOR_BUFFER_BIT": 16384,
|
||||||
|
"POINTS": 0,
|
||||||
|
"LINES": 1,
|
||||||
|
"LINE_LOOP": 2,
|
||||||
|
"LINE_STRIP": 3,
|
||||||
|
"TRIANGLES": 4,
|
||||||
|
"TRIANGLE_STRIP": 5,
|
||||||
|
"TRIANGLE_FAN": 6,
|
||||||
|
"ZERO": 0,
|
||||||
|
"ONE": 1,
|
||||||
|
"SRC_COLOR": 768,
|
||||||
|
"ONE_MINUS_SRC_COLOR": 769,
|
||||||
|
"SRC_ALPHA": 770,
|
||||||
|
"ONE_MINUS_SRC_ALPHA": 771,
|
||||||
|
"DST_ALPHA": 772,
|
||||||
|
"ONE_MINUS_DST_ALPHA": 773,
|
||||||
|
"DST_COLOR": 774,
|
||||||
|
"ONE_MINUS_DST_COLOR": 775,
|
||||||
|
"SRC_ALPHA_SATURATE": 776,
|
||||||
|
"FUNC_ADD": 32774,
|
||||||
|
"BLEND_EQUATION": 32777,
|
||||||
|
"BLEND_EQUATION_RGB": 32777,
|
||||||
|
"BLEND_EQUATION_ALPHA": 34877,
|
||||||
|
"FUNC_SUBTRACT": 32778,
|
||||||
|
"FUNC_REVERSE_SUBTRACT": 32779,
|
||||||
|
"BLEND_DST_RGB": 32968,
|
||||||
|
"BLEND_SRC_RGB": 32969,
|
||||||
|
"BLEND_DST_ALPHA": 32970,
|
||||||
|
"BLEND_SRC_ALPHA": 32971,
|
||||||
|
"CONSTANT_COLOR": 32769,
|
||||||
|
"ONE_MINUS_CONSTANT_COLOR": 32770,
|
||||||
|
"CONSTANT_ALPHA": 32771,
|
||||||
|
"ONE_MINUS_CONSTANT_ALPHA": 32772,
|
||||||
|
"BLEND_COLOR": 32773,
|
||||||
|
"ARRAY_BUFFER": 34962,
|
||||||
|
"ELEMENT_ARRAY_BUFFER": 34963,
|
||||||
|
"ARRAY_BUFFER_BINDING": 34964,
|
||||||
|
"ELEMENT_ARRAY_BUFFER_BINDING": 34965,
|
||||||
|
"STREAM_DRAW": 35040,
|
||||||
|
"STATIC_DRAW": 35044,
|
||||||
|
"DYNAMIC_DRAW": 35048,
|
||||||
|
"BUFFER_SIZE": 34660,
|
||||||
|
"BUFFER_USAGE": 34661,
|
||||||
|
"CURRENT_VERTEX_ATTRIB": 34342,
|
||||||
|
"FRONT": 1028,
|
||||||
|
"BACK": 1029,
|
||||||
|
"FRONT_AND_BACK": 1032,
|
||||||
|
"TEXTURE_2D": 3553,
|
||||||
|
"CULL_FACE": 2884,
|
||||||
|
"BLEND": 3042,
|
||||||
|
"DITHER": 3024,
|
||||||
|
"STENCIL_TEST": 2960,
|
||||||
|
"DEPTH_TEST": 2929,
|
||||||
|
"SCISSOR_TEST": 3089,
|
||||||
|
"POLYGON_OFFSET_FILL": 32823,
|
||||||
|
"SAMPLE_ALPHA_TO_COVERAGE": 32926,
|
||||||
|
"SAMPLE_COVERAGE": 32928,
|
||||||
|
"NO_ERROR": 0,
|
||||||
|
"INVALID_ENUM": 1280,
|
||||||
|
"INVALID_VALUE": 1281,
|
||||||
|
"INVALID_OPERATION": 1282,
|
||||||
|
"OUT_OF_MEMORY": 1285,
|
||||||
|
"CW": 2304,
|
||||||
|
"CCW": 2305,
|
||||||
|
"LINE_WIDTH": 2849,
|
||||||
|
"ALIASED_POINT_SIZE_RANGE": 33901,
|
||||||
|
"ALIASED_LINE_WIDTH_RANGE": 33902,
|
||||||
|
"CULL_FACE_MODE": 2885,
|
||||||
|
"FRONT_FACE": 2886,
|
||||||
|
"DEPTH_RANGE": 2928,
|
||||||
|
"DEPTH_WRITEMASK": 2930,
|
||||||
|
"DEPTH_CLEAR_VALUE": 2931,
|
||||||
|
"DEPTH_FUNC": 2932,
|
||||||
|
"STENCIL_CLEAR_VALUE": 2961,
|
||||||
|
"STENCIL_FUNC": 2962,
|
||||||
|
"STENCIL_FAIL": 2964,
|
||||||
|
"STENCIL_PASS_DEPTH_FAIL": 2965,
|
||||||
|
"STENCIL_PASS_DEPTH_PASS": 2966,
|
||||||
|
"STENCIL_REF": 2967,
|
||||||
|
"STENCIL_VALUE_MASK": 2963,
|
||||||
|
"STENCIL_WRITEMASK": 2968,
|
||||||
|
"STENCIL_BACK_FUNC": 34816,
|
||||||
|
"STENCIL_BACK_FAIL": 34817,
|
||||||
|
"STENCIL_BACK_PASS_DEPTH_FAIL": 34818,
|
||||||
|
"STENCIL_BACK_PASS_DEPTH_PASS": 34819,
|
||||||
|
"STENCIL_BACK_REF": 36003,
|
||||||
|
"STENCIL_BACK_VALUE_MASK": 36004,
|
||||||
|
"STENCIL_BACK_WRITEMASK": 36005,
|
||||||
|
"VIEWPORT": 2978,
|
||||||
|
"SCISSOR_BOX": 3088,
|
||||||
|
"COLOR_CLEAR_VALUE": 3106,
|
||||||
|
"COLOR_WRITEMASK": 3107,
|
||||||
|
"UNPACK_ALIGNMENT": 3317,
|
||||||
|
"PACK_ALIGNMENT": 3333,
|
||||||
|
"MAX_TEXTURE_SIZE": 3379,
|
||||||
|
"MAX_VIEWPORT_DIMS": 3386,
|
||||||
|
"SUBPIXEL_BITS": 3408,
|
||||||
|
"RED_BITS": 3410,
|
||||||
|
"GREEN_BITS": 3411,
|
||||||
|
"BLUE_BITS": 3412,
|
||||||
|
"ALPHA_BITS": 3413,
|
||||||
|
"DEPTH_BITS": 3414,
|
||||||
|
"STENCIL_BITS": 3415,
|
||||||
|
"POLYGON_OFFSET_UNITS": 10752,
|
||||||
|
"POLYGON_OFFSET_FACTOR": 32824,
|
||||||
|
"TEXTURE_BINDING_2D": 32873,
|
||||||
|
"SAMPLE_BUFFERS": 32936,
|
||||||
|
"SAMPLES": 32937,
|
||||||
|
"SAMPLE_COVERAGE_VALUE": 32938,
|
||||||
|
"SAMPLE_COVERAGE_INVERT": 32939,
|
||||||
|
"COMPRESSED_TEXTURE_FORMATS": 34467,
|
||||||
|
"DONT_CARE": 4352,
|
||||||
|
"FASTEST": 4353,
|
||||||
|
"NICEST": 4354,
|
||||||
|
"GENERATE_MIPMAP_HINT": 33170,
|
||||||
|
"BYTE": 5120,
|
||||||
|
"UNSIGNED_BYTE": 5121,
|
||||||
|
"SHORT": 5122,
|
||||||
|
"UNSIGNED_SHORT": 5123,
|
||||||
|
"INT": 5124,
|
||||||
|
"UNSIGNED_INT": 5125,
|
||||||
|
"FLOAT": 5126,
|
||||||
|
"DEPTH_COMPONENT": 6402,
|
||||||
|
"ALPHA": 6406,
|
||||||
|
"RGB": 6407,
|
||||||
|
"RGBA": 6408,
|
||||||
|
"LUMINANCE": 6409,
|
||||||
|
"LUMINANCE_ALPHA": 6410,
|
||||||
|
"UNSIGNED_SHORT_4_4_4_4": 32819,
|
||||||
|
"UNSIGNED_SHORT_5_5_5_1": 32820,
|
||||||
|
"UNSIGNED_SHORT_5_6_5": 33635,
|
||||||
|
"FRAGMENT_SHADER": 35632,
|
||||||
|
"VERTEX_SHADER": 35633,
|
||||||
|
"MAX_VERTEX_ATTRIBS": 34921,
|
||||||
|
"MAX_VERTEX_UNIFORM_VECTORS": 36347,
|
||||||
|
"MAX_VARYING_VECTORS": 36348,
|
||||||
|
"MAX_COMBINED_TEXTURE_IMAGE_UNITS": 35661,
|
||||||
|
"MAX_VERTEX_TEXTURE_IMAGE_UNITS": 35660,
|
||||||
|
"MAX_TEXTURE_IMAGE_UNITS": 34930,
|
||||||
|
"MAX_FRAGMENT_UNIFORM_VECTORS": 36349,
|
||||||
|
"SHADER_TYPE": 35663,
|
||||||
|
"DELETE_STATUS": 35712,
|
||||||
|
"LINK_STATUS": 35714,
|
||||||
|
"VALIDATE_STATUS": 35715,
|
||||||
|
"ATTACHED_SHADERS": 35717,
|
||||||
|
"ACTIVE_UNIFORMS": 35718,
|
||||||
|
"ACTIVE_ATTRIBUTES": 35721,
|
||||||
|
"SHADING_LANGUAGE_VERSION": 35724,
|
||||||
|
"CURRENT_PROGRAM": 35725,
|
||||||
|
"NEVER": 512,
|
||||||
|
"LESS": 513,
|
||||||
|
"EQUAL": 514,
|
||||||
|
"LEQUAL": 515,
|
||||||
|
"GREATER": 516,
|
||||||
|
"NOTEQUAL": 517,
|
||||||
|
"GEQUAL": 518,
|
||||||
|
"ALWAYS": 519,
|
||||||
|
"KEEP": 7680,
|
||||||
|
"REPLACE": 7681,
|
||||||
|
"INCR": 7682,
|
||||||
|
"DECR": 7683,
|
||||||
|
"INVERT": 5386,
|
||||||
|
"INCR_WRAP": 34055,
|
||||||
|
"DECR_WRAP": 34056,
|
||||||
|
"VENDOR": 7936,
|
||||||
|
"RENDERER": 7937,
|
||||||
|
"VERSION": 7938,
|
||||||
|
"NEAREST": 9728,
|
||||||
|
"LINEAR": 9729,
|
||||||
|
"NEAREST_MIPMAP_NEAREST": 9984,
|
||||||
|
"LINEAR_MIPMAP_NEAREST": 9985,
|
||||||
|
"NEAREST_MIPMAP_LINEAR": 9986,
|
||||||
|
"LINEAR_MIPMAP_LINEAR": 9987,
|
||||||
|
"TEXTURE_MAG_FILTER": 10240,
|
||||||
|
"TEXTURE_MIN_FILTER": 10241,
|
||||||
|
"TEXTURE_WRAP_S": 10242,
|
||||||
|
"TEXTURE_WRAP_T": 10243,
|
||||||
|
"TEXTURE": 5890,
|
||||||
|
"TEXTURE_CUBE_MAP": 34067,
|
||||||
|
"TEXTURE_BINDING_CUBE_MAP": 34068,
|
||||||
|
"TEXTURE_CUBE_MAP_POSITIVE_X": 34069,
|
||||||
|
"TEXTURE_CUBE_MAP_NEGATIVE_X": 34070,
|
||||||
|
"TEXTURE_CUBE_MAP_POSITIVE_Y": 34071,
|
||||||
|
"TEXTURE_CUBE_MAP_NEGATIVE_Y": 34072,
|
||||||
|
"TEXTURE_CUBE_MAP_POSITIVE_Z": 34073,
|
||||||
|
"TEXTURE_CUBE_MAP_NEGATIVE_Z": 34074,
|
||||||
|
"MAX_CUBE_MAP_TEXTURE_SIZE": 34076,
|
||||||
|
"TEXTURE0": 33984,
|
||||||
|
"TEXTURE1": 33985,
|
||||||
|
"TEXTURE2": 33986,
|
||||||
|
"TEXTURE3": 33987,
|
||||||
|
"TEXTURE4": 33988,
|
||||||
|
"TEXTURE5": 33989,
|
||||||
|
"TEXTURE6": 33990,
|
||||||
|
"TEXTURE7": 33991,
|
||||||
|
"TEXTURE8": 33992,
|
||||||
|
"TEXTURE9": 33993,
|
||||||
|
"TEXTURE10": 33994,
|
||||||
|
"TEXTURE11": 33995,
|
||||||
|
"TEXTURE12": 33996,
|
||||||
|
"TEXTURE13": 33997,
|
||||||
|
"TEXTURE14": 33998,
|
||||||
|
"TEXTURE15": 33999,
|
||||||
|
"TEXTURE16": 34000,
|
||||||
|
"TEXTURE17": 34001,
|
||||||
|
"TEXTURE18": 34002,
|
||||||
|
"TEXTURE19": 34003,
|
||||||
|
"TEXTURE20": 34004,
|
||||||
|
"TEXTURE21": 34005,
|
||||||
|
"TEXTURE22": 34006,
|
||||||
|
"TEXTURE23": 34007,
|
||||||
|
"TEXTURE24": 34008,
|
||||||
|
"TEXTURE25": 34009,
|
||||||
|
"TEXTURE26": 34010,
|
||||||
|
"TEXTURE27": 34011,
|
||||||
|
"TEXTURE28": 34012,
|
||||||
|
"TEXTURE29": 34013,
|
||||||
|
"TEXTURE30": 34014,
|
||||||
|
"TEXTURE31": 34015,
|
||||||
|
"ACTIVE_TEXTURE": 34016,
|
||||||
|
"REPEAT": 10497,
|
||||||
|
"CLAMP_TO_EDGE": 33071,
|
||||||
|
"MIRRORED_REPEAT": 33648,
|
||||||
|
"FLOAT_VEC2": 35664,
|
||||||
|
"FLOAT_VEC3": 35665,
|
||||||
|
"FLOAT_VEC4": 35666,
|
||||||
|
"INT_VEC2": 35667,
|
||||||
|
"INT_VEC3": 35668,
|
||||||
|
"INT_VEC4": 35669,
|
||||||
|
"BOOL": 35670,
|
||||||
|
"BOOL_VEC2": 35671,
|
||||||
|
"BOOL_VEC3": 35672,
|
||||||
|
"BOOL_VEC4": 35673,
|
||||||
|
"FLOAT_MAT2": 35674,
|
||||||
|
"FLOAT_MAT3": 35675,
|
||||||
|
"FLOAT_MAT4": 35676,
|
||||||
|
"SAMPLER_2D": 35678,
|
||||||
|
"SAMPLER_CUBE": 35680,
|
||||||
|
"VERTEX_ATTRIB_ARRAY_ENABLED": 34338,
|
||||||
|
"VERTEX_ATTRIB_ARRAY_SIZE": 34339,
|
||||||
|
"VERTEX_ATTRIB_ARRAY_STRIDE": 34340,
|
||||||
|
"VERTEX_ATTRIB_ARRAY_TYPE": 34341,
|
||||||
|
"VERTEX_ATTRIB_ARRAY_NORMALIZED": 34922,
|
||||||
|
"VERTEX_ATTRIB_ARRAY_POINTER": 34373,
|
||||||
|
"VERTEX_ATTRIB_ARRAY_BUFFER_BINDING": 34975,
|
||||||
|
"IMPLEMENTATION_COLOR_READ_TYPE": 35738,
|
||||||
|
"IMPLEMENTATION_COLOR_READ_FORMAT": 35739,
|
||||||
|
"COMPILE_STATUS": 35713,
|
||||||
|
"LOW_FLOAT": 36336,
|
||||||
|
"MEDIUM_FLOAT": 36337,
|
||||||
|
"HIGH_FLOAT": 36338,
|
||||||
|
"LOW_INT": 36339,
|
||||||
|
"MEDIUM_INT": 36340,
|
||||||
|
"HIGH_INT": 36341,
|
||||||
|
"FRAMEBUFFER": 36160,
|
||||||
|
"RENDERBUFFER": 36161,
|
||||||
|
"RGBA4": 32854,
|
||||||
|
"RGB5_A1": 32855,
|
||||||
|
"RGB565": 36194,
|
||||||
|
"DEPTH_COMPONENT16": 33189,
|
||||||
|
"STENCIL_INDEX8": 36168,
|
||||||
|
"DEPTH_STENCIL": 34041,
|
||||||
|
"RENDERBUFFER_WIDTH": 36162,
|
||||||
|
"RENDERBUFFER_HEIGHT": 36163,
|
||||||
|
"RENDERBUFFER_INTERNAL_FORMAT": 36164,
|
||||||
|
"RENDERBUFFER_RED_SIZE": 36176,
|
||||||
|
"RENDERBUFFER_GREEN_SIZE": 36177,
|
||||||
|
"RENDERBUFFER_BLUE_SIZE": 36178,
|
||||||
|
"RENDERBUFFER_ALPHA_SIZE": 36179,
|
||||||
|
"RENDERBUFFER_DEPTH_SIZE": 36180,
|
||||||
|
"RENDERBUFFER_STENCIL_SIZE": 36181,
|
||||||
|
"FRAMEBUFFER_ATTACHMENT_OBJECT_TYPE": 36048,
|
||||||
|
"FRAMEBUFFER_ATTACHMENT_OBJECT_NAME": 36049,
|
||||||
|
"FRAMEBUFFER_ATTACHMENT_TEXTURE_LEVEL": 36050,
|
||||||
|
"FRAMEBUFFER_ATTACHMENT_TEXTURE_CUBE_MAP_FACE": 36051,
|
||||||
|
"COLOR_ATTACHMENT0": 36064,
|
||||||
|
"DEPTH_ATTACHMENT": 36096,
|
||||||
|
"STENCIL_ATTACHMENT": 36128,
|
||||||
|
"DEPTH_STENCIL_ATTACHMENT": 33306,
|
||||||
|
"NONE": 0,
|
||||||
|
"FRAMEBUFFER_COMPLETE": 36053,
|
||||||
|
"FRAMEBUFFER_INCOMPLETE_ATTACHMENT": 36054,
|
||||||
|
"FRAMEBUFFER_INCOMPLETE_MISSING_ATTACHMENT": 36055,
|
||||||
|
"FRAMEBUFFER_INCOMPLETE_DIMENSIONS": 36057,
|
||||||
|
"FRAMEBUFFER_UNSUPPORTED": 36061,
|
||||||
|
"FRAMEBUFFER_BINDING": 36006,
|
||||||
|
"RENDERBUFFER_BINDING": 36007,
|
||||||
|
"MAX_RENDERBUFFER_SIZE": 34024,
|
||||||
|
"INVALID_FRAMEBUFFER_OPERATION": 1286,
|
||||||
|
"UNPACK_FLIP_Y_WEBGL": 37440,
|
||||||
|
"UNPACK_PREMULTIPLY_ALPHA_WEBGL": 37441,
|
||||||
|
"CONTEXT_LOST_WEBGL": 37442,
|
||||||
|
"UNPACK_COLORSPACE_CONVERSION_WEBGL": 37443,
|
||||||
|
"BROWSER_DEFAULT_WEBGL": 37444
|
||||||
|
};
|
||||||
|
|
@ -0,0 +1,142 @@
|
||||||
|
let i = 1;
|
||||||
|
|
||||||
|
const GLmethod = {};
|
||||||
|
|
||||||
|
GLmethod.activeTexture = i++; //1
|
||||||
|
GLmethod.attachShader = i++;
|
||||||
|
GLmethod.bindAttribLocation = i++;
|
||||||
|
GLmethod.bindBuffer = i++;
|
||||||
|
GLmethod.bindFramebuffer = i++;
|
||||||
|
GLmethod.bindRenderbuffer = i++;
|
||||||
|
GLmethod.bindTexture = i++;
|
||||||
|
GLmethod.blendColor = i++;
|
||||||
|
GLmethod.blendEquation = i++;
|
||||||
|
GLmethod.blendEquationSeparate = i++; //10
|
||||||
|
GLmethod.blendFunc = i++;
|
||||||
|
GLmethod.blendFuncSeparate = i++;
|
||||||
|
GLmethod.bufferData = i++;
|
||||||
|
GLmethod.bufferSubData = i++;
|
||||||
|
GLmethod.checkFramebufferStatus = i++;
|
||||||
|
GLmethod.clear = i++;
|
||||||
|
GLmethod.clearColor = i++;
|
||||||
|
GLmethod.clearDepth = i++;
|
||||||
|
GLmethod.clearStencil = i++;
|
||||||
|
GLmethod.colorMask = i++; //20
|
||||||
|
GLmethod.compileShader = i++;
|
||||||
|
GLmethod.compressedTexImage2D = i++;
|
||||||
|
GLmethod.compressedTexSubImage2D = i++;
|
||||||
|
GLmethod.copyTexImage2D = i++;
|
||||||
|
GLmethod.copyTexSubImage2D = i++;
|
||||||
|
GLmethod.createBuffer = i++;
|
||||||
|
GLmethod.createFramebuffer = i++;
|
||||||
|
GLmethod.createProgram = i++;
|
||||||
|
GLmethod.createRenderbuffer = i++;
|
||||||
|
GLmethod.createShader = i++; //30
|
||||||
|
GLmethod.createTexture = i++;
|
||||||
|
GLmethod.cullFace = i++;
|
||||||
|
GLmethod.deleteBuffer = i++;
|
||||||
|
GLmethod.deleteFramebuffer = i++;
|
||||||
|
GLmethod.deleteProgram = i++;
|
||||||
|
GLmethod.deleteRenderbuffer = i++;
|
||||||
|
GLmethod.deleteShader = i++;
|
||||||
|
GLmethod.deleteTexture = i++;
|
||||||
|
GLmethod.depthFunc = i++;
|
||||||
|
GLmethod.depthMask = i++; //40
|
||||||
|
GLmethod.depthRange = i++;
|
||||||
|
GLmethod.detachShader = i++;
|
||||||
|
GLmethod.disable = i++;
|
||||||
|
GLmethod.disableVertexAttribArray = i++;
|
||||||
|
GLmethod.drawArrays = i++;
|
||||||
|
GLmethod.drawArraysInstancedANGLE = i++;
|
||||||
|
GLmethod.drawElements = i++;
|
||||||
|
GLmethod.drawElementsInstancedANGLE = i++;
|
||||||
|
GLmethod.enable = i++;
|
||||||
|
GLmethod.enableVertexAttribArray = i++; //50
|
||||||
|
GLmethod.flush = i++;
|
||||||
|
GLmethod.framebufferRenderbuffer = i++;
|
||||||
|
GLmethod.framebufferTexture2D = i++;
|
||||||
|
GLmethod.frontFace = i++;
|
||||||
|
GLmethod.generateMipmap = i++;
|
||||||
|
GLmethod.getActiveAttrib = i++;
|
||||||
|
GLmethod.getActiveUniform = i++;
|
||||||
|
GLmethod.getAttachedShaders = i++;
|
||||||
|
GLmethod.getAttribLocation = i++;
|
||||||
|
GLmethod.getBufferParameter = i++; //60
|
||||||
|
GLmethod.getContextAttributes = i++;
|
||||||
|
GLmethod.getError = i++;
|
||||||
|
GLmethod.getExtension = i++;
|
||||||
|
GLmethod.getFramebufferAttachmentParameter = i++;
|
||||||
|
GLmethod.getParameter = i++;
|
||||||
|
GLmethod.getProgramInfoLog = i++;
|
||||||
|
GLmethod.getProgramParameter = i++;
|
||||||
|
GLmethod.getRenderbufferParameter = i++;
|
||||||
|
GLmethod.getShaderInfoLog = i++;
|
||||||
|
GLmethod.getShaderParameter = i++; //70
|
||||||
|
GLmethod.getShaderPrecisionFormat = i++;
|
||||||
|
GLmethod.getShaderSource = i++;
|
||||||
|
GLmethod.getSupportedExtensions = i++;
|
||||||
|
GLmethod.getTexParameter = i++;
|
||||||
|
GLmethod.getUniform = i++;
|
||||||
|
GLmethod.getUniformLocation = i++;
|
||||||
|
GLmethod.getVertexAttrib = i++;
|
||||||
|
GLmethod.getVertexAttribOffset = i++;
|
||||||
|
GLmethod.isBuffer = i++;
|
||||||
|
GLmethod.isContextLost = i++; //80
|
||||||
|
GLmethod.isEnabled = i++;
|
||||||
|
GLmethod.isFramebuffer = i++;
|
||||||
|
GLmethod.isProgram = i++;
|
||||||
|
GLmethod.isRenderbuffer = i++;
|
||||||
|
GLmethod.isShader = i++;
|
||||||
|
GLmethod.isTexture = i++;
|
||||||
|
GLmethod.lineWidth = i++;
|
||||||
|
GLmethod.linkProgram = i++;
|
||||||
|
GLmethod.pixelStorei = i++;
|
||||||
|
GLmethod.polygonOffset = i++; //90
|
||||||
|
GLmethod.readPixels = i++;
|
||||||
|
GLmethod.renderbufferStorage = i++;
|
||||||
|
GLmethod.sampleCoverage = i++;
|
||||||
|
GLmethod.scissor = i++;
|
||||||
|
GLmethod.shaderSource = i++;
|
||||||
|
GLmethod.stencilFunc = i++;
|
||||||
|
GLmethod.stencilFuncSeparate = i++;
|
||||||
|
GLmethod.stencilMask = i++;
|
||||||
|
GLmethod.stencilMaskSeparate = i++;
|
||||||
|
GLmethod.stencilOp = i++; //100
|
||||||
|
GLmethod.stencilOpSeparate = i++;
|
||||||
|
GLmethod.texImage2D = i++;
|
||||||
|
GLmethod.texParameterf = i++;
|
||||||
|
GLmethod.texParameteri = i++;
|
||||||
|
GLmethod.texSubImage2D = i++;
|
||||||
|
GLmethod.uniform1f = i++;
|
||||||
|
GLmethod.uniform1fv = i++;
|
||||||
|
GLmethod.uniform1i = i++;
|
||||||
|
GLmethod.uniform1iv = i++;
|
||||||
|
GLmethod.uniform2f = i++; //110
|
||||||
|
GLmethod.uniform2fv = i++;
|
||||||
|
GLmethod.uniform2i = i++;
|
||||||
|
GLmethod.uniform2iv = i++;
|
||||||
|
GLmethod.uniform3f = i++;
|
||||||
|
GLmethod.uniform3fv = i++;
|
||||||
|
GLmethod.uniform3i = i++;
|
||||||
|
GLmethod.uniform3iv = i++;
|
||||||
|
GLmethod.uniform4f = i++;
|
||||||
|
GLmethod.uniform4fv = i++;
|
||||||
|
GLmethod.uniform4i = i++; //120
|
||||||
|
GLmethod.uniform4iv = i++;
|
||||||
|
GLmethod.uniformMatrix2fv = i++;
|
||||||
|
GLmethod.uniformMatrix3fv = i++;
|
||||||
|
GLmethod.uniformMatrix4fv = i++;
|
||||||
|
GLmethod.useProgram = i++;
|
||||||
|
GLmethod.validateProgram = i++;
|
||||||
|
GLmethod.vertexAttrib1f = i++; //new
|
||||||
|
GLmethod.vertexAttrib2f = i++; //new
|
||||||
|
GLmethod.vertexAttrib3f = i++; //new
|
||||||
|
GLmethod.vertexAttrib4f = i++; //new //130
|
||||||
|
GLmethod.vertexAttrib1fv = i++; //new
|
||||||
|
GLmethod.vertexAttrib2fv = i++; //new
|
||||||
|
GLmethod.vertexAttrib3fv = i++; //new
|
||||||
|
GLmethod.vertexAttrib4fv = i++; //new
|
||||||
|
GLmethod.vertexAttribPointer = i++;
|
||||||
|
GLmethod.viewport = i++;
|
||||||
|
|
||||||
|
export default GLmethod;
|
||||||
|
|
@ -0,0 +1,23 @@
|
||||||
|
const GLtype = {};
|
||||||
|
|
||||||
|
[
|
||||||
|
"GLbitfield",
|
||||||
|
"GLboolean",
|
||||||
|
"GLbyte",
|
||||||
|
"GLclampf",
|
||||||
|
"GLenum",
|
||||||
|
"GLfloat",
|
||||||
|
"GLint",
|
||||||
|
"GLintptr",
|
||||||
|
"GLsizei",
|
||||||
|
"GLsizeiptr",
|
||||||
|
"GLshort",
|
||||||
|
"GLubyte",
|
||||||
|
"GLuint",
|
||||||
|
"GLushort"
|
||||||
|
].sort().map((typeName, i) => GLtype[typeName] = 1 >> (i + 1));
|
||||||
|
|
||||||
|
export default GLtype;
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
import {getTransferedObjectUUID} from './classUtils';
|
||||||
|
|
||||||
|
const name = 'WebGLProgram';
|
||||||
|
|
||||||
|
function uuid(id) {
|
||||||
|
return getTransferedObjectUUID(name, id);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class WebGLProgram {
|
||||||
|
className = name;
|
||||||
|
|
||||||
|
constructor(id) {
|
||||||
|
this.id = id;
|
||||||
|
}
|
||||||
|
|
||||||
|
static uuid = uuid;
|
||||||
|
|
||||||
|
uuid() {
|
||||||
|
return uuid(this.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,21 @@
|
||||||
|
import {getTransferedObjectUUID} from './classUtils';
|
||||||
|
|
||||||
|
const name = 'WebGLRenderBuffer';
|
||||||
|
|
||||||
|
function uuid(id) {
|
||||||
|
return getTransferedObjectUUID(name, id);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class WebGLRenderbuffer {
|
||||||
|
className = name;
|
||||||
|
|
||||||
|
constructor(id) {
|
||||||
|
this.id = id;
|
||||||
|
}
|
||||||
|
|
||||||
|
static uuid = uuid;
|
||||||
|
|
||||||
|
uuid() {
|
||||||
|
return uuid(this.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,22 @@
|
||||||
|
import {getTransferedObjectUUID} from './classUtils';
|
||||||
|
|
||||||
|
const name = 'WebGLShader';
|
||||||
|
|
||||||
|
function uuid(id) {
|
||||||
|
return getTransferedObjectUUID(name, id);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class WebGLShader {
|
||||||
|
className = name;
|
||||||
|
|
||||||
|
constructor(id, type) {
|
||||||
|
this.id = id;
|
||||||
|
this.type = type;
|
||||||
|
}
|
||||||
|
|
||||||
|
static uuid = uuid;
|
||||||
|
|
||||||
|
uuid() {
|
||||||
|
return uuid(this.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,11 @@
|
||||||
|
export default class WebGLShaderPrecisionFormat {
|
||||||
|
className = 'WebGLShaderPrecisionFormat';
|
||||||
|
|
||||||
|
constructor({
|
||||||
|
rangeMin, rangeMax, precision
|
||||||
|
}) {
|
||||||
|
this.rangeMin = rangeMin;
|
||||||
|
this.rangeMax = rangeMax;
|
||||||
|
this.precision = precision;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
import {getTransferedObjectUUID} from './classUtils';
|
||||||
|
|
||||||
|
const name = 'WebGLTexture';
|
||||||
|
|
||||||
|
function uuid(id) {
|
||||||
|
return getTransferedObjectUUID(name, id);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class WebGLTexture {
|
||||||
|
className = name;
|
||||||
|
|
||||||
|
constructor(id, type) {
|
||||||
|
this.id = id;
|
||||||
|
this.type = type;
|
||||||
|
}
|
||||||
|
|
||||||
|
static uuid = uuid;
|
||||||
|
|
||||||
|
uuid() {
|
||||||
|
return uuid(this.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
import {getTransferedObjectUUID} from './classUtils';
|
||||||
|
|
||||||
|
const name = 'WebGLUniformLocation';
|
||||||
|
|
||||||
|
function uuid(id) {
|
||||||
|
return getTransferedObjectUUID(name, id);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default class WebGLUniformLocation {
|
||||||
|
className = name;
|
||||||
|
|
||||||
|
constructor(id, type) {
|
||||||
|
this.id = id;
|
||||||
|
this.type = type;
|
||||||
|
}
|
||||||
|
|
||||||
|
static uuid = uuid;
|
||||||
|
|
||||||
|
uuid() {
|
||||||
|
return uuid(this.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
export function getTransferedObjectUUID(name, id) {
|
||||||
|
return `${name.toLowerCase()}-${id}`;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,74 @@
|
||||||
|
import GContext2D from '../context-2d/RenderingContext';
|
||||||
|
import GContextWebGL from '../context-webgl/RenderingContext';
|
||||||
|
|
||||||
|
export default class GCanvas {
|
||||||
|
|
||||||
|
// static GBridge = null;
|
||||||
|
|
||||||
|
id = null;
|
||||||
|
|
||||||
|
_needRender = true;
|
||||||
|
|
||||||
|
constructor(id, { disableAutoSwap }) {
|
||||||
|
this.id = id;
|
||||||
|
|
||||||
|
this._disableAutoSwap = disableAutoSwap;
|
||||||
|
if (disableAutoSwap) {
|
||||||
|
this._swapBuffers = () => {
|
||||||
|
GCanvas.GBridge.render(this.id);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
getContext(type) {
|
||||||
|
|
||||||
|
let context = null;
|
||||||
|
|
||||||
|
if (type.match(/webgl/i)) {
|
||||||
|
context = new GContextWebGL(this);
|
||||||
|
|
||||||
|
context.componentId = this.id;
|
||||||
|
|
||||||
|
if (!this._disableAutoSwap) {
|
||||||
|
const render = () => {
|
||||||
|
if (this._needRender) {
|
||||||
|
GCanvas.GBridge.render(this.id);
|
||||||
|
this._needRender = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
setInterval(render, 16);
|
||||||
|
}
|
||||||
|
|
||||||
|
GCanvas.GBridge.callSetContextType(this.id, 1); // 0 for 2d; 1 for webgl
|
||||||
|
} else if (type.match(/2d/i)) {
|
||||||
|
context = new GContext2D(this);
|
||||||
|
|
||||||
|
context.componentId = this.id;
|
||||||
|
|
||||||
|
// const render = ( callback ) => {
|
||||||
|
//
|
||||||
|
// const commands = context._drawCommands;
|
||||||
|
// context._drawCommands = '';
|
||||||
|
//
|
||||||
|
// GCanvas.GBridge.render2d(this.id, commands, callback);
|
||||||
|
// this._needRender = false;
|
||||||
|
// }
|
||||||
|
// //draw方法触发
|
||||||
|
// context._flush = render;
|
||||||
|
// //setInterval(render, 16);
|
||||||
|
|
||||||
|
GCanvas.GBridge.callSetContextType(this.id, 0);
|
||||||
|
} else {
|
||||||
|
throw new Error('not supported context ' + type);
|
||||||
|
}
|
||||||
|
|
||||||
|
return context;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
reset() {
|
||||||
|
GCanvas.GBridge.callReset(this.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,96 @@
|
||||||
|
let incId = 1;
|
||||||
|
|
||||||
|
const noop = function () { };
|
||||||
|
|
||||||
|
class GImage {
|
||||||
|
|
||||||
|
static GBridge = null;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this._id = incId++;
|
||||||
|
this._width = 0;
|
||||||
|
this._height = 0;
|
||||||
|
this._src = undefined;
|
||||||
|
this._onload = noop;
|
||||||
|
this._onerror = noop;
|
||||||
|
this.complete = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
get width() {
|
||||||
|
return this._width;
|
||||||
|
}
|
||||||
|
set width(v) {
|
||||||
|
this._width = v;
|
||||||
|
}
|
||||||
|
|
||||||
|
get height() {
|
||||||
|
return this._height;
|
||||||
|
}
|
||||||
|
|
||||||
|
set height(v) {
|
||||||
|
this._height = v;
|
||||||
|
}
|
||||||
|
|
||||||
|
get src() {
|
||||||
|
return this._src;
|
||||||
|
}
|
||||||
|
|
||||||
|
set src(v) {
|
||||||
|
|
||||||
|
if (v.startsWith('//')) {
|
||||||
|
v = 'http:' + v;
|
||||||
|
}
|
||||||
|
|
||||||
|
this._src = v;
|
||||||
|
|
||||||
|
GImage.GBridge.perloadImage([this._src, this._id], (data) => {
|
||||||
|
if (typeof data === 'string') {
|
||||||
|
data = JSON.parse(data);
|
||||||
|
}
|
||||||
|
if (data.error) {
|
||||||
|
var evt = { type: 'error', target: this };
|
||||||
|
this.onerror(evt);
|
||||||
|
} else {
|
||||||
|
this.complete = true;
|
||||||
|
this.width = typeof data.width === 'number' ? data.width : 0;
|
||||||
|
this.height = typeof data.height === 'number' ? data.height : 0;
|
||||||
|
var evt = { type: 'load', target: this };
|
||||||
|
this.onload(evt);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
addEventListener(name, listener) {
|
||||||
|
if (name === 'load') {
|
||||||
|
this.onload = listener;
|
||||||
|
} else if (name === 'error') {
|
||||||
|
this.onerror = listener;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
removeEventListener(name, listener) {
|
||||||
|
if (name === 'load') {
|
||||||
|
this.onload = noop;
|
||||||
|
} else if (name === 'error') {
|
||||||
|
this.onerror = noop;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
get onload() {
|
||||||
|
return this._onload;
|
||||||
|
}
|
||||||
|
|
||||||
|
set onload(v) {
|
||||||
|
this._onload = v;
|
||||||
|
}
|
||||||
|
|
||||||
|
get onerror() {
|
||||||
|
return this._onerror;
|
||||||
|
}
|
||||||
|
|
||||||
|
set onerror(v) {
|
||||||
|
this._onerror = v;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default GImage;
|
||||||
|
|
@ -0,0 +1,24 @@
|
||||||
|
|
||||||
|
export function ArrayBufferToBase64 (buffer) {
|
||||||
|
var binary = '';
|
||||||
|
var bytes = new Uint8ClampedArray(buffer);
|
||||||
|
for (var len = bytes.byteLength, i = 0; i < len; i++) {
|
||||||
|
binary += String.fromCharCode(bytes[i]);
|
||||||
|
}
|
||||||
|
return btoa(binary);
|
||||||
|
}
|
||||||
|
|
||||||
|
export function Base64ToUint8ClampedArray(base64String) {
|
||||||
|
const padding = '='.repeat((4 - base64String.length % 4) % 4);
|
||||||
|
const base64 = (base64String + padding)
|
||||||
|
.replace(/\-/g, '+')
|
||||||
|
.replace(/_/g, '/');
|
||||||
|
|
||||||
|
const rawData = atob(base64);
|
||||||
|
const outputArray = new Uint8ClampedArray(rawData.length);
|
||||||
|
|
||||||
|
for (let i = 0; i < rawData.length; ++i) {
|
||||||
|
outputArray[i] = rawData.charCodeAt(i);
|
||||||
|
}
|
||||||
|
return outputArray;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,39 @@
|
||||||
|
import GCanvas from './env/canvas';
|
||||||
|
import GImage from './env/image';
|
||||||
|
|
||||||
|
import GWebGLRenderingContext from './context-webgl/RenderingContext';
|
||||||
|
import GContext2D from './context-2d/RenderingContext';
|
||||||
|
|
||||||
|
import GBridgeWeex from './bridge/bridge-weex';
|
||||||
|
|
||||||
|
export let Image = GImage;
|
||||||
|
|
||||||
|
export let WeexBridge = GBridgeWeex;
|
||||||
|
|
||||||
|
export function enable(el, { bridge, debug, disableAutoSwap, disableComboCommands } = {}) {
|
||||||
|
|
||||||
|
const GBridge = GImage.GBridge = GCanvas.GBridge = GWebGLRenderingContext.GBridge = GContext2D.GBridge = bridge;
|
||||||
|
|
||||||
|
GBridge.callEnable(el.ref, [
|
||||||
|
0, // renderMode: 0--RENDERMODE_WHEN_DIRTY, 1--RENDERMODE_CONTINUOUSLY
|
||||||
|
-1, // hybridLayerType: 0--LAYER_TYPE_NONE 1--LAYER_TYPE_SOFTWARE 2--LAYER_TYPE_HARDWARE
|
||||||
|
false, // supportScroll
|
||||||
|
false, // newCanvasMode
|
||||||
|
1, // compatible
|
||||||
|
'white',// clearColor
|
||||||
|
false // sameLevel: newCanvasMode = true && true => GCanvasView and Webview is same level
|
||||||
|
]);
|
||||||
|
|
||||||
|
if (debug === true) {
|
||||||
|
GBridge.callEnableDebug();
|
||||||
|
}
|
||||||
|
if (disableComboCommands) {
|
||||||
|
GBridge.callEnableDisableCombo();
|
||||||
|
}
|
||||||
|
|
||||||
|
var canvas = new GCanvas(el.ref, { disableAutoSwap });
|
||||||
|
canvas.width = el.style.width;
|
||||||
|
canvas.height = el.style.height;
|
||||||
|
|
||||||
|
return canvas;
|
||||||
|
};
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -1,22 +1,19 @@
|
||||||
{
|
{
|
||||||
"id": "Sansnn-uQRCode",
|
"id": "Sansnn-uQRCode",
|
||||||
"displayName": "uQRCode 二维码生成插件",
|
"displayName": "uQRCode 全端二维码生成插件 支持nvue 支持nodejs服务端",
|
||||||
"version": "3.0.1",
|
"version": "4.0.6",
|
||||||
"description": "uQRCode 是一款使用方式简单，易于扩展的二维码生成插件。",
|
"description": "uQRCode是一款基于Javascript环境开发的二维码生成插件，适用所有Javascript运行环境的前端应用和Node.js。",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"uQRCode",
|
|
||||||
"二维码",
|
"二维码",
|
||||||
"qrcode"
|
"uQRCode",
|
||||||
|
"qrcode",
|
||||||
|
"qr"
|
||||||
],
|
],
|
||||||
"repository": "https://github.com/Sansnn/uQRCode",
|
"repository": "https://github.com/Sansnn/uQRCode",
|
||||||
"engines": {
|
"engines": {
|
||||||
"HBuilderX": "^3.1.0"
|
"HBuilderX": "^3.1.0"
|
||||||
},
|
},
|
||||||
"dcloudext": {
|
"dcloudext": {
|
||||||
"category": [
|
|
||||||
"JS SDK",
|
|
||||||
"通用 SDK"
|
|
||||||
],
|
|
||||||
"sale": {
|
"sale": {
|
||||||
"regular": {
|
"regular": {
|
||||||
"price": "0.00"
|
"price": "0.00"
|
||||||
|
|
@ -33,7 +30,8 @@
|
||||||
"data": "无",
|
"data": "无",
|
||||||
"permissions": "无"
|
"permissions": "无"
|
||||||
},
|
},
|
||||||
"npmurl": ""
|
"npmurl": "https://www.npmjs.com/package/uqrcodejs",
|
||||||
|
"type": "sdk-js"
|
||||||
},
|
},
|
||||||
"uni_modules": {
|
"uni_modules": {
|
||||||
"dependencies": [],
|
"dependencies": [],
|
||||||
|
|
@ -74,7 +72,7 @@
|
||||||
},
|
},
|
||||||
"Vue": {
|
"Vue": {
|
||||||
"vue2": "y",
|
"vue2": "y",
|
||||||
"vue3": "u"
|
"vue3": "y"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,210 +1,392 @@
|
||||||
# uQRCode
|
# 介绍
|
||||||
|
|
||||||
uQRCode 生成方式简单，可扩展性高，如有复杂需求可通过自定义组件或修改源码完成需求。已测试H5、微信小程序、iPhoneXsMax真机、华为P20Pro真机。
|
`uQRCode`是一款基于`Javascript`环境开发的二维码生成插件，适用所有`Javascript`运行环境的前端应用和`Node.js`应用。
|
||||||
|
|
||||||
支持自定义二维码渲染规则，可通过 `getModules` 方法得到矩阵信息后，自行实现canvas或view+css渲染二维码，如随机颜色、圆点、方块、块与块之间的间距等。
|
`uQRCode`可扩展性高，它支持自定义渲染二维码，可通过`uQRCode API`得到二维码绘制关键信息后，使用`canvas`、`svg`或`js`操作`dom`的方式绘制二维码图案。还可自定义二维码样式，如随机颜色、圆点、方块、块与块之间的间距等。
|
||||||
|
|
||||||
### 二维码
|
欢迎加入群聊【uQRCode交流群】：[695070434](https://jq.qq.com/?_wv=1027&k=JRjzDqiw)。
|
||||||
**什么是QR码**
|
|
||||||
|
|
||||||
QR码属于矩阵式二维码中的一个种类，由DENSO(日本电装)公司开发，由JIS和ISO将其标准化。
|
# 设计器
|
||||||
|
|
||||||
**QR码的特点**
|
uQRCode发布了配套的可视化设计器，可根据自己喜好在设计器中设计二维码样式，一键生成配置代码复制到项目中，详情请在微信小程序搜索“柚子二维码”，或扫描下方小程序码体验。
|
||||||
|
|
||||||
一是高速读取(QR就是取自“Quick Response”的首字母)，通过摄像头从拍摄到解码到显示内容也就三秒左右，对摄像的角度也没有什么要求；
|
|
||||||
|
|
||||||
二是高容量、高密度，理论上内容经过压缩处理后可以存7089个数字，4296个字母和数字混合字符，2953个8位字节数据，1817个汉字；
|
## 设计器模板示例
|
||||||
|
|
||||||
三是支持纠错处理，按照QR码的标准文档说明，QR码的纠错分为4个级别，分别是：
|
|
||||||
- level L : 最大 7% 的错误能够被纠正；
|
|
||||||
- level M : 最大 15% 的错误能够被纠正；
|
|
||||||
- level Q : 最大 25% 的错误能够被纠正；
|
|
||||||
- level H : 最大 30% 的错误能够被纠正；
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
四是结构化，看似无规则的图形，其实对区域有严格的定义。
|
# 快速上手
|
||||||
|
|
||||||
更多二维码介绍及原理：[https://blog.csdn.net/jason_ldh/article/details/11801355](https://blog.csdn.net/jason_ldh/article/details/11801355)
|
> 在`uni-app`中，我们更推荐使用组件方式来生成二维码，组件方式大大提高了页面的可读性以及避开了一些平台容易出问题的地方，当组件无法满足需求的时候，再考虑切换成原生方式。
|
||||||
|
|
||||||
### 简单使用
|
官方文档：[https://uqrcode.cn/doc](https://uqrcode.cn/doc)。
|
||||||
|
|
||||||
在 `template` 中创建 `<uqrcode/>`，并指定生成内容 `text`
|
github地址：[https://github.com/Sansnn/uQRCode](https://github.com/Sansnn/uQRCode)。
|
||||||
|
|
||||||
```html
|
npm地址：[https://www.npmjs.com/package/uqrcodejs](https://www.npmjs.com/package/uqrcodejs)。
|
||||||
<uqrcode ref="uQRCode" text="uQRCode 3.0" />
|
|
||||||
|
uni-app插件市场地址：[https://ext.dcloud.net.cn/plugin?id=1287](https://ext.dcloud.net.cn/plugin?id=1287)。
|
||||||
|
|
||||||
|
## 原生方式
|
||||||
|
|
||||||
|
原生方式仅需要获取`uqrcode.js`文件便可使用。详细配置请移步到：文档 > [原生](https://uqrcode.cn/doc/document/native.html)。
|
||||||
|
|
||||||
|
### 安装
|
||||||
|
|
||||||
|
1. 通过`npm`安装，成功后即可使用`import`或`require`进行引用。
|
||||||
|
``` bash
|
||||||
|
# npm安装
|
||||||
|
npm install uqrcodejs
|
||||||
|
# 或者
|
||||||
|
npm install @uqrcode/js
|
||||||
```
|
```
|
||||||
|
|
||||||
### 属性说明
|
2. 通过项目开源地址获取`uqrcode.js`，下载`uqrcode.js`后，将其复制到您项目指定目录，在页面中引入`uqrcode.js`文件即可开始使用。
|
||||||
|
|
||||||
|属性名 |类型 |可选值 |默认值 |是否必填 |说明 |
|
### 引入
|
||||||
|--- |--- |--- |--- |--- |:--- |
|
|
||||||
|id |String |- |随机生成 |否 |组件标识/canvasId |
|
|
||||||
|mode |String |canvas/view |canvas |否 |生成模式 |
|
|
||||||
|text |String |- |- |是 |二维码内容 |
|
|
||||||
|size |Number |- |256 |否 |二维码大小，单位px |
|
|
||||||
|margin |Number |- |0 |否 |填充边距，单位px |
|
|
||||||
|backgroundColor |String |- |#FFFFFF |否 |背景色 |
|
|
||||||
|foregroundColor |String |- |#000000 |否 |前景色 |
|
|
||||||
|errorCorrectLevel|String/Number|L/M/Q/H/1/0/3/2 |H |否 |纠错等级L/M/Q/H分别对应1/0/3/2 |
|
|
||||||
|typeNumber |Number |- |-1 |否 |版本 |
|
|
||||||
|fileType |String |png/jpg |png |否 |导出的文件类型 |
|
|
||||||
|
|
||||||
### 方法说明
|
- 通过`import`引入。
|
||||||
|
``` javascript
|
||||||
|
// npm安装
|
||||||
|
import UQRCode from 'uqrcodejs'; // npm install uqrcodejs
|
||||||
|
// 或者
|
||||||
|
import UQRCode from '@uqrcode/js'; // npm install @uqrcode/js
|
||||||
|
```
|
||||||
|
|
||||||
|方法名|说明|
|
- `Node.js`通过`require`引入。
|
||||||
|---|:---|
|
``` javascript
|
||||||
|[toTempFilePath](#totempfilepathobject)|导出临时文件路径|
|
// npm安装
|
||||||
|[save](#saveobject)|保存二维码|
|
const UQRCode = require('uqrcodejs'); // npm install uqrcodejs
|
||||||
|
// 或者
|
||||||
|
const UQRCode = require('@uqrcode/js'); // npm install @uqrcode/js
|
||||||
|
```
|
||||||
|
|
||||||
### toTempFilePath(OBJECT)
|
- 原生浏览器环境，在js脚本加载时添加到`window`。
|
||||||
|
``` html
|
||||||
|
<script type="text/javascript" src="uqrcode.js"></script>
|
||||||
|
<script>
|
||||||
|
var UQRCode = window.UQRCode;
|
||||||
|
</script>
|
||||||
|
```
|
||||||
|
|
||||||
导出临时文件路径
|
### 简单用法
|
||||||
|
|
||||||
**OBJECT参数说明**
|
`uQRCode`基于`Canvas API`封装了一套方法，建议开发者使用`canvas`生成，一键调用，非常方便。以下是示例：
|
||||||
|
|
||||||
|参数 |类型 |必填 |默认值 |说明 |
|
- HTML示例
|
||||||
|--- |--- |--- |--- |:--- |
|
- DOM部分
|
||||||
|success |Function |否 |- |方法调用成功的回调函数 |
|
``` html
|
||||||
|fail |Function |否 |- |方法调用失败的回调函数 |
|
<canvas id="qrcode" width="200" height="200"></canvas>
|
||||||
|complete |Function |否 |- |方法调用结束的回调函数（调用成功、失败都会执行） |
|
```
|
||||||
|
|
||||||
#### 示例
|
- JS部分
|
||||||
|
``` javascript
|
||||||
|
// 获取uQRCode实例
|
||||||
|
var qr = new UQRCode();
|
||||||
|
// 设置二维码内容
|
||||||
|
qr.data = "https://uqrcode.cn/doc";
|
||||||
|
// 设置二维码大小，必须与canvas设置的宽高一致
|
||||||
|
qr.size = 200;
|
||||||
|
// 调用制作二维码方法
|
||||||
|
qr.make();
|
||||||
|
// 获取canvas元素
|
||||||
|
var canvas = document.getElementById("qrcode");
|
||||||
|
// 获取canvas上下文
|
||||||
|
var canvasContext = canvas.getContext("2d");
|
||||||
|
// 设置uQRCode实例的canvas上下文
|
||||||
|
qr.canvasContext = canvasContext;
|
||||||
|
// 调用绘制方法将二维码图案绘制到canvas上
|
||||||
|
qr.drawCanvas();
|
||||||
|
```
|
||||||
|
|
||||||
|
- uni-app示例
|
||||||
|
- Template部分
|
||||||
|
``` html
|
||||||
|
<canvas id="qrcode" canvas-id="qrcode" style="width: 200px;height: 200px;"></canvas>
|
||||||
|
```
|
||||||
|
|
||||||
|
- JS部分
|
||||||
|
``` javascript
|
||||||
|
onReady() {
|
||||||
|
// 获取uQRCode实例
|
||||||
|
var qr = new UQRCode();
|
||||||
|
// 设置二维码内容
|
||||||
|
qr.data = "https://uqrcode.cn/doc";
|
||||||
|
// 设置二维码大小，必须与canvas设置的宽高一致
|
||||||
|
qr.size = 200;
|
||||||
|
// 调用制作二维码方法
|
||||||
|
qr.make();
|
||||||
|
// 获取canvas上下文
|
||||||
|
var canvasContext = uni.createCanvasContext('qrcode', this); // 如果是组件，this必须传入
|
||||||
|
// 设置uQRCode实例的canvas上下文
|
||||||
|
qr.canvasContext = canvasContext;
|
||||||
|
// 调用绘制方法将二维码图案绘制到canvas上
|
||||||
|
qr.drawCanvas();
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
- 微信小程序，推荐使用Canvas 2D，关于Canvas 2D的使用请参考微信开放文档。
|
||||||
|
|
||||||
|
### 高级用法
|
||||||
|
|
||||||
|
考虑到部分平台可能不支持`canvas`，所以`uQRCode`并没有强制要求和`canvas`一起使用，您还可以选择其他方式来生成二维码，例如使用`js`操作`dom`进行绘制或是使用`svg`绘制等。以下是示例：
|
||||||
|
|
||||||
|
- uni-app v-for+view
|
||||||
|
|
||||||
```html
|
```html
|
||||||
<template>
|
<template>
|
||||||
<view>
|
<view>
|
||||||
<uqrcode ref="uQRCode" text="uQRCode 3.0" />
|
<view class="qrcode">
|
||||||
<button @click="toTempFilePath">导出临时文件路径</button>
|
<view v-for="(row, rowI) in modules" :key="rowI" style="display: flex;flex-direction: row;">
|
||||||
|
<view v-for="(col, colI) in row" :key="colI">
|
||||||
|
<view v-if="col.isBlack" style="width: 10px;height: 10px;background-color: black;">
|
||||||
|
<!-- 黑色码点 -->
|
||||||
|
</view>
|
||||||
|
<view v-else style="width: 10px;height: 10px;background-color: white;">
|
||||||
|
<!-- 白色码点 -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
```
|
|
||||||
|
|
||||||
```javascript
|
<script>
|
||||||
export default {
|
import UQRCode from '../../uni_modules/Sansnn-uQRCode/js_sdk/uqrcode/uqrcode.js';
|
||||||
methods: {
|
|
||||||
toTempFilePath() {
|
|
||||||
this.$refs.uQRCode.toTempFilePath({
|
|
||||||
success: res => {
|
|
||||||
console.log(res)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### save(OBJECT)
|
|
||||||
|
|
||||||
保存二维码
|
|
||||||
|
|
||||||
**OBJECT参数说明**
|
|
||||||
|
|
||||||
|参数 |类型 |必填 |默认值 |说明 |
|
|
||||||
|--- |--- |--- |--- |:--- |
|
|
||||||
|success |Function |否 |- |方法调用成功的回调函数 |
|
|
||||||
|fail |Function |否 |- |方法调用失败的回调函数 |
|
|
||||||
|complete |Function |否 |- |方法调用结束的回调函数（调用成功、失败都会执行） |
|
|
||||||
|
|
||||||
#### 示例
|
|
||||||
|
|
||||||
```html
|
|
||||||
<template>
|
|
||||||
<view>
|
|
||||||
<uqrcode ref="uQRCode" text="uQRCode 3.0" />
|
|
||||||
<button @click="save">保存二维码</button>
|
|
||||||
</view>
|
|
||||||
</template>
|
|
||||||
```
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
export default {
|
|
||||||
methods: {
|
|
||||||
save() {
|
|
||||||
this.$refs.uQRCode.save({
|
|
||||||
success: res => {
|
|
||||||
console.log(res)
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
```
|
|
||||||
|
|
||||||
### 高级使用
|
|
||||||
|
|
||||||
在 `template` 中创建 `<canvas/>` 并设置 `id`，画布宽高
|
|
||||||
|
|
||||||
```html
|
|
||||||
<canvas id="qrcode" canvas-id="qrcode" :style="{'width': `${size}px`, 'height': `${size}px`}" />
|
|
||||||
```
|
|
||||||
|
|
||||||
在 `script` 中引用js文件并调用方法生成矩阵
|
|
||||||
|
|
||||||
```javascript
|
|
||||||
import uQRCode from '@/uni_modules/Sansnn-uQRCode/components/uqrcode/common/uqrcode.js'
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
size: 256,
|
modules: []
|
||||||
margin: 10,
|
|
||||||
backgroundColor: '#FFFFFF',
|
|
||||||
foregroundColor: '#000000'
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onReady() {
|
onLoad() {
|
||||||
let modules = uQRCode.getModules({
|
const qr = new UQRCode();
|
||||||
text: 'uQRCode 3.0',
|
qr.data = 'uQRCode';
|
||||||
errorCorrectLevel: uQRCode.errorCorrectLevel.H
|
qr.make();
|
||||||
})
|
this.modules = qr.modules;
|
||||||
let tileSize = (this.size - this.margin * 2) / modules.length
|
},
|
||||||
// 获取绘图所需的上下文
|
methods: {
|
||||||
let ctx = uni.createCanvasContext('qrcode', this)
|
|
||||||
// 开始绘制
|
|
||||||
ctx.setFillStyle(this.backgroundColor)
|
|
||||||
ctx.fillRect(0, 0, this.size, this.size)
|
|
||||||
for (var row = 0; row < modules.length; row++) {
|
|
||||||
for (var col = 0; col < modules.length; col++) {
|
|
||||||
// 计算每一个小块的位置
|
|
||||||
var x = col * tileSize + this.margin
|
|
||||||
var y = row * tileSize + this.margin
|
|
||||||
var w = tileSize
|
|
||||||
var h = tileSize
|
|
||||||
|
|
||||||
var style = modules[row][col] ? this.foregroundColor : this.backgroundColor
|
|
||||||
ctx.setFillStyle(style)
|
|
||||||
ctx.fillRect(x, y, w, h)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
ctx.draw()
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
</script>
|
||||||
```
|
```
|
||||||
|
|
||||||
### uqrcode.js 方法说明
|
- js操作dom
|
||||||
|
|
||||||
|方法名|说明|
|
``` html
|
||||||
|---|:---|
|
<!DOCTYPE html>
|
||||||
|[getModules](#getmodulesoptions)|可以得到二维码矩阵信息，可根据返回的矩阵信息自行实现二维码生成|
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>uQRCode二维码生成</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="qrcode" style="position: relative;"></div>
|
||||||
|
<script type="text/javascript" src="uqrcode.js"></script>
|
||||||
|
<script>
|
||||||
|
// 引入uQRCode
|
||||||
|
var UQRCode = window.UQRCode;
|
||||||
|
// 获取uQRCode实例
|
||||||
|
var qr = new UQRCode();
|
||||||
|
// 设置二维码内容
|
||||||
|
qr.data = "https://uqrcode.cn/doc";
|
||||||
|
// 设置二维码大小，必须与canvas设置的宽高一致
|
||||||
|
qr.size = 200;
|
||||||
|
// 设置二维码前景图，可以是路径
|
||||||
|
qr.foregroundImageSrc =
|
||||||
|
'data:image/png;base64,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';
|
||||||
|
// 调用制作二维码方法
|
||||||
|
qr.make();
|
||||||
|
|
||||||
### getModules(options)
|
var drawModules = qr.getDrawModules();
|
||||||
|
// 遍历drawModules创建dom元素
|
||||||
|
var qrHtml = '';
|
||||||
|
for (var i = 0; i < drawModules.length; i++) {
|
||||||
|
var drawModule = drawModules[i];
|
||||||
|
switch (drawModule.type) {
|
||||||
|
case 'tile':
|
||||||
|
/* 绘制小块 */
|
||||||
|
qrHtml += `<div style="position: absolute;left: ${drawModule.x}px;top: ${drawModule.y}px;width: ${drawModule.width}px;height: ${drawModule.height}px;background: ${drawModule.color};"></div>`;
|
||||||
|
break;
|
||||||
|
case 'image':
|
||||||
|
/* 绘制图像 */
|
||||||
|
qrHtml += `<img style="position: absolute;left: ${drawModule.x}px;top: ${drawModule.y}px;width: ${drawModule.width}px;height: ${drawModule.height}px;" src="${drawModule.imageSrc}" />`;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
document.getElementById('qrcode').innerHTML = qrHtml;
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
根据内容得到二维码矩阵信息
|
- svg
|
||||||
|
``` html
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>uQRCode二维码生成</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<svg id="qrcode" width="200" height="200" xmlns="http://www.w3.org/2000/svg" version="1.1"></svg>
|
||||||
|
<script type="text/javascript" src="uqrcode.js"></script>
|
||||||
|
<script>
|
||||||
|
// 引入uQRCode
|
||||||
|
var UQRCode = window.UQRCode;
|
||||||
|
// 获取uQRCode实例
|
||||||
|
var qr = new UQRCode();
|
||||||
|
// 设置二维码内容
|
||||||
|
qr.data = "https://uqrcode.cn/doc";
|
||||||
|
// 设置二维码大小，必须与canvas设置的宽高一致
|
||||||
|
qr.size = 200;
|
||||||
|
// 设置二维码前景图，可以是路径
|
||||||
|
qr.foregroundImageSrc =
|
||||||
|
'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAYAAABw4pVUAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAC3xJREFUeJztnd1vFNcZxodSJ3y3EL7SYIQwu15wI5FSAkqVkISKgEkuSIEC6127RrloL9r8D4n5UFUZp/9C24A/okqUOzCmSdoohQtkXIkiRS1VC7YQF41Kbe/unL7PzHt2z45ndnZmd1l75hzrSSwzMzvn+c15z8ee3dcwdIlkWaRlqSnF62a+4dDiiMtZ36cKyc183NQ3WS2sZ2IqWX/phwTWEDhuEKT5S0hLSctJK1grWasiLllPWe9l7MUSowTJDU7oopKVICSEZXwz3yKtJj1HWkdaT9pA2hgTbeA6r2MPVrMnEpCEI8HU1FpUGC18cbQEPB1r+Ea+Q2olbSFtJbWREqxkxCXr2cZ1hwebSM+zN2vYq+XsXYtRQ2uRJ8hWgaa4kl8ET0Ur30SK9F3STtL3SLtJL5P2kPZGXHu4rru57vCgg9TO3mxir1azd0uNUmuRUALBWKzAAOm1pBcM+4nYwTeBG3uNtJ/0FukQqZP0NuudiErWr5PrfID0JulVwwb1Enu0lT1byx6qUKpqJWoH3qLAQIzcbNhNFU/CKwzhMOld0o9JaVKW1EP6CamXdDqi6uU69nCdUffjpCPsyZvs0U72bDN7KKHI8OULRcIAQcQ9NDXQRYhCeNpF2ocXPXjw4M8uX748eP/+/b9NT08/ETEv8ABekCcXDx069FMGs489SzGUtezpEqPK0KWGKnRGiH8vMGVc+I1UKnXy3r17N5ttwHwvd+/e/bKjo+Mkt5bvG3bfAi/RD69gj2Ur8YQhO/Il3LzQKbVx09t35MiR9x4/fvzvZld2oRTy6l8HDhxAiHvdsPsVeInhMobGSw2fvkTtO5YxSYQqdE6Ih4cnJiY+b3YlF1q5ffv2p4Y9APiBYY/CELqe4wj0TKWwpYYrxLn1TBSjqf1Hjx79eYGK3w1sGz4VK/kVeHbs2LFfkIc/ZC/b2FtEoGcrhS01XKFJYdKHzghD28NjY2N/0BDCwSHvrnAreYU9RV/ybUfY8gSyVAlXmPRhnvHuw4cP/65hhIPy4MGDf5CHPzLsUdeLHLbWVAKi9h/LOcZtMezOHPONE25D22ZXfr7KWeAdeXiSw9ZO9nYte91iuPQjEgj6DwzJMInBLBNDXczA07p1hAeCQh52sZe7lH5EDn99geDgbYa9ToOlgayGURsU8rCbvdzN3voCUUdYmH9gJRPrMphx9mggNQPpYS/3sLcb2GvXCaITyEYFCEYHvRpIzUB62UsJZGO1QFbxwVgu2auB1B3IXvZ2I3sdGAiWm09rIDUDOc1eaiAaSEWlHQp7ntc1Kh0XRlEHMtQ1V2HPm3N+uvJxYRQSyoIB0j6Ymash/0onyBy3c5MkeUzS45haFFEg9pOLCk6LgsgJs0xPxKxIDbu1lNITn7l2hs7N0U/p/Bn6vf/OkEgM28dcuDMy59rhlbfuKzmUCdaSFxoQVNZZUHk/INlrZ+mo8tV/k34GCMI2BvLRnU/mXDt8MQlHLs5AMhWBdI+e00CeJpDtw9lQQD7SQBoBJCdSQ+FaSHVA5r6m/xExB6KOtBIj6boBMemUWTNntUIvTZP1pmnOuboG0gAgOKebBgQpeu3UYNZVHRd7ilA0kAYDwTHZ0TPWtXBdN7XTuTlqRc4zNZAGAelmIF73ZwPJayBOICUQ9evUqwYiNBAFCM3U6d+bBSTlASSngTSrhaTFZ1Pj4k+TE+LPk39lTYhPJ8et9bEYAslb85BmAYESCJmkJC9YQok4LC66AUGsbqfhpysQa42ri0ZKtY6yqrxPfj0oEd3l98pA/idmRM+1cyJ7vc9Tv/ziY5rgFQhJ6fzq5iGmOP+X34nM9Q+L18qQuki7fv9e8f4y1z4Q6bEPRfqPfSJ9g/597Az9rY+um41fyMKELFeA2bbhc1UQecAwTQtCECA4JmedW37tWfpv1/UPrPtDuHwi/kvwgM8Wjp+hR2X7pTgC4Se5UjGLP+V/81/LkhDKC/6GloJ7w7B31pwph02/YrJovUkVNyDVFJNNDA7EvRSB0HlJC0hOOJcY8zRZTGkg7sVUJP9gAxkuARkPCGS0z+q4k4MAMivKgJgxATLDz3mYH+eZCEMDAMKGDYyPVH0tvBUMIEkJhPqLvBBlr5WnMLb9UoRHWRjb908Mi4GJESvU1KZhC8YJ6pgTDCRNIylce8DnXBxzge7jjSvv88QvI341fkn00/UusHD9/vFhe6YePSAlJZRxfs0aknMFBXzA8+VWn4TrvYar44ICUvd9U04goc4PvyFuAQNJW+HhghU2Pqld1IGjz0CYkrsM0zRqCnc995DYf2eQW3TwXYzzHEjtoyy30uhdJ7Fd7Q1vmd4GVCzzBYjeBsRFA4kwEGzVyftMGPPFlaxgi4s4vGD6Xd1l4miaYpomhqUN17Hp1E1rHQlbdbKjZ0W3m66fE+e//K29ahsQCGCcvfUbmpWfcb+2i3AfOB7L720jJwPWdcED4XcMBzOe23QgLJXbS+gqyiqACNMyN1FhG5Cr6Pi2EfcJY2yAVLoG1p0KjnPr+RZuvRURIN4fLfMC4jfs1UBqAeK5tNFlvfWqgTxFIDsuZSt+tKyHOli87ZoXpbdhc9YnqJT3QzSQ+gCBaV8U90O5a+irMWolNPLB5gP8n0JYF+n1K+8XW5IGUicg1ZTPpyZEu/WhHu9VWw2kKUBcOv0KQDAl7L16TrQPZQKqy9px0jYS7jPr8QEyZzPdqcothF5umrDMWgshwX7+Y20D6o7f0ollnB+QyQnryW0LCoShlJZdqhP2is0QyFiuZeG7TnPWNrWCpz6bvE1AsmRQt/UBUfyOkJL0AVJLwagudkBMq+Kz4sWPs9b+3hSMdihFELJXz1trXnkIXx5g5kUuVxAD40MaSG1A8qIsNNDPDJmMz/p5rTfh/OzVPguCiaVhbCnFulbBFL8eL98G5Ni9FbogzM2aCFmnot2pP6HIPGt9IkRqRnxtPqF/6/asNBb4eq7iqzVmLJOKn6Cl3/uphST4Kb5AcMo/YVuoQXnxNb3ijsFgLWOBACk9ZUk5rEQ/MIw+ICO2Y9lkxP989BkpGvWkBruLn6BNKMNf/J4sqqs2DWWs19kazeV3RRW38TTgvCZJA5lnWjhAYiINZJ6pkUD018TWB0jor4nVX6TcWCCBv0hZf9V4Y4D0GAG/alx/GX9jgQT+Mn6drqJBMBiIM13FumqA6IQuDQDikdBFJgZzTegiociUR8hfWJbyaGpq6p+6lQSHgRIm5ZEKRCYFQ9bjYlKwGzdu6KRgIWCguCQFQ8K1qpKCqSOt9dyPICHi/uPHj+u0eQEgyALPkHLQmJs2Dx77ps2rlFiy89atW9d870CXsnLz5s1RpXUETiyphi2ZehWtxEq9unnz5mOPHj263+xKLpQyOTn5VWtrKzJp7zPKU6/KrNG+abzVsOWanLijo+OETk7sX+AREjkb7smJZevwDFfOsAVyiG9e6bs7OX33RZ2+2y5K+u5LnL6706hT+m61L1ET3Lca7gnukdRdJ7ivnOC+1QiZ4F6FIkOXhAK6aHKIg+joMWLAkPg1vgHMQrE0gCfjbdY7EZWsXyfX+QB78Kphr1W9xB5tZc/WKjDgqW/f4SxqBy+hoKkh/qGj38QvhriIySOeBADCOs3LfFN7I649XNfdXHd40MGebGWP4NVq9k6F4Ruq3IraUtDEEPfQGYE0wGAsjckjmuMWvgm0ngQrGXHJerZx3bewF8+zN2vYK3j2rBEwTLmVRUY5FNlaAAbzFFDHjB5PAMbV6/hG8FRsjIk2cJ3XsQer2ZOV7NESo9QqVBihgMiidvQSTItRgoOmiKdgBWsla1XEJesp672MvZAQWowSCBmiagKhlkUOqXAkIAkpjpL1l344IdQVhrM4X0SFpGpxxOWsr5cvTSleNxM36RK18n+GJEwNAYal3QAAAABJRU5ErkJggg==';
|
||||||
|
// 调用制作二维码方法
|
||||||
|
qr.make();
|
||||||
|
|
||||||
|参数 |类型 |必填 |默认值 |说明 |
|
var drawModules = qr.getDrawModules();
|
||||||
|--- |--- |--- |--- |:--- |
|
// 遍历drawModules创建svg元素
|
||||||
|text |String |是 |- |二维码内容 |
|
var qrHtml = '';
|
||||||
|errorCorrectLevel|Number |否 |2 |纠错等级，1/0/3/2分别对应L/M/Q/H |
|
for (var i = 0; i < drawModules.length; i++) {
|
||||||
|typeNumber |Number |否 |-1 |版本 |
|
var drawModule = drawModules[i];
|
||||||
|
switch (drawModule.type) {
|
||||||
|
case 'tile':
|
||||||
|
/* 绘制小块 */
|
||||||
|
qrHtml += `<rect x="${drawModule.x}" y="${drawModule.y}" width="${drawModule.width}" height="${drawModule.height}" style="fill: ${drawModule.color};" />`;
|
||||||
|
break;
|
||||||
|
case 'image':
|
||||||
|
/* 绘制图像 */
|
||||||
|
qrHtml += `<image href="${drawModule.imageSrc}" x="${drawModule.x}" y="${drawModule.y}" width="${drawModule.width}" height="${drawModule.height}" />`;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
document.getElementById('qrcode').innerHTML = qrHtml;
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
```
|
||||||
|
|
||||||
### 常见问题
|
> 更多用法大家自行探索咯，期待分享哟~
|
||||||
**关于高级使用二维码生成不完整**
|
|
||||||
|
|
||||||
size的单位是px，请尽量避免使用rpx，如果canvas的单位是rpx，那么不同设备屏幕分辨率不一样，rpx转换成px后的画布尺寸不足以放下全部内容，实际绘制图案超出，就会出现不完整或者没有填充完整画布的情况。
|
### 导出临时文件路径
|
||||||
|
|
||||||
**如何扫码跳转指定网页**
|
原生方式基于`Canvas`的，请自行参阅各平台`Canvas`的导出方式。以下是部分示例：
|
||||||
|
|
||||||
text参数直接放入完整的网页地址即可，例如：`https://ext.dcloud.net.cn/plugin?id=1287`。微信客户端不能是ip地址。
|
- uni-app
|
||||||
|
```javascript
|
||||||
|
// 通过uni.createCanvasContext方式创建绘制上下文的，对应导出API为uni.canvasToTempFilePath
|
||||||
|
// 调用完ctx.draw()方法后不能第一时间导出，否则会异常，需要有一定的延时
|
||||||
|
setTimeout(() => {
|
||||||
|
uni.canvasToTempFilePath(
|
||||||
|
{
|
||||||
|
canvasId: this.canvasId,
|
||||||
|
fileType: this.fileType,
|
||||||
|
width: this.canvasWidth,
|
||||||
|
height: this.canvasHeight,
|
||||||
|
success: res => {
|
||||||
|
console.log(res);
|
||||||
|
},
|
||||||
|
fail: err => {
|
||||||
|
console.log(err);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// this // 组件内使用必传当前实例
|
||||||
|
);
|
||||||
|
}, 300);
|
||||||
|
```
|
||||||
|
|
||||||
**H5长按识别**
|
- Canvas2D
|
||||||
|
```javascript
|
||||||
|
// 得到base64
|
||||||
|
console.log(canvas.toDataURL());
|
||||||
|
// 得到buffer
|
||||||
|
console.log(canvas.toBuffer());
|
||||||
|
```
|
||||||
|
|
||||||
canvas无法长按识别，长按识别需要是图片才行，所以需要先调用`toTempFilePath`方法得到临时路径，再用image组件显示即可。
|
### 保存二维码到本地相册
|
||||||
|
|
||||||
|
必须在导出临时文件路径成功后再执行保存。uni-app通用保存方式（H5除外）：
|
||||||
|
```javascript
|
||||||
|
uni.saveImageToPhotosAlbum({
|
||||||
|
filePath: tempFilePath,
|
||||||
|
success: res => {
|
||||||
|
console.log(res);
|
||||||
|
},
|
||||||
|
fail: err => {
|
||||||
|
console.log(err);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
H5可以通过设置`<a>`标签`href`属性的方式进行保存：
|
||||||
|
```javascript
|
||||||
|
const aEle = document.createElement('a');
|
||||||
|
aEle.download = 'uQRCode'; // 设置下载的文件名，默认是'下载'
|
||||||
|
aEle.href = tempFilePath;
|
||||||
|
document.body.appendChild(aEle);
|
||||||
|
aEle.click();
|
||||||
|
aEle.remove(); // 下载之后把创建的元素删除
|
||||||
|
```
|
||||||
|
经过测试，PC端浏览器可以下载，部分安卓自带或第三方浏览器可以下载，安卓微信浏览器不适用，移动端iOS所有浏览器均不适用，差异较大，还是推荐各位导出文件给图片组件显示，然后提示用户通过长按图片进行保存这种方式。
|
||||||
|
|
||||||
|
## uni-app组件方式
|
||||||
|
|
||||||
|
### 安装
|
||||||
|
|
||||||
|
通过uni-app插件市场地址安装：[https://ext.dcloud.net.cn/plugin?id=1287](https://ext.dcloud.net.cn/plugin?id=1287)。详细配置请移步到：文档 > [uni-app组件](https://uqrcode.cn/doc/document/uni-app.html)。
|
||||||
|
|
||||||
|
### 引入
|
||||||
|
|
||||||
|
uni-app默认为easycom模式，可直接键入`<uqrcode>`标签。
|
||||||
|
|
||||||
|
### 简单用法
|
||||||
|
|
||||||
|
安装`uqrcode`组件后，在`template`中键入`<uqrcode/>`。设置`ref`属性可使用组件内部方法，`canvas-id`属性为组件内部的canvas组件标识，`value`属性为二维码生成对应内容，`options`为配置选项，可配置二维码样式，绘制Logo等，详见：[options](https://uqrcode.cn/doc/document/uni-app.html#options) 。
|
||||||
|
|
||||||
|
``` html
|
||||||
|
<uqrcode ref="uqrcode" canvas-id="qrcode" value="https://uqrcode.cn/doc" :options="{ margin: 10 }"></uqrcode>
|
||||||
|
```
|
||||||
|
|
||||||
|
### 导出临时文件路径
|
||||||
|
|
||||||
|
为了保证方法调用成功，请在 [complete](https://uqrcode.cn/doc/document/uni-app.html#complete) 事件返回`success=true`后调用。
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
// uqrcode为组件的ref名称
|
||||||
|
this.$refs.uqrcode.toTempFilePath({
|
||||||
|
success: res => {
|
||||||
|
console.log(res);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
### 保存二维码到本地相册
|
||||||
|
|
||||||
|
为了保证方法调用成功，请在 [complete](https://uqrcode.cn/doc/document/uni-app.html#complete) 事件返回`success=true`后调用。
|
||||||
|
|
||||||
|
```javascript
|
||||||
|
// uqrcode为组件的ref名称
|
||||||
|
this.$refs.uqrcode.save({
|
||||||
|
success: () => {
|
||||||
|
uni.showToast({
|
||||||
|
icon: 'success',
|
||||||
|
title: '保存成功'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
```
|
||||||
|
|
||||||
|
## 更多使用说明请前往官方文档查看：[https://uqrcode.cn/doc](https://uqrcode.cn/doc)。
|
||||||
Loading…
Reference in New Issue