在vue中{{}}中进行方法调用
<!-- Home.vue --><template><div><el-row type="flex" justify="space-between" class="head-box"><el-col class=
·
<!-- Home.vue -->
<template>
<div>
<el-row type="flex" justify="space-between" class="head-box">
<el-col class="head-logo">
<img class="head-logo" src="./images/head-logo.jpg" alt="">
</el-col>
<el-col>
<el-row>
<el-col>
<span class="detail-strong">您好,{{userInfo.userFullname}}</span>
<span class="detail-unauth" v-if="userInfo.isCertification === 1">已实名认证</span>
<span class="detail-unauth" v-if="userInfo.isCertification !== 1">【未实名认证】请</span>
<span class="to-auth" @click="openAuthPopbox" v-if="userInfo.isCertification !== 1">认证</span>
</el-col>
<el-col class="detail-hap">欢迎来到上海科技,祝您使用愉快!</el-col>
<el-col class="edit-detail">
<i class="el-icon-edit edit-icon"></i>
<router-link :to="{'name':'setting'}">编辑个人信息</router-link>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row>
<el-collapse-transition>
<el-col v-show="isShowGuide" class="guide-wrap">
<el-row type="flex" justify="space-between">
<el-col class="guide-tip"><span>如需办理业务,请依照以下步骤</span></el-col>
<el-col>
<i class="el-icon-close close-tag cursor" @click="closeGuide"></i>
</el-col>
</el-row>
<el-row type="flex" align="middle">
<el-col :span="7">
<el-row class="guide-do-left" type="flex" justify="space-between">
<el-col :span="11">
<strong>实名认证</strong>
<span>提供您的身份信息</span>
<el-button type="primary" size="mini" plain class="do-btn" :disabled="disabledLidt" @click="openAuthPopbox">立即认证</el-button>
</el-col>
<el-col :span="7">
<i class="do-bg-img realname-confirm"></i>
</el-col>
<el-col :span="6">
<el-row type="flex" justify="center" align="middle" style="height: 100%">
<i class="el-icon-plus plus-right"></i>
</el-row>
</el-col>
</el-row>
</el-col>
<el-col :span="7">
<el-row class="guide-do-left" type="flex" justify="space-between">
<el-col :span="11">
<strong>资料完善</strong>
<span>填写您的个人履历</span>
<el-button @click="toProfile" type="primary" size="mini" plain class="do-btn">
立即填写
<!-- <router-link :to="{'name':'profile'}">
立即填写
</router-link> -->
</el-button>
</el-col>
<el-col :span="7">
<i class="do-bg-img add-info"></i>
</el-col>
<el-col :span="6">
<el-row type="flex" justify="center" align="middle" style="height: 100%">
<i class="el-icon-plus plus-right"></i>
</el-row>
</el-col>
</el-row>
</el-col>
<el-col :span="7">
<el-row class="guide-do-left" type="flex" justify="space-between">
<el-col :span="11">
<strong>关联单位</strong>
<span>申请您的单位认证</span>
<el-button type="primary" size="mini" plain class="do-btn" @click="openApplyPopbox">立即申请</el-button>
</el-col>
<el-col :span="6">
<i class="do-bg-img unit-confirm"></i>
</el-col>
<el-col :span="7">
<el-row type="flex" justify="center" align="middle" style="height: 100%">
<i class="iconfont icon-icon-66 plus-right"></i>
</el-row>
</el-col>
</el-row>
</el-col>
<el-col :span="6">
<el-row class="guide-do-left" type="flex" justify="space-between">
<el-col :span="13">
<strong>业务办理</strong>
<span>进行您的业务办理</span>
<el-button type="primary" size="mini" plain class="do-btn" :disabled="true">立即办理</el-button>
</el-col>
<el-col :span="11">
<i class="do-bg-img do-deal"></i>
</el-col>
</el-row>
</el-col>
</el-row>
</el-col>
</el-collapse-transition>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-card v-if="unitList.length > 0" class="grid-content pd0" shadow="never">
<el-row type="flex" justify="space-between" class="header-top">
<el-col class="card-title">
<span>单位管理</span>
</el-col>
<el-col>
<el-button class="head-btn fr" type="text" v-if="unitList.length > 0" @click="openApplyPopbox">关联新单位</el-button>
<el-button class="head-btn fr" type="text" v-if="unitList.length > 0" @click="userUnitSetDefault">设置为默认</el-button>
</el-col>
</el-row>
<el-row v-for="(item, i) in unitList" :key="i" type="flex" justify="space-between" @click.native="checkUnit(item)" :class="{'unit-list':true, 'mb0': i+1 === unitList.length, 'active-list': item.isDefault === 1, 'selected-list': item.unit.id == checkedUnitId, 'cursor':true}">
<el-col :span="16">
<el-row class="unit-name">
<span class='hiddle'>{{ item.unit.unitName }}</span><strong class="default-tip" v-if="item.isDefault === 1">默认单位</strong>
</el-row>
<el-row class="unit-address">
<span>{{parseArea(item.unit.unitArea)}}</span>
</el-row>
<el-row class="info-status" v-if="item.percentage<100">
<span v-if="item.isAdmin === 1">
当前公司信息未完善,请及时<router-link :to="{name:'unitinfo', query:{id:item.unit.id}}" class="add-info">完善公司信息</router-link>
</span>
<span v-else>
当前公司信息未完善,请及时联系管理员
</span>
</el-row>
</el-col>
<el-col :span="7">
<el-row type="flex" justify="end" class="info-percent">
<strong class="percent">{{item.percentage}}</strong>
<span>%完善度</span>
</el-row>
<el-row type="flex" justify="end" class="edit-icons">
<router-link v-if="item.isAdmin === 1" :to="{name:'unituser',query:{id:item.unit.id}}">
<i class="iconfont icon-icon-151 cursor" title="单位用户管理"></i>
</router-link>
<router-link v-if="item.isAdmin === 1" :to="{name:'unitinfo', query:{id:item.unit.id}}">
<i class="el-icon-edit icon-space cursor" title="单位信息管理"></i>
</router-link>
<i class="el-icon-delete icon-space cursor" title="与单位解绑" @click="deleteUserUnit(item)"></i>
</el-row>
</el-col>
</el-row>
</el-card>
<el-card v-else class="grid-content-default" shadow="never">
<el-row class="card-title-default">
<span>单位管理</span>
</el-row>
<el-row type="flex" justify="center">
<el-button class="plus-wrap" @click="openApplyPopbox">
<i class="el-icon-plus plus-icon"></i>
</el-button>
</el-row>
<el-row type="flex" justify="center">
<span class="apply-default" @click="openApplyPopbox">申请关联单位</span>
</el-row>
</el-card>
</el-col>
<el-col :span="12" v-if="list">
<el-row>
<el-card class="grid-content" shadow="never">
<el-row type="flex" justify="space-between" class="header-top">
<el-col class="card-title">
<span>指南征集</span>
</el-col>
<el-col>
<el-button class="head-btn fr" type="text">更多</el-button>
</el-col>
</el-row>
<ul class="guide-box">
<li class="guide-list" v-for="o in 4" :key="o">
<a href="javascript:void(0)" class="guide-detail"><span class="fr">2018-10-25</span>{{'列表内容 ' + o }}</a>
</li>
</ul>
</el-card>
</el-row>
<el-row>
<el-card class="grid-content-default" shadow="never">
<el-row class="card-title-default">
<span>专家</span>
</el-row>
<el-row type="flex" justify="center">
<el-button class="plus-wrap">
<i class="el-icon-plus plus-icon"></i>
</el-button>
</el-row>
<el-row type="flex" justify="center">
<span class="apply-default">申请专家</span>
</el-row>
</el-card>
</el-row>
</el-col>
</el-row>
<!-- 实名认证弹窗 -->
<st-upfloat-panel :panel="panelAuth" @panelClose="cancelAuthPopbox">
<div>
<el-form ref="authentication" :model="authentication" :rules="authRules" label-width="120px">
<el-form-item label="用户姓名:" label-position="left" prop="userFullname">
<el-input type="text" v-model.trim="authentication.userFullname" :disabled="disabledLidt" placeholder="请输入真实姓名"></el-input>
</el-form-item>
<el-form-item label="证件类型:" label-position="left" prop="userCertificatetype">
<!-- <el-input type="text" value="身份证" disabled></el-input> -->
<el-select v-model.trim="authentication.userCertificatetype" class="select date-picker" placeholder="请选择证件类型" disabled auto-complete="off">
<!-- <i slot="prefix" class="el-input__icon el-icon-picture"></i> -->
<i slot="prefix" class="el-input__icon iconfont icon-icon-31"></i>
<el-option v-for="item in dict_zj" :key="item.dictionaryCode" :label="item.dictionaryName" :value="item.dictionaryCode">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="证件号码:" label-position="left" prop="userCertificate">
<el-input type="text" v-model="authentication.userCertificate" :disabled="disabledLidt" placeholder="请输入证件号码"></el-input>
</el-form-item>
<el-form-item label="手机号码" label-position="left" prop="userMobile">
<el-input type="text" v-model.trim="userInfo.userMobile" disabled></el-input>
</el-form-item>
<el-form-item label="验证码:" label-position="left" prop="verificationCode">
<el-col :span="14">
<el-input class="validate-code-input" type="text" v-model.trim="authentication.code" placeholder="请输入短信验证码"></el-input>
</el-col>
<el-col class="line" :span="1"> </el-col>
<el-col :span="9">
<getcode />
</el-col>
</el-form-item>
<el-form-item label="" label-position="left">
<el-row type="flex" justify="start">
<el-button type="primary" size="medium" style="width: 100%" @click="authRealname('authentication')">提交</el-button>
</el-row>
</el-form-item>
</el-form>
</div>
</st-upfloat-panel>
<!-- 申请关联单位弹窗 -->
<st-upfloat-panel :panel="panelApply" @panelClose="cancelApplyPopbox">
<div>
<el-form ref="applyUnitForm" label-width="120px" :rules="applyUnitRules" :model="applyUnitForm">
<el-form-item label="单位名称:" label-position="left" prop="queryUnitName">
<el-autocomplete v-model.trim="applyUnitForm.queryUnitName" :fetch-suggestions="allUnits" placeholder="关键字模糊搜索" @select="handleSelect" style="width:100%">
<template slot-scope="{ item }">
<div class="name">{{ item.unitName }}</div>
</template>
<i slot="prefix" class="el-input__icon el-icon-search"></i>
</el-autocomplete>
</el-form-item>
<el-form-item label="用户姓名:" label-position="left" prop="userFullname">
<el-input type="text" v-model="userInfo.userFullname" placeholder="请输入真实姓名" :disabled="true"></el-input>
</el-form-item>
<el-form-item label="手机号码" label-position="left" prop="mobile">
<el-input type="text" v-model="userInfo.userMobile" placeholder="请输入手机号码" :disabled="true"></el-input>
</el-form-item>
<el-form-item label="" label-position="left">
<el-row type="flex" justify="start">
<el-button type="primary" size="medium" style="width: 100%" @click="userUnitBind">提交</el-button>
</el-row>
</el-form-item>
</el-form>
</div>
</st-upfloat-panel>
</div>
</template>
<script>
import StUpfloatPanel from '@/components/stupfloatpanel/StUpfloatPanel'
import code from '@/components/code/Code'
import gql from 'graphql-tag'
import {
count, // 姓名
validateIdcard,
validateAuthCode
} from '@/utils/validate'
import { prettyMobile } from '@/utils/index'
import { getErrorByCode } from '@/utils/errors'
export default {
components: {
StUpfloatPanel,
getcode: code
},
data () {
// 证件的判断
const valiDateCode = (rule, value, callback) => {
// 证件号
if (this.authentication.userCertificatetype === 'd82f57aaddb611e8b6a66c0b84d10001') {
if (!value) {
callback(new Error('请输入身份证号'))
} else if (!validateIdcard(value)) {
callback(new Error('请输入正确的身份证号'))
} else {
callback()
}
} else {
if (!value) {
callback(new Error('请输入证件号码'))
} else {
callback()
}
}
}
// 姓名的判断
const checkUserFullName = (rule, value, callback) => {
if (value === '') {
callback(new Error('请输入真实姓名'))
} else if (count(value) > 50) {
callback(new Error('请输入正确的姓名'))
} else {
callback()
}
}
// 验证码验证
const codeCheck = (rule, value, callback) => {
if (value) {
if (!validateAuthCode(value)) {
callback(new Error('请输入正确的短信验证码'))
} else {
callback()
}
} else {
callback(new Error('请输入短信验证码'))
}
}
return {
list: false,
// 实名认证panel设置
panelAuth: {
show: false,
title: '实名认证',
btnName: '',
// 表单操作结果显示 type:(-1,0,1),msg
result: {
type: 0,
msg: ''
}
},
// 申请关联单位panel设置
panelApply: {
show: false,
title: '申请关联单位',
btnName: '',
// 表单操作结果显示 type:(-1,0,1),msg
result: {
type: 0,
msg: ''
}
},
unitList: [],
applyUnitForm: {
queryUnitName: ''
},
// 被选中单位的ID
checkedUnitId: '',
disabledLidt: false,
// 用户信息对象
userInfo: {
isCertification: 0,
userFullname: '',
userMobile: ''
},
isShowGuide: true,
// 关联新单位时已选择的单位对象
selectedUnit: {
id: ''
},
// 实名认证参数
authentication: {
userFullname: '',
userCertificatetype: 'd82f57aaddb611e8b6a66c0b84d10001',
code: '',
userCertificate: ''
},
dict_zj: [],
dict_qy: [],
userList: [],
authRules: {
userFullname: [
{ required: true, validator: checkUserFullName, trigger: 'blur' }
],
userCertificate: [
{ required: true, validator: valiDateCode, trigger: 'blur' }
],
code: [
{ required: true, validator: codeCheck, trigger: 'blur' }
],
userCertificatetype: [
{ required: true, message: '请选择证件类型', trigger: 'blur' }
]
},
applyUnitRules: {
queryUnitName: [
{ required: true, message: '请选择单位名称', trigger: 'blur' }
]
}
}
},
methods: {
// 查询字典表
dictionary () {
this.$apollo
.query({
query: gql`
query dictionaries($type:String!,$code: String!,$type1:String!,$code1: String!) {
card:dictionaries(type:$type,code:$code) {
dictionaryCode:id
dictionaryName:dictionary_name
}
area:dictionaries(type:$type1,code:$code1) {
dictionaryCode:id
dictionaryName:dictionary_name
}
}
`,
// fetchPolicy: 'no-cache',
client: 'dictionary',
variables: {
type: 'dict_zj_type',
code: 'dict_zj',
type1: 'dict_qy_type',
code1: 'dict_qy'
}
})
.then(res => {
console.log(res)
if (res.data) {
this.dict_qy = res.data.area
this.dict_zj = res.data.card
// res.data.dictionary.forEach((dictionary) => {
// switch (dictionary.dictionaryCode) {
// case 'dict_qy':
// this.dict_qy = dictionary.children
// break
// case 'dict_zj':
// this.dict_zj = dictionary.children
// break
// default:
// break
// }
// })
}
}).catch(() => {
this.$message.error('服务器异常')
})
},
// 打开实名认证弹窗
openAuthPopbox () {
this.authentication.userFullname = this.userList.userFullname
this.authentication.userCertificate = this.userList.userCertificate
this.panelAuth = {
show: true,
title: '实名认证',
result: {
type: 0,
msg: ''
}
}
},
toProfile () {
this.$router.push('/profile')
},
// 取消实名认证弹窗
cancelAuthPopbox () {
this.$refs['authentication'] && this.$refs['authentication'].resetFields()
// 清空所有实名认证输入框中的内容
this.$refs['authentication'] && this.$refs['authentication'].clearValidate()
this.panelAuth.result.type = 0
this.panelAuth.show = false
},
// 打开申请关联单位弹窗
openApplyPopbox () {
if (this.userInfo.isCertification !== 1) {
this.$message.error('请先进行实名认证')
return
}
this.panelApply = {
show: true,
title: '申请关联单位',
result: {
type: 0,
msg: ''
}
}
},
// 取消申请关联单位弹窗
cancelApplyPopbox () {
this.$refs['applyUnitForm'] && this.$refs['applyUnitForm'].clearValidate()
this.panelApply.show = false
},
resetClearForm (refName) {
this.$refs[refName].resetFields()
this.$refs[refName].clearValidate()
},
// 选择单位
checkUnit (item) {
if (item.isDefault === 1) return
this.checkedUnitId === item.unit.id
? (this.checkedUnitId = '')
: (this.checkedUnitId = item.unit.id)
},
// 获取单位列表信息
user () {
this.$apollo
.query({
query: gql`
query user($accountCode:String) {
user(accountCode: $accountCode) {
id
userMobile
userName
userFullname
isCertification
userCertificatetype
userCertificate
userType
headimgurl
units{
id
isAdmin
applyStatus
isDefault
unit{
id
unitLogo
unitName
unitArea
unitUniformSocialCredit
unitOrganizationCode
unitAddress
unitZipCode
unitFax
unitLinkman
unitTelephone
unitEmail
unitLegal
unitLegalSex
unitLegalCertificatetype
unitLegalCertificate
unitLegalEducation
unitLegalServedtime
unitLegalTelephone
unitScientificEmail
unitFinanceEmail
unitAccountName
unitAccountBank
unitAccount
unitSubjection
unitRegistration
unitEmployTotal
unitEmployCollege
unitEmployResearch
unitEmployMiddleLevel
unitEmployUndergraduate
unitRegisteredCapital
unitRegisteredForeign
unitRegisteredTime
unitIncome
unitProfit
unitSale
unitEarner
unitAssets
unitLiabilities
unitProperties
}
}
}
}
`,
fetchPolicy: 'network-only',
client: 'center',
variables: {
}
})
.then(res => {
const data = JSON.parse(JSON.stringify(res.data.user))
this.userList = data
const userFullnameShow = data.userFullname
? data.userFullname
: prettyMobile(data.userMobile)
let unitList = []
// 资料完善度百分比计算
data.units.map(userUnit => {
const arr = Object.values(userUnit.unit)
let num = 0
Object.values(arr).map(value => {
if (value) {
num++
}
return num
})
userUnit.percentage = Math.round(((num - 1) / (arr.length - 1)) * 100) // 减1是为了排除id的影响
unitList.push(userUnit)
this.unitList = unitList
})
// 用户基本信息数据
this.userInfo = {
isCertification: data.isCertification,
userFullname: data.userFullname,
userFullnameShow: userFullnameShow,
userMobile: data.userMobile
}
this.authentication.userFullname = data.userFullname
this.authentication.userCertificate = data.userCertificate
if (data.isCertification === 1) {
this.disabledLidt = true
} else {
this.disabledLidt = false
}
})
.catch((err) => {
this.$message.error(getErrorByCode(err))
})
},
// 设置为默认单位
userUnitSetDefault () {
if (!this.checkedUnitId) {
this.$message.error('请先选择默认单位')
return
}
this.$confirm('确认将该单位设置为默认单位, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
this.$apollo
.mutate({
mutation: gql`
mutation userUnitSetDefault($unitId:ID!) {
userUnitSetDefault(unitId: $unitId)
}
`,
client: 'center',
variables: {
unitId: this.checkedUnitId
}
})
.then(res => {
if (res) {
this.$message({
type: 'success',
message: '设置默认单位成功!'
})
this.checkedUnitId = ''
this.user()
} else {
this.$message.error('设置默认单位失败!')
}
})
.catch((err) => {
this.$message.error(getErrorByCode(err))
})
})
.catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
// 关联新单位
userUnitBind () {
if (this.selectedUnit.id) {
this.$refs['applyUnitForm'].validate((valid) => {
if (valid) {
this.$apollo
.mutate({
mutation: gql`
mutation userUnitBind($unitId:ID!) {
userUnitBind(unitId: $unitId)
}
`,
client: 'center',
variables: {
unitId: this.selectedUnit.id
}
})
.then(res => {
if (res.data.userUnitBind) {
this.panelApply = {
show: true,
title: '申请关联单位',
result: {
type: 1,
msg: '单位关联提交成功'
}
}
this.$refs['applyUnitForm'].resetFields()
this.user()
} else {
this.$message.error('单位关联提交失败!')
}
})
.catch((err) => {
this.$message.error(getErrorByCode(err))
})
} else {
return false
}
})
} else {
this.$message.error('公司信息不存在不能申请')
}
},
// 删除单位
deleteUserUnit (item) {
this.$confirm('此操作将永久解绑该单位, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
this.$apollo
.mutate({
mutation: gql`
mutation deleteUserUnit($id:ID!) {
deleteUserUnit(id: $id)
}
`,
client: 'center',
variables: {
// id: item.unit.id
id: item.id
}
})
.then(res => {
if (res) {
this.$message({
type: 'success',
message: '单位解绑成功!'
})
this.user()
} else {
this.$message.error('单位解绑失败')
}
})
.catch((err) => {
this.$message.error(getErrorByCode(err))
})
})
.catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
})
})
},
// 单位模糊查询
allUnits (unitName, callback) {
if (unitName === '') return
this.$apollo
.query({
query: gql`
query allUnits($unitName:String!) {
allUnits(unitName: $unitName){
id
unitName
}
}
`,
client: 'center',
fetchPolicy: 'network-only',
variables: {
unitName: unitName
}
})
.then(res => {
const data = res.data.allUnits
callback(data)
})
.catch((err) => {
this.$message.error(getErrorByCode(err))
})
},
// 单位模糊查询后选择单位
handleSelect (item) {
this.applyUnitForm.queryUnitName = item.unitName
this.selectedUnit = item
},
// 实名认证提交
authRealname (formData) {
this.$refs[formData].validate(valid => {
if (valid) {
this.$apollo
.mutate({
mutation: gql`
mutation authentication($authentication:AuthenticationInput) {
authentication(authentication: $authentication)
}
`,
client: 'center',
variables: {
authentication: {
verificationCode: this.authentication.code,
userFullname: this.authentication.userFullname,
userMobile: this.userInfo.userMobile,
userCertificate: this.authentication.userCertificate
}
}
})
.then(res => {
if (res.data.authentication) {
this.$refs['authentication'].resetFields()
this.panelAuth = {
show: true,
title: '实名认证',
result: {
type: 1,
msg: '实名认证成功'
}
}
this.user()
}
})
.catch((err) => {
this.$message.error(getErrorByCode(err))
})
}
})
},
parseArea (areaCode) {
let area = ''
this.dict_qy.forEach(qy => {
if (qy.dictionaryCode === areaCode) {
area = qy.dictionaryName
}
})
return area
},
// 关闭引导栏
closeGuide () {
this.isShowGuide = false
}
},
mounted () {
// 获取单位列表信息
this.dictionary()
this.user()
}
}
</script>
<style lang='stylus' rel='stylesheet/stylus' scoped>
@import '../../assets/fonts/iconfont.css'
.head-box
padding-top 14px
margin-bottom 20px
.head-logo
margin-right 20px
width 60px
height 60px
border-radius 60px
.detail-hap, .detail-strong, .detail-unauth
font-size 16px
color #909399
font-weight normal
margin 0 auto
height 20px
line-height 20px
margin-bottom 8px
.detail-hap
margin-top 8px
font-size 14px
.detail-strong
font-size 20px
font-weight 400
color #303133
.detail-unauth
margin-left 10px
.edit-detail
margin-top 8px
height 20px
line-height 20px
margin 0
font-size 14px
color #1989fa
.edit-icon
color #1989fa
margin-right 10px
.iconfont
cursor pointer
font-weight 200
margin 0 10px 0 30px
.to-auth
cursor pointer
font-size 16px
color #1989fa
.grid-content, .grid-content-default
min-height 240px
background #fff
padding-bottom 20px
margin-bottom 20px
.header-top
margin-bottom 18px
.card-title, .card-title-default
font-size 16px
color #909399
.head-btn
font-size 12px
padding 3px 0
margin-right 20px
.guide-box
margin 0 20px
padding 0
.guide-list
height 28px
line-height 28px
margin-left 16px
padding 0
color #909399
.guide-detail
font-size 14px
.mb0
margin-bottom 0
.pd0
padding-bottom 0
.unit-list
height 130px
border 1px solid #dcdfe6
border-bottom 4px solid #c0c4cc
border-radius 4px
padding 0 20px 4px
margin-bottom 20px
.unit-name
height 28px
line-height 28px
color #252631
font-size 20px
margin-top 20px
.hiddle
width 200px
overflow hidden
text-overflow ellipsis
white-space nowrap
display inline-block
.default-tip
font-size 14px
font-weight normal
color #fa5555
font-weight 400
margin-left 10px
display inline-block
vertical-align top
.unit-address
font-size 14px
color #909399
height 21px
line-height 21px
margin 10px 0 20px 0
.info-status
height 17px
line-height 20px
font-size 12px
color #909399
.add-info
color #1989fa
.info-percent
color #909399
height 42px
line-height 42px
font-size 14px
margin-top 15px
.percent
font-weight normal
color #1989fa
font-size 30px
.edit-icons
position absolute
bottom 10px
right 20px
color #909399
.icon-space
margin-left 20px
.active-list
border-color #1989fa
.selected-list
border-color #303133
.card-title-default
height 40px
margin-bottom 20px
.plus-wrap
width 80px
height 80px
border-radius 4px
background-color #fff
border 2px dashed #e4e7ed
.plus-icon
color #dcdfe6
zoom 2
.apply-default
margin-top 15px
font-size 16px
color #909399
text-align center
display block
.validate-code-row
width 124px
p
display inline-block
width 81px
margin 0 auto
.get-code
background #e6f1fc
border-radius 4px
font-size 12px
color #1989fa
float right
.cursor
cursor pointer
.guide-wrap
height 200px
background #fff
padding 20px
margin-bottom 20px
.guide-tip
color #fa5555
font-size 16px
height 22px
line-height 22px
.close-tag
float right
font-size 22px
color #999
.guide-do-left
margin-top 24px
strong
display block
font-size 16px
color #474747
height 22px
line-height 22px
margin-bottom 6px
span
display block
font-size 14px
color #909399
height 18px
line-height 18px
margin-bottom 20px
.do-bg-img
width 78px
height 80px
display block
.plus-right
font-size 30px
color #1989fa
font-weight 800
.realname-confirm
background url('./images/realname-confirm.svg') no-repeat
.add-info
background url('./images/add-info.svg') no-repeat
.unit-confirm
background url('./images/unit-confirm.svg') no-repeat
.do-deal
background url('./images/do-deal.svg') no-repeat
.select
width 100%
</style>
更多推荐
已为社区贡献16条内容
所有评论(0)