detail
This commit is contained in:
花有清香月有阴
@@ -5,7 +5,7 @@
|
||||
</div>
|
||||
|
||||
<template v-if="datas.length == 0">
|
||||
<u-card v-for="(items, index) in 4" :key="index" :foot-border-top="false" :head-border-bottom="false" :show-head="false" @click="goDetail(item, 1)">
|
||||
<u-card v-for="(item, index) in 4" :key="index" :foot-border-top="false" :head-border-bottom="false" :show-head="false" @click="goDetail(item, 1)">
|
||||
<view class="body" slot="body">
|
||||
<view class="u-body-item">
|
||||
<div class="title">基本养老保险灵活就业人员新参保业务</div>
|
||||
@@ -73,8 +73,10 @@ export default {
|
||||
methods: {
|
||||
getList() {},
|
||||
|
||||
goDetail(item) {
|
||||
|
||||
goDetail(item, indexs) {
|
||||
console.log(item, indexs)
|
||||
var id = '11'
|
||||
uni.navigateTo({ url: `./detail?id=${id}` })
|
||||
},
|
||||
|
||||
search(e) {
|
||||
|
||||
BIN
src/apps/AppWorkonline/components/Profile_Picture.png
Normal file
BIN
src/apps/AppWorkonline/components/Profile_Picture.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 663 B |
BIN
src/apps/AppWorkonline/components/agree.png
Normal file
BIN
src/apps/AppWorkonline/components/agree.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
src/apps/AppWorkonline/components/basic.png
Normal file
BIN
src/apps/AppWorkonline/components/basic.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 858 B |
BIN
src/apps/AppWorkonline/components/clearn.png
Normal file
BIN
src/apps/AppWorkonline/components/clearn.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 217 B |
@@ -1,25 +1,914 @@
|
||||
<template>
|
||||
<div class="detail">detail</div>
|
||||
<div class="detail" v-if="pageShow">
|
||||
<!-- <div class="top" v-if="list.approvalStatus == 1">
|
||||
<p>审批通过:</p>
|
||||
<div class="save">
|
||||
<div style="display: inline">11已签署完成,</div>
|
||||
<ai-image preview :file="list.pdfFile" style="display: inline-block; margin-left: 4px"><span class="clicksave">点击查看和保存</span> </ai-image>
|
||||
</div>
|
||||
</div> -->
|
||||
|
||||
<div class="form">
|
||||
<!-- 审批表单名称 -->
|
||||
<text class="text">
|
||||
审批表单名称
|
||||
<!-- {{ list.processDefName }} -->
|
||||
</text>
|
||||
|
||||
<div class="people">
|
||||
<!-- 左 -->
|
||||
<div class="people_msg">
|
||||
<!-- 圆形头像 -->
|
||||
<div class="avatar">
|
||||
<span>李伟民</span>
|
||||
<!-- <span v-if="list.createUserAvatar"><img :src="list.createUserAvatar" alt="" style="width: 100%; height: 100%; border-radius: 50%" /></span>
|
||||
<span v-else> {{ $formatName(list.createUserName) }}</span> -->
|
||||
</div>
|
||||
|
||||
<text class="name">
|
||||
<!-- 姓名 -->
|
||||
<p class="name_con">
|
||||
李伟民
|
||||
<!-- {{ list.createUserName }} -->
|
||||
</p>
|
||||
<!-- 日期 -->
|
||||
<p class="name_createtime">
|
||||
2021
|
||||
<!-- {{ list.createTime }} -->
|
||||
</p>
|
||||
</text>
|
||||
</div>
|
||||
|
||||
<!-- 右 -->
|
||||
<!-- 审批状态 -->
|
||||
<!-- 审批中 -->
|
||||
<div class="people_status_ing">
|
||||
<!-- v-if="list.approvalStatus == 0" -->
|
||||
<!-- {{ $dict.getLabel('listApprovalStatusHb', list.approvalStatus) }} -->
|
||||
</div>
|
||||
|
||||
<!-- 已通过 -->
|
||||
<div class="people_status_agree">
|
||||
<!-- v-if="list.approvalStatus == 1" -->
|
||||
<img src="./components/people_status_agree.png" alt="" />
|
||||
</div>
|
||||
|
||||
<!-- 被驳回 -->
|
||||
<!-- <div class="people_status_reject" v-if="list.approvalStatus == 2">
|
||||
{{ $dict.getLabel('listApprovalStatusHb', list.approvalStatus) }}
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<!-- 表头内容 -->
|
||||
<div class="content">
|
||||
<div class="item">
|
||||
<span class="item_info">所属类型：</span>
|
||||
<span class="zhuf">
|
||||
classificationName
|
||||
<!-- {{ list.classificationName }} -->
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="item">
|
||||
<span class="item_info">所属部门：</span>
|
||||
<span class="liangzhu">
|
||||
department
|
||||
<!-- {{ $dict.getLabel('hbDepartment', list.department) }} -->
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="item">
|
||||
<span class="item_info">审批编号：</span>
|
||||
<span class="liangzhu">
|
||||
serialNumber
|
||||
<!-- {{ list.serialNumber }} -->
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="item">
|
||||
<div class="item_info">
|
||||
<span class="annexs">附件资料：</span>
|
||||
|
||||
<!-- v-for="(item, indexs) in list.annexs" :key="indexs" -->
|
||||
<div class="img_text">
|
||||
img_text
|
||||
<!-- <ai-image :src="item.annexFile.url" preview />
|
||||
<span class="text">{{ item.annexName }}</span> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- tabs栏 -->
|
||||
<u-tabs class="tabs" :list="list_tabs" height="96" active-color="#1365dd" inactive-color="#999" bar-width="374" font-size="30" :is-scroll="false" :current="current" @change="change"></u-tabs>
|
||||
|
||||
<!-- 表单申请的折叠窗 -->
|
||||
<div style="background-color: #fff">
|
||||
<div v-if="current == 0" class="collapse">
|
||||
<!-- <u-collapse event-type="close" :arrow="true" :accordion="true">
|
||||
<u-collapse-item v-if="item.length > 0" v-for="(item, index) in inforlist" :title="item[0].groupName" :key="index">
|
||||
<div v-for="(items, indexs) in item" :key="indexs">
|
||||
<div class="item_msg">
|
||||
<span class="msg_lef">{{ items.fieldName }}</span>
|
||||
|
||||
<span class="msg_lright" v-if="items.fieldDataType != 5">{{ $dict.getLabel(items.dictionaryCode, items.fieldValue) }}</span>
|
||||
<span class="msg_lright" v-else>
|
||||
<span v-for="(itemL, indexL) in items.fieldValue" :key="indexL"
|
||||
>{{ $dict.getLabel(items.dictionaryCode, itemL) }}
|
||||
<span v-if="indexL < items.fieldValue.length - 1">,</span>
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</u-collapse-item>
|
||||
</u-collapse> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 流程信息 -->
|
||||
<div v-if="current == 1" class="workflow">
|
||||
<!-- 第一步发起 -->
|
||||
|
||||
<!-- v-if="item.nodeType == 3" -->
|
||||
<div class="step-list">
|
||||
<!-- <div class="step-item" v-for="(item, index) in stepList" :key="index"> -->
|
||||
<div class="step-item" v-for="(item, index) in 3" :key="index">
|
||||
<div class="item-left">
|
||||
<div class="item-left-ava-icon">
|
||||
<div class="avatar" v-if="item.userName">
|
||||
<span>userName</span>
|
||||
<!-- <span v-if="item.stepAvatar"><img :src="item.stepAvatar" alt="" style="width: 100%; height: 100%; border-radius: 50%" /></span>
|
||||
<span v-else> {{ $formatName(item.userName) }}</span> -->
|
||||
</div>
|
||||
|
||||
<!-- <div class="avatar" v-else-if="item.title == '抄送'">
|
||||
<img src="./components/Profile_Picture.png" alt="" />
|
||||
</div> -->
|
||||
|
||||
<div class="avatar" v-else>
|
||||
<span>candidates</span>
|
||||
<!-- <div v-for="(item3, indexs) in item.candidates" :key="indexs">{{ $formatName(item3.name) }}</div> -->
|
||||
</div>
|
||||
|
||||
<!-- <div class="icon-yes" v-if="item.stepType == 1 || item.stepType == 0 || item.stepType == 3">
|
||||
<img src="./components/agree.png" alt="" />
|
||||
</div>
|
||||
|
||||
<div class="" v-else-if="item.stepType == 2"></div>
|
||||
|
||||
<div class="icon-no" v-else>
|
||||
<img src="./components/clearn.png" />
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<!-- <div :class="item.stepType == 1 || item.stepType == 0 || item.stepType == 3 ? 'solid' : 'dashed'"></div> -->
|
||||
</div>
|
||||
|
||||
<div class="item-right">
|
||||
<div class="time-info">
|
||||
<div>
|
||||
title
|
||||
<!-- {{ item.title }} -->
|
||||
</div>
|
||||
<span>
|
||||
approvalTime
|
||||
<!-- {{ item.approvalTime }} -->
|
||||
</span>
|
||||
</div>
|
||||
<div class="item-right-flex">
|
||||
<!-- 1人或签 -->
|
||||
<span class="title2">
|
||||
title2
|
||||
<!-- {{ item.title2 }} -->
|
||||
</span>
|
||||
|
||||
<!-- 审批中 -->
|
||||
<span class="title2Desc-ing">
|
||||
<!-- v-if="item.stepType == 9" -->
|
||||
title2Desc
|
||||
<!-- {{ item.title2Desc }} -->
|
||||
</span>
|
||||
|
||||
<!--已拒绝 -->
|
||||
<!-- <span class="title2Desc-false" v-else-if="item.stepType == 2">{{ item.title2Desc }}</span> -->
|
||||
|
||||
<!-- 审批通过 -->
|
||||
<!-- <span class="title2Desc" v-else>
|
||||
{{ item.title2Desc }}
|
||||
</span> -->
|
||||
|
||||
<!-- 抄送人/抄送人头像 -->
|
||||
<div class="user-list">
|
||||
<div class="item-right-flex-left-name" v-for="(items, i) in item.candidates" :key="i">
|
||||
<span class="avatar" v-if="items.name">{{ $formatName(items.name) }}</span>
|
||||
<span class="avatar-name" v-if="items.name">{{ items.name }}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 意见 -->
|
||||
<div v-for="(item2, inde2) in item.candidateFieldInfos" :key="inde2">
|
||||
<span>{{ item2.fieldName }} : </span>
|
||||
<span>{{ item2.fieldValue }}</span>
|
||||
</div>
|
||||
|
||||
<!-- <div v-for="(item4, index4) in this.stepList" :key="inde4">
|
||||
<span>{{ item2.fieldName }} : </span>
|
||||
<span>{{ item4.fieldValue }}</span>
|
||||
</div> -->
|
||||
|
||||
<span v-if="item.stepType == 2">
|
||||
<span>审批意见:</span>
|
||||
<span>意见111</span>
|
||||
<!-- {{ item.opinion }} -->
|
||||
</span>
|
||||
|
||||
<div class="examine" v-if="item.stepType == 2">
|
||||
<div class="examine_docx1">
|
||||
<!-- 图片 -->
|
||||
<!-- <div class="examine_img" v-if="item.pictureFiles && item.pictureFiles.length > 0" style="">
|
||||
<ai-image preview :src="pic.url" v-for="pic in item.pictureFiles" :key="pic.id" style="width: 65px; height: 75px; float: left; margin-left: 6px; margin-bottom: 4px; overflow: hidden" />
|
||||
</div> -->
|
||||
|
||||
<!-- 附件资料 -->
|
||||
<!-- <div v-if="item.annexFiles && item.annexFiles.length > 0">
|
||||
<div v-for="annex in item.annexFiles" :key="annex.id" class="docx">
|
||||
<ai-image :file="annex" preview>
|
||||
<u-row justify="space-between">
|
||||
<span class="docx-name">{{ annex.name }}</span>
|
||||
<span>{{ annex.fileSizeStr }}</span>
|
||||
</u-row>
|
||||
</ai-image>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 附件资料 -->
|
||||
<!-- v-if="item.stepType == 8" -->
|
||||
<!-- <div class="examine" v-if="item.stepType == 1 || item.stepType == 0 || item.stepType == 3">
|
||||
<div class="examine_docx1">
|
||||
<div class="examine_img" v-if="item.pictureFiles && item.pictureFiles.length > 0" style="">
|
||||
<ai-image preview :src="pic.url" v-for="pic in item.pictureFiles" :key="pic.id" style="width: 69px; height: 75px; float: left; margin-left: 4px; margin-bottom: 4px; overflow: hidden" />
|
||||
</div>
|
||||
|
||||
<div v-if="item.annexFiles && item.annexFiles.length > 0">
|
||||
<div v-for="annex in item.annexFiles" :key="annex.id" class="docx">
|
||||
<ai-image :file="annex" preview>
|
||||
<u-row justify="space-between">
|
||||
<span class="docx-name">{{ annex.name }}</span>
|
||||
<span>{{ annex.fileSizeStr }}</span>
|
||||
</u-row>
|
||||
</ai-image>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="reject_agree">
|
||||
<!-- v-if="canApproval && list.approvalStatus == 0" -->
|
||||
<div class="reject" @click="agree(0)">拒绝</div>
|
||||
<div class="agre" @click="agree(1)">同意</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
name: 'detail',
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {}
|
||||
computed: {
|
||||
...mapState(['user']),
|
||||
|
||||
// canApproval() {
|
||||
// return this.listType == 0
|
||||
// },
|
||||
},
|
||||
created(options) {
|
||||
// this.detailId = options.id
|
||||
// this.listType = options.listType
|
||||
// this.getDetail()
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
detailId: '',
|
||||
list: [],
|
||||
list_tabs: [
|
||||
{
|
||||
name: '申请表单',
|
||||
},
|
||||
{
|
||||
name: '流程信息',
|
||||
},
|
||||
],
|
||||
current: 0,
|
||||
// inforlist: [],
|
||||
// stepList: [],
|
||||
// dictList: ['hbDepartment'],
|
||||
pageShow: true,
|
||||
// listType: 0,
|
||||
// eventChannel: null,
|
||||
}
|
||||
},
|
||||
// 方法
|
||||
methods: {
|
||||
getDetail() {
|
||||
// this.$http.post(`/app/approv-alapply-info/info-id-table?id=${this.detailId}`).then((res) => {
|
||||
// if (res.code == 0) {
|
||||
// if (res.data) {
|
||||
// this.list = res.data
|
||||
// console.log(res.data)
|
||||
// if (res.data.createUserAvatar) {
|
||||
// console.log(res.data.createUserAvatar)
|
||||
// }
|
||||
// this.inforlist = [[], [], [], [], [], [], [], [], [], []]
|
||||
// res.data.tableInfo.tableFieldInfos.map((item) => {
|
||||
// if (item.groupIndex) {
|
||||
// this.inforlist[item.groupIndex - 1].push(item)
|
||||
// }
|
||||
// if (item.dictionaryCode) {
|
||||
// this.dictList.push(item.dictionaryCode)
|
||||
// }
|
||||
// if (item.fieldDataType == 5) {
|
||||
// // item.fieldValue = item.fieldValue.split(',')
|
||||
// }
|
||||
// })
|
||||
// this.$dict.load(this.dictList).then(() => {
|
||||
// this.pageShow = true
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
// this.$http.post(`/app/approv-alapply-info/processinfo-id2?id=${this.detailId}`).then((res) => {
|
||||
// if (res.code == 0) {
|
||||
// if (res.data) {
|
||||
// this.stepList = res.data
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
},
|
||||
|
||||
change(i) {
|
||||
this.current = i
|
||||
},
|
||||
|
||||
agree(type) {
|
||||
console.log(type)
|
||||
// this.$http
|
||||
// .post(`/app/approv-alapply-info/approval-popup?type=${type}&id=${this.detailId}`)
|
||||
// .then((res) => {
|
||||
// if (res.code == 0) {
|
||||
// uni.navigateTo({
|
||||
// url: `/pages/workonline/approvalopinion?id=${this.detailId}&type=${type}`,
|
||||
// })
|
||||
// }
|
||||
// })
|
||||
// .catch((e) => {
|
||||
// uni.showToast({
|
||||
// title: e,
|
||||
// icon: 'none',
|
||||
// })
|
||||
// })
|
||||
},
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created() {},
|
||||
mounted() {},
|
||||
methods: {},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.detail {
|
||||
height: 100%;
|
||||
.top {
|
||||
background-color: #eff4ff;
|
||||
height: 144px;
|
||||
padding: 32px 0 0 32px;
|
||||
color: #3a7ee2;
|
||||
font-size: 28px;
|
||||
.save {
|
||||
margin-top: 8px;
|
||||
.clicksave {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form {
|
||||
padding: 32px;
|
||||
background-color: #fff;
|
||||
|
||||
.text {
|
||||
font-size: 40px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.people {
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
justify-content: space-between;
|
||||
// margin-top: 20px;
|
||||
height: 122px;
|
||||
line-height: 122px;
|
||||
border-bottom: 1px solid #eee;
|
||||
padding-bottom: 10px;
|
||||
|
||||
.people_msg {
|
||||
.avatar {
|
||||
display: inline-block;
|
||||
width: 84px;
|
||||
height: 84px;
|
||||
line-height: 84px;
|
||||
border-radius: 50%;
|
||||
background-color: #2266ff;
|
||||
color: #fff;
|
||||
font-size: 28px;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.name {
|
||||
display: inline-block;
|
||||
width: 145px;
|
||||
vertical-align: middle;
|
||||
|
||||
.name_con {
|
||||
font-size: 30px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
.name_createtime {
|
||||
color: #999;
|
||||
font-size: 24px;
|
||||
height: 120px;
|
||||
width: 400px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.people_status_ing {
|
||||
color: #ff8822;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.people_status_agree {
|
||||
width: 192px;
|
||||
height: 192px;
|
||||
|
||||
img {
|
||||
width: 192px;
|
||||
height: 192px;
|
||||
margin-top: -60px;
|
||||
}
|
||||
}
|
||||
|
||||
.people_status_reject {
|
||||
color: #f14242;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-top: 16px;
|
||||
|
||||
.item {
|
||||
margin-top: 16px;
|
||||
|
||||
.item_info {
|
||||
display: inline;
|
||||
font-size: 30px;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
|
||||
.annexs {
|
||||
// display: inline;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.img_text {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
width: 180px;
|
||||
height: 175px;
|
||||
|
||||
img {
|
||||
width: 180px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.text {
|
||||
position: absolute;
|
||||
bottom: 14px;
|
||||
left: -12px;
|
||||
font-size: 12px;
|
||||
width: 160px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
background-color: #000;
|
||||
opacity: 0.4;
|
||||
margin-left: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.zhuf {
|
||||
font-size: 30px;
|
||||
font-weight: 400;
|
||||
color: #1365dd;
|
||||
}
|
||||
|
||||
.liangzhu {
|
||||
font-size: 30px;
|
||||
font-weight: 400;
|
||||
color: #343d65;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tabs {
|
||||
// margin-top: 16px;
|
||||
}
|
||||
|
||||
.info {
|
||||
height: 16px;
|
||||
width: 100%;
|
||||
background-color: #eee;
|
||||
}
|
||||
|
||||
// 表单申请
|
||||
.collapse {
|
||||
// margin: 0 32px;
|
||||
// padding: 0 32px;
|
||||
::v-deep .u-collapse {
|
||||
// background-color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .u-collapse-head {
|
||||
background-color: #fff;
|
||||
padding: 0 32px;
|
||||
height: 96px;
|
||||
}
|
||||
|
||||
::v-deep .u-collapse-body {
|
||||
padding: 0 32px;
|
||||
background-color: #fafafa;
|
||||
|
||||
.u-collapse-content {
|
||||
.item_msg {
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 10px 0;
|
||||
|
||||
.msg_lef {
|
||||
width: 350px;
|
||||
font-size: 30px;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.msg_lright {
|
||||
max-width: 420px;
|
||||
word-break: break-all;
|
||||
// word-wrap: break-word;
|
||||
margin-right: 0;
|
||||
font-size: 30px;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.account {
|
||||
// .account_leave {
|
||||
// }
|
||||
.account_house {
|
||||
margin: 10px 0;
|
||||
color: #333;
|
||||
font-size: 30px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 流程信息
|
||||
.workflow {
|
||||
background-color: #fff;
|
||||
padding: 24px 32px 40px 32px;
|
||||
|
||||
// 发起申请步骤
|
||||
|
||||
.step-list {
|
||||
.step-item {
|
||||
display: flex;
|
||||
position: relative;
|
||||
justify-content: space-between;
|
||||
// align-items: center;
|
||||
padding-bottom: 40px;
|
||||
|
||||
.item-left {
|
||||
height: 100%;
|
||||
// position: relative;
|
||||
.item-left-ava-icon {
|
||||
position: relative;
|
||||
|
||||
.avatar {
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
border-radius: 50%;
|
||||
background-color: #2266ff;
|
||||
color: #fff;
|
||||
font-size: 28px;
|
||||
// vertical-align: middle;
|
||||
text-align: center;
|
||||
z-index: 999;
|
||||
|
||||
img {
|
||||
// margin: 16px 0 0 8px;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-yes {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: 50px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
// background: #fff;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
|
||||
img {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-no {
|
||||
position: absolute;
|
||||
top: 50px;
|
||||
left: 50px;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background: #ff8822;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
|
||||
img {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.solid {
|
||||
// height: 100%;
|
||||
height: calc(100%);
|
||||
border-left: 4px solid #eee;
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 40px;
|
||||
}
|
||||
|
||||
.dashed {
|
||||
// height: 100%;
|
||||
height: calc(100%);
|
||||
border-left: 4px dashed #eee;
|
||||
position: absolute;
|
||||
top: 80px;
|
||||
left: 40px;
|
||||
}
|
||||
}
|
||||
|
||||
.item-right {
|
||||
width: 590px;
|
||||
|
||||
.item-right-flex {
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
// align-items: center;
|
||||
.block {
|
||||
display: block;
|
||||
// margin-top: 124px;
|
||||
}
|
||||
|
||||
.title2 {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.title2Desc {
|
||||
display: inline-block;
|
||||
color: #2ea222;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.title2Desc-ing {
|
||||
display: inline-block;
|
||||
color: #ff8822;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.title2Desc-false {
|
||||
color: #f14242;
|
||||
display: inline-block;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.user-list {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.item-right-flex-left-name {
|
||||
margin-top: 20px;
|
||||
float: left;
|
||||
margin-right: 16px;
|
||||
text-align: center;
|
||||
|
||||
.avatar {
|
||||
display: inline-block;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
line-height: 64px;
|
||||
border-radius: 50%;
|
||||
background-color: #2266ff;
|
||||
color: #fff;
|
||||
font-size: 28px;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
// margin-left: 8px;
|
||||
}
|
||||
|
||||
.avatar-name {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.examine {
|
||||
p {
|
||||
margin: 6px 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.examine_img {
|
||||
// display: flex;
|
||||
// flex-wrap: wrap;
|
||||
// justify-content: space-between;
|
||||
// float: left;
|
||||
// img {
|
||||
// width: 134px;
|
||||
// height: 136px;
|
||||
// margin-right: 8px;
|
||||
// }
|
||||
// ::v-deep.AiImage {
|
||||
// ::v-deep.u-image__image {
|
||||
// width: 60px !important;
|
||||
// height: 60px;
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
.examine_docx1 {
|
||||
.docx {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 556px;
|
||||
padding: 16px;
|
||||
background-color: #ddd;
|
||||
margin: 6px 0;
|
||||
|
||||
.docx-name {
|
||||
width: 440px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.time-info {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
|
||||
span {
|
||||
color: #999;
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.step-item:first-child {
|
||||
.item-right {
|
||||
.item-right-flex {
|
||||
.block {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.step-item:last-child {
|
||||
.dashed {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
|
||||
.solid {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 抄送人头像
|
||||
.recipients {
|
||||
// display: flex;
|
||||
// justify-content: space-between;
|
||||
// align-items: center;
|
||||
margin: 16px 0 0 120px;
|
||||
|
||||
.recipients_content {
|
||||
// display: inline-block;
|
||||
// width: 64px;
|
||||
// height: 150px;
|
||||
margin-left: 32px;
|
||||
|
||||
.name_ava {
|
||||
display: inline-block;
|
||||
width: 120px;
|
||||
// text-align: center;
|
||||
margin-top: 5px;
|
||||
|
||||
.avatar {
|
||||
display: inline-block;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
line-height: 64px;
|
||||
border-radius: 50%;
|
||||
background-color: #2266ff;
|
||||
color: #fff;
|
||||
font-size: 28px;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
// margin-left: 8px;
|
||||
}
|
||||
|
||||
.recipients_name {
|
||||
// display: inline;
|
||||
width: 100px;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
// text-align: center;
|
||||
// background-color: pink;
|
||||
margin-top: 8px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// .recipients_content:first-child {
|
||||
// margin-left: 0;
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
.reject_agree {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
line-height: 112px;
|
||||
text-align: center;
|
||||
border-top: 1px solid #ddd;
|
||||
z-index: 999;
|
||||
background: #fff;
|
||||
|
||||
.reject {
|
||||
background-color: #fff;
|
||||
width: 50%;
|
||||
color: red;
|
||||
}
|
||||
|
||||
.agre {
|
||||
height: 112px;
|
||||
width: 50%;
|
||||
background-color: #1365dd;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user