You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
455 lines
12 KiB
455 lines
12 KiB
<template>
|
|
<view class="orgvzone">
|
|
<!-- 机构认证 -->
|
|
<!-- 第一步 选择需要认证的类型 -->
|
|
<view class="vfbox" v-if="step==1">
|
|
<view class="vftit">机构认证</view>
|
|
<view class="vfitem" :class="vfindex==1?'selected':''" @click="vfselitem(1)">
|
|
<view class="vfi-tit">公共文化机构</view>
|
|
<view class="vfi-desc">
|
|
<view>公共文化是相对经营文化而言，是为满足社会的共同需要而形成的文化形态，强调的是以社会全体公众为服务对象的公共行政职能。</view>
|
|
<view class="">如：博物馆、美术馆、图书馆、文化馆及街道、社区各级文化活动站（室）</view>
|
|
</view>
|
|
</view>
|
|
<view class="vfitem" :class="vfindex==2?'selected':''" @click="vfselitem(2)">
|
|
<view class="vfi-tit">文化生产机构</view>
|
|
<view class="vfi-desc">
|
|
<view>文化生产机构是指从事文化工作，具有法人资格，以创作生产某种业态文化数字内容为目标的文化机构；比如是出版社、影视公司、演出公司、设计公司等</view>
|
|
</view>
|
|
</view>
|
|
<view class="vfitem" :class="vfindex==3?'selected':''" @click="vfselitem(3)">
|
|
<view class="vfi-tit">高校科研机构</view>
|
|
<view class="vfi-desc">
|
|
<view>高校科研机构是指经过学校上级主管部门或者学校正式下文批准成立的，一般分为实体性科研机构和非实体性科研机构</view>
|
|
<view>如：实验室、研究室、研究所、研究中心、研究院、研究基地等</view>
|
|
</view>
|
|
</view>
|
|
<view class="vfitem" :class="vfindex==4?'selected':''" @click="vfselitem(4)">
|
|
<view class="vfi-tit">其它</view>
|
|
<view class="vfi-desc">
|
|
<view>其他 - 通常指经营类企业。</view>
|
|
</view>
|
|
</view>
|
|
<!-- 立即认证 -->
|
|
<view class="vfbtn" v-if="vfindex>0">
|
|
<button @click="gotostep(2)">立即认证</button>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<!-- step 2 -->
|
|
<view class="vfbox" v-if="step==2">
|
|
<view class="form-item">
|
|
<input class="form-item--input" v-model="Organizationcode" maxlength="18" placeholder="统一社会信用代码"/>
|
|
</view>
|
|
<view class="vfbtn">
|
|
<button @click="chkinput()">下一步</button>
|
|
</view>
|
|
</view>
|
|
<!-- step 3 -->
|
|
<view class="vfbox" v-if="step==3">
|
|
|
|
<view class="ver-form">
|
|
<view class="form-item sfsel">
|
|
<view class="sf-tit">选择身份</view>
|
|
<view class="sf-item">
|
|
<view class="sfiv" :class="{ active: sfval == 10 }" @click="selsf(10)">法 人</view>
|
|
<view class="sfiv" :class="{ active: sfval == 20 }" @click="selsf(20)">经办人</view>
|
|
</view>
|
|
</view>
|
|
<!-- 如果是代办，需要下面的 -->
|
|
<view v-if="sfval==20">
|
|
<!-- 经办人授权委托书 预览图 -->
|
|
<view class="image-list" v-if="jfr_entfile!=''">
|
|
<view class="image-preview" v-for="(image, imageIndex) in jfr_entfile[0]">
|
|
<image class="image" mode="aspectFill" :src="image.path"></image>
|
|
</view>
|
|
</view>
|
|
<view class="form-item" v-else>
|
|
<button class="form-item--input" @click="chooseImage('jfr_entfile')">上传经办人授权委托书</button>
|
|
</view>
|
|
<!-- 经办人身份证扫描件（需盖章） -->
|
|
<!-- 预览图 -->
|
|
<view class="image-list" v-if="jfr_idafile!=''">
|
|
<view class="image-preview" v-for="(image, imageIndex) in jfr_idafile[0]">
|
|
<image class="image" mode="aspectFill" :src="image.path"></image>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="form-item" v-else>
|
|
<button class="form-item--input" @click="chooseImage('jfr_idafile')">经办人身份证扫描件（需盖章）国徽面</button>
|
|
</view>
|
|
|
|
<!-- 经办人身份证扫描件（需盖章） 预览图 -->
|
|
<view class="image-list" v-if="jfr_idbfile!=''">
|
|
<view class="image-preview" v-for="(image, imageIndex) in jfr_idbfile[0]">
|
|
<image class="image" mode="aspectFill" :src="image.path"></image>
|
|
</view>
|
|
</view>
|
|
<view class="form-item" v-else>
|
|
<button class="form-item--input" @click="chooseImage('jfr_idbfile')">经办人身份证扫描件（需盖章）头像面</button>
|
|
</view>
|
|
<!-- 经办人姓名 -->
|
|
<view class="form-item">
|
|
<input class="form-item--input" v-model="managerName" autocomplete="off" placeholder="经办人姓名" />
|
|
</view>
|
|
<!-- 经办人身份证号 -->
|
|
<view class="form-item">
|
|
<input class="form-item--input" v-model="managerIdnum" autocomplete="off" placeholder="经办人身份证号" />
|
|
</view>
|
|
</view>
|
|
<!-- 公用表单部分 -->
|
|
<!-- 机构名称 -->
|
|
<view class="form-item">
|
|
<input class="form-item--input" v-model="name" autocomplete="off" placeholder="机构名称" />
|
|
</view>
|
|
<!-- 行业类别 -->
|
|
<view class="form-item">
|
|
<select class="form-item--input" v-model="industryType" placeholder="行业类别">
|
|
<option>选择行业类别</option>
|
|
<option value="0">IT</option>
|
|
<option value="1">金融</option>
|
|
<option value="2">空乘</option>
|
|
</select>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- step 4 -->
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
// 认证api
|
|
import * as VerifyApi from '@/api/verify'
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
// 认证步骤
|
|
step:3,
|
|
// 当前标签索引
|
|
curvf: 0,
|
|
// 需要认证的类型
|
|
vfindex:0,
|
|
//统一社会组织代码
|
|
Organizationcode:"",
|
|
// 用户角色 默认代办
|
|
sfval:10,
|
|
// 经办人受权书
|
|
dbsqfile:"",
|
|
//机构名称
|
|
name:"",
|
|
//经办人授权委托书
|
|
jfr_entfile:[],
|
|
// 经办人身份证
|
|
jfr_idafile:[],
|
|
jfr_idbfile:[],
|
|
}
|
|
},
|
|
methods: {
|
|
// 选择
|
|
vfselitem(item){
|
|
this.vfindex = item
|
|
//this.$toast("your choose is:"+item)
|
|
},
|
|
//
|
|
gotostep(step){
|
|
this.step = step
|
|
},
|
|
//检验统一社会信用代码
|
|
chkinput(){
|
|
let Code = this.Organizationcode
|
|
if(Code==""){
|
|
this.$toast("统一社会信用代码不能为空")
|
|
return false
|
|
}
|
|
// 社团统一编码
|
|
const patrn = /^[0-9A-Z]+$/
|
|
if(Code.length!=18 || patrn.test(Code) ==false){
|
|
|
|
this.$toast("统一社会信用代码格式不对")
|
|
return false;
|
|
}else{
|
|
let Ancode; //统一社会信用代码的每一个值
|
|
let Ancodevalue; //统一社会信用代码每一个值的权重
|
|
let total = 0;
|
|
const weightedfactors = [1, 3, 9, 27, 19, 26, 16, 17, 20, 29, 25, 13, 8, 24, 10, 30, 28,]; //加权因子
|
|
const str = "0123456789ABCDEFGHJKLMNPQRTUWXY";
|
|
//不用I、O、S、V、Z
|
|
for (let i = 0; i < Code.length - 1; i++) {
|
|
Ancode = Code.substring(i, i + 1);
|
|
Ancodevalue = str.indexOf(Ancode);
|
|
total = total + Ancodevalue * weightedfactors[i];
|
|
//权重与加权因子相乘之和
|
|
}
|
|
let logiccheckcode = 31 - (total % 31);
|
|
if (logiccheckcode == 31) {
|
|
logiccheckcode = 0;
|
|
}
|
|
let Str = "0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F,G,H,J,K,L,M,N,P,Q,R,T,U,W,X,Y";
|
|
let Array_Str = Str.split(",");
|
|
logiccheckcode = Array_Str[logiccheckcode];
|
|
|
|
let checkcode = Code.substring(17, 18);
|
|
if (logiccheckcode != checkcode) {
|
|
this.$toast("统一社会信用代码格式不对")
|
|
return false;
|
|
} else {
|
|
this.step =3
|
|
console.info("yes");
|
|
}
|
|
|
|
}
|
|
},
|
|
// 身份选择
|
|
selsf(val){
|
|
this.sfval = val
|
|
},
|
|
// 选择图片
|
|
chooseImage( item) {
|
|
const app = this
|
|
const oldImageList = app.$data[item]
|
|
// 选择图片
|
|
uni.chooseImage({
|
|
count: 1,
|
|
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
|
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
|
success({ tempFiles }) {
|
|
//tempFiles = [{path:'xxx', size:100}]
|
|
//app.formData[index].imageList = oldImageList.concat(tempFiles)
|
|
//oldImageList.concat(tempFiles)
|
|
oldImageList.push(tempFiles)
|
|
}
|
|
});
|
|
console.log(oldImageList.length)
|
|
},
|
|
|
|
// 删除图片
|
|
deleteImage(index, imageIndex) {
|
|
this.formData[index].imageList.splice(imageIndex, 1)
|
|
},
|
|
|
|
// 上传图片
|
|
uploadFile() {
|
|
const app = this
|
|
const { formData } = app
|
|
// 整理上传文件路径
|
|
const files = []
|
|
formData.forEach((item, index) => {
|
|
if (item.content.trim() && item.imageList.length) {
|
|
const images = item.imageList.map(image => image)
|
|
files.push({ formDataIndex: index, images })
|
|
}
|
|
})
|
|
// 批量上传
|
|
return new Promise((resolve, reject) => {
|
|
Promise.all(files.map((file, index) => {
|
|
return new Promise((resolve, reject) => {
|
|
VerifyApi.upload(file.images)
|
|
.then(fileIds => {
|
|
app.formData[index].uploaded = fileIds
|
|
resolve(fileIds)
|
|
})
|
|
.catch(reject)
|
|
})
|
|
}))
|
|
.then(resolve, reject)
|
|
})
|
|
}
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.orgvzone{
|
|
background: #fff;
|
|
margin-bottom: 36rpx;
|
|
|
|
.vfbox{
|
|
width: 90%;
|
|
margin: 0rpx auto;
|
|
padding: 10rpx;
|
|
|
|
.vftit{
|
|
font-size: 36rpx;
|
|
font-weight: 600;;
|
|
}
|
|
|
|
.vfitem{
|
|
font-size: 30rpx;
|
|
line-height: 1.8;
|
|
margin: 30rpx auto;
|
|
border:2rpx solid #eee;
|
|
border-radius: 10rpx;
|
|
padding: 16rpx;
|
|
|
|
.vfi-tit{
|
|
font-size: 34rpx;
|
|
line-height: 80rpx;
|
|
padding-left: 22rpx;
|
|
}
|
|
|
|
.vfi-desc{
|
|
background-color: #FEFFE8;
|
|
border: 1px solid #CFAF0F;
|
|
padding: 10px 8px;
|
|
color: #444444;
|
|
border-radius: 12rpx;
|
|
text-indent: 36rpx;
|
|
}
|
|
|
|
&:hover{
|
|
background-color: #487AEE;
|
|
color: #fff;
|
|
}
|
|
|
|
&.selected{
|
|
background-color: #487AEE;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
// 按钮
|
|
.vfbtn{
|
|
|
|
button{
|
|
background: #487AEE;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
.ver-form{
|
|
// todo o
|
|
}
|
|
|
|
.sfsel{
|
|
float: left;
|
|
width: 100%;
|
|
|
|
.sf-tit{
|
|
width: 20%;
|
|
padding: 10rpx 0;
|
|
display: flex;
|
|
flex-direction: center;
|
|
}
|
|
|
|
.sf-item{
|
|
background: #EAEAEA;
|
|
width: 80%;
|
|
display: flex;
|
|
text-align: center;
|
|
color: #333;
|
|
border-radius: 12rpx;
|
|
|
|
.sfiv{
|
|
width: 50%;
|
|
padding: 10rpx;
|
|
|
|
&.active{
|
|
border-radius: 12rpx;
|
|
background: #487AEE;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
// 输入框元素
|
|
.form-item {
|
|
display: flex;
|
|
padding: 18rpx;
|
|
border-bottom: 1rpx solid #f3f1f2;
|
|
margin-bottom: 30rpx;
|
|
height: 96rpx;
|
|
|
|
&--input {
|
|
font-size: 28rpx;
|
|
letter-spacing: 1rpx;
|
|
flex: 1;
|
|
height: 100%;
|
|
}
|
|
|
|
&--parts {
|
|
min-width: 100rpx;
|
|
height: 100%;
|
|
}
|
|
|
|
}
|
|
|
|
.image-list {
|
|
display: flex;
|
|
padding: 0 20rpx;
|
|
margin-top: 20rpx;
|
|
margin-bottom: -20rpx;
|
|
|
|
&:after {
|
|
clear: both;
|
|
content: " ";
|
|
display: table;
|
|
}
|
|
|
|
.image {
|
|
display: block;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.image-picker,
|
|
.image-preview {
|
|
width: 196rpx;
|
|
height: 196rpx;
|
|
margin-right: 30rpx;
|
|
margin-bottom: 30rpx;
|
|
float: left;
|
|
|
|
&:nth-child(3n+0) {
|
|
margin-right: 0;
|
|
}
|
|
}
|
|
|
|
.image-picker {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
border: 1rpx dashed #ccc;
|
|
color: #ccc;
|
|
|
|
.choose-icon {
|
|
font-size: 48rpx;
|
|
margin-bottom: 6rpx;
|
|
}
|
|
|
|
.choose-text {
|
|
font-size: 24rpx;
|
|
}
|
|
}
|
|
|
|
.image-preview {
|
|
position: relative;
|
|
|
|
.image-delete {
|
|
position: absolute;
|
|
top: -15rpx;
|
|
right: -15rpx;
|
|
height: 42rpx;
|
|
width: 42rpx;
|
|
line-height: 42rpx;
|
|
background: rgba(0, 0, 0, 0.64);
|
|
border-radius: 50%;
|
|
color: #fff;
|
|
font-weight: bolder;
|
|
font-size: 22rpx;
|
|
z-index: 10;
|
|
text-align: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
</style>
|
|
|