|
|
|
@ -13,7 +13,8 @@ |
|
|
|
|
<li @click="showRecaption" class=" duration-1000">取回</li> |
|
|
|
|
</ul> |
|
|
|
|
</div> |
|
|
|
|
<el-dialog :visible.sync="takeVisible" style="width: 100%" @close="closeTake" :close-on-click-modal="false" :show-close="false" custom-class="data-dia "> |
|
|
|
|
<el-dialog :visible.sync="takeVisible" style="width: 100%" @close="closeTake" :close-on-click-modal="false" |
|
|
|
|
:show-close="false" custom-class="data-dia "> |
|
|
|
|
<div slot="title" class="dia-header"> |
|
|
|
|
<div class="data-title">取号机</div> |
|
|
|
|
<img class="close" src="@/assets/svg/close.svg" alt="" @click="closeTakeDia"> |
|
|
|
@ -21,7 +22,8 @@ |
|
|
|
|
<p class="tips">- 请选择办理的业务 -</p> |
|
|
|
|
<ul class="take-list"> |
|
|
|
|
<!-- @click="checkTake(index)" --> |
|
|
|
|
<li v-for="(item, index) in handleBusiness" :class="{checked: takeCheck == index}" :key="item.key" @click="checkTake(index)"> |
|
|
|
|
<li v-for="(item, index) in handleBusiness" :class="{ checked: takeCheck == index }" :key="item.key" |
|
|
|
|
@click="checkTake(index)"> |
|
|
|
|
<img :src="item.img" :alt="item.name" :title="item.name"> |
|
|
|
|
<p>{{ item.name }}</p> |
|
|
|
|
</li> |
|
|
|
@ -47,7 +49,8 @@ |
|
|
|
|
</div> |
|
|
|
|
</el-dialog> |
|
|
|
|
<!-- :visible.sync="takeResultVisible" --> |
|
|
|
|
<el-dialog :visible.sync="takeResultVisible" width="400px" :close-on-click-modal="false" :show-close="false" custom-class="data-dia "> |
|
|
|
|
<el-dialog :visible.sync="takeResultVisible" width="400px" :close-on-click-modal="false" :show-close="false" |
|
|
|
|
custom-class="data-dia "> |
|
|
|
|
<div slot="title" class="dia-header"> |
|
|
|
|
<div class="data-title">{{ workingName + '机' }}</div> |
|
|
|
|
<img class="close" src="@/assets/svg/close.svg" alt="" @click="takeResultVisible = false"> |
|
|
|
@ -57,11 +60,13 @@ |
|
|
|
|
<img src="@/assets/img/finish.png" alt=""> |
|
|
|
|
</div> |
|
|
|
|
<h6>{{ workingName + '成功' }}</h6> |
|
|
|
|
<p v-if="workingName === '取号'" class="text">您选择了{{ handleBusiness[takeCheck]? handleBusiness[takeCheck].name: ''}}</p> |
|
|
|
|
<p v-if="workingName === '取号'" class="text">您选择了{{ handleBusiness[takeCheck] ? handleBusiness[takeCheck].name : |
|
|
|
|
''}}</p> |
|
|
|
|
</div> |
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
<el-dialog :visible.sync="dataVisible" style="width: 100%;margin-top: -90px;" @close="closeData" :close-on-click-modal="false" :show-close="false" custom-class="data-dia"> |
|
|
|
|
<el-dialog :visible.sync="dataVisible" style="width: 100%;margin-top: -90px;" @close="closeData" |
|
|
|
|
:close-on-click-modal="false" :show-close="false" custom-class="data-dia"> |
|
|
|
|
<div slot="title" class="dia-header"> |
|
|
|
|
<div class="data-title">银行单据</div> |
|
|
|
|
<img class="close" src="@/assets/svg/close.svg" alt="" @click="closeDataDia"> |
|
|
|
@ -69,12 +74,7 @@ |
|
|
|
|
<p class="tips">- 请单击选中所需材料、双击可放大预览 -</p> |
|
|
|
|
<ul class="list"> |
|
|
|
|
<li :class="{ checked: checkList.includes(elImg[0].key) }" @click="checkData(elImg[0].key)"> |
|
|
|
|
<el-image |
|
|
|
|
:src="elImg[0].img" |
|
|
|
|
:fit="elImgFit" |
|
|
|
|
:title="elImg[0].name" |
|
|
|
|
:alt="elImg[0].name" |
|
|
|
|
></el-image> |
|
|
|
|
<el-image :src="elImg[0].img" :fit="elImgFit" :title="elImg[0].name" :alt="elImg[0].name"></el-image> |
|
|
|
|
|
|
|
|
|
<!-- <img style='width: 100%;height: 154px' src="@/assets/img/goods/accountApplyBook.jpg" alt=""> --> |
|
|
|
|
<p>{{ elImg[0].name }}</p> |
|
|
|
@ -84,20 +84,12 @@ |
|
|
|
|
<p>{{ elImg[1].name }}</p> |
|
|
|
|
</li> |
|
|
|
|
<li :class="{ checked: checkList.includes(elImg[2].key) }" @click="checkData(elImg[2].key)"> |
|
|
|
|
<el-image |
|
|
|
|
style="margin-top: 0" |
|
|
|
|
:src="elImg[2].img" |
|
|
|
|
:fit="elImgFit" |
|
|
|
|
></el-image> |
|
|
|
|
<el-image style="margin-top: 0" :src="elImg[2].img" :fit="elImgFit"></el-image> |
|
|
|
|
<p>{{ elImg[2].name }}</p> |
|
|
|
|
</li> |
|
|
|
|
<li :class="{ checked: checkList.includes(elImg[3].key) }" @click="checkData(elImg[3].key)"> |
|
|
|
|
<!-- <img class="" :src="elImg[3].img" :alt="elImg[3].name" :title="elImg[3].name"> --> |
|
|
|
|
<el-image |
|
|
|
|
style="margin-top: 0" |
|
|
|
|
:src="elImg[3].img" |
|
|
|
|
:fit="elImgFit" |
|
|
|
|
></el-image> |
|
|
|
|
<el-image style="margin-top: 0" :src="elImg[3].img" :fit="elImgFit"></el-image> |
|
|
|
|
<p :title="elImg[3].name">{{ elImg[3].name }}</p> |
|
|
|
|
</li> |
|
|
|
|
<li :class="{ checked: checkList.includes(elImg[4].key) }" @click="checkData(elImg[4].key)"> |
|
|
|
@ -110,12 +102,7 @@ |
|
|
|
|
</li> |
|
|
|
|
<li :class="{ checked: checkList.includes(elImg[6].key) }" @click="checkData(elImg[6].key)"> |
|
|
|
|
<!-- <img style="margin-top: 0" src="@/assets/img/open-account-apply-sm.png" alt=""> --> |
|
|
|
|
<el-image |
|
|
|
|
:src="elImg[6].img" |
|
|
|
|
:fit="elImgFit" |
|
|
|
|
:title="elImg[6].name" |
|
|
|
|
:alt="elImg[6].name" |
|
|
|
|
lazy></el-image> |
|
|
|
|
<el-image :src="elImg[6].img" :fit="elImgFit" :title="elImg[6].name" :alt="elImg[6].name" lazy></el-image> |
|
|
|
|
<p>{{ elImg[6].name }}</p> |
|
|
|
|
</li> |
|
|
|
|
<li :class="{ checked: checkList.includes(elImg[7].key) }" @click="checkData(elImg[7].key)"> |
|
|
|
@ -128,12 +115,7 @@ |
|
|
|
|
</li> |
|
|
|
|
<li :class="{ checked: checkList.includes(elImg[9].key) }" @click="checkData(elImg[9].key)"> |
|
|
|
|
<!-- <img style="margin-top: 0" src="@/assets/img/open-account-apply-sm.png" alt=""> --> |
|
|
|
|
<el-image |
|
|
|
|
:src="elImg[9].img" |
|
|
|
|
:fit="elImgFit" |
|
|
|
|
:title="elImg[9].name" |
|
|
|
|
:alt="elImg[9].name" |
|
|
|
|
lazy></el-image> |
|
|
|
|
<el-image :src="elImg[9].img" :fit="elImgFit" :title="elImg[9].name" :alt="elImg[9].name" lazy></el-image> |
|
|
|
|
<p>{{ elImg[9].name }}</p> |
|
|
|
|
</li> |
|
|
|
|
<li :class="{ checked: checkList.includes(elImg[10].key) }" @click="checkData(elImg[10].key)"> |
|
|
|
@ -160,21 +142,19 @@ |
|
|
|
|
</div> |
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
<el-dialog :visible.sync="copyVisible" style="width: 100%" @close="closeData" :close-on-click-modal="false" :show-close="false" custom-class="data-dia "> |
|
|
|
|
<el-dialog :visible.sync="copyVisible" style="width: 100%" @close="closeData" :close-on-click-modal="false" |
|
|
|
|
:show-close="false" custom-class="data-dia "> |
|
|
|
|
<div slot="title" class="dia-header"> |
|
|
|
|
<div class="data-title">复印</div> |
|
|
|
|
<img class="close" src="@/assets/svg/close.svg" alt="" @click="closeCopyDia"> |
|
|
|
|
</div> |
|
|
|
|
<p class="tips">- 请单击选中复印材料、双击可放大预览 -</p> |
|
|
|
|
<ul class="flex justify-center"> |
|
|
|
|
<div v-for="item in elImg2" class="list flex-col spacialStyle" style="justify-content: flex-start" @click="checkData(item.key, item.copyState)" :key="item.key"> |
|
|
|
|
<div v-for="item in elImg2" class="list flex-col spacialStyle" style="justify-content: flex-start" |
|
|
|
|
@click="checkData(item.key, item.copyState)" :key="item.key"> |
|
|
|
|
<li :class="{ checked: checkList.includes(item.key) }"> |
|
|
|
|
<!-- <img :src="item.img" :title="item.name" :alt="item.name"> --> |
|
|
|
|
<el-image |
|
|
|
|
style="margin-top: -10" |
|
|
|
|
:src="item.img" |
|
|
|
|
:fit="elImgFit" |
|
|
|
|
></el-image> |
|
|
|
|
<el-image style="margin-top: -10" :src="item.img" :fit="elImgFit"></el-image> |
|
|
|
|
<p>{{ item.name }}</p> |
|
|
|
|
</li> |
|
|
|
|
<p>{{ item.copyState ? '已复印' : ' ' }}</p> |
|
|
|
@ -186,20 +166,19 @@ |
|
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-dialog :visible.sync="recaptionVisible" style="width: 100%" @close="closeData" :close-on-click-modal="false" :show-close="false" custom-class="data-dia "> |
|
|
|
|
<el-dialog :visible.sync="recaptionVisible" style="width: 100%" @close="closeData" :close-on-click-modal="false" |
|
|
|
|
:show-close="false" custom-class="data-dia "> |
|
|
|
|
<div slot="title" class="dia-header"> |
|
|
|
|
<div class="data-title">取回</div> |
|
|
|
|
<img class="close" src="@/assets/svg/close.svg" alt="" @click="closeRecaption"> |
|
|
|
|
</div> |
|
|
|
|
<p class="tips">- 请单击选中复印材料、双击可放大预览 -</p> |
|
|
|
|
<ul class="flex justify-center flex-wrap"> |
|
|
|
|
<div v-for="item in elImg3" class="list flex-col spacialStyle" style="justify-content: flex-start" @click="checkData(item.key, item.returnState)" :key="item.key"> |
|
|
|
|
<div v-for="item in elImg3" class="list flex-col spacialStyle" style="justify-content: flex-start" |
|
|
|
|
@click="checkData(item.key, item.returnState)" :key="item.key"> |
|
|
|
|
<li :class="{ checked: checkList.includes(item.key) }"> |
|
|
|
|
<!-- <img :src="item.img" :title="item.name" :alt="item.name"> --> |
|
|
|
|
<el-image |
|
|
|
|
:src="item.img" |
|
|
|
|
:fit="elImgFit" |
|
|
|
|
></el-image> |
|
|
|
|
<el-image :src="item.img" :fit="elImgFit"></el-image> |
|
|
|
|
<p :title="item.name">{{ item.name }}</p> |
|
|
|
|
</li> |
|
|
|
|
<p>{{ item.returnState ? '已取回' : (item.copy ? '复印件' : '') }}</p> |
|
|
|
@ -236,11 +215,7 @@ |
|
|
|
|
</el-dialog> --> |
|
|
|
|
|
|
|
|
|
<!-- 图片查看器 --> |
|
|
|
|
<el-dialog |
|
|
|
|
custom-class="data-dia imgIndex" |
|
|
|
|
:visible.sync="showImg" |
|
|
|
|
width="800px" |
|
|
|
|
> |
|
|
|
|
<el-dialog custom-class="data-dia imgIndex" :visible.sync="showImg" width="800px"> |
|
|
|
|
<img :src="imgSrc" class="imgPop imgIndex min-w-full " alt=""> |
|
|
|
|
</el-dialog> |
|
|
|
|
</div> |
|
|
|
@ -667,12 +642,15 @@ export default { |
|
|
|
|
width: 100%; |
|
|
|
|
//min-height:900px; |
|
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
|
|
.sth { |
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
|
|
&.cp { |
|
|
|
|
cursor: pointer; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.guide { |
|
|
|
|
top: 80px; |
|
|
|
|
left: 10px; |
|
|
|
@ -690,6 +668,7 @@ export default { |
|
|
|
|
opacity: .9; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.manager { |
|
|
|
|
top: 68px; |
|
|
|
|
left: 10%; |
|
|
|
@ -697,6 +676,7 @@ export default { |
|
|
|
|
height: calc(100% - 68px); |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.actions { |
|
|
|
|
position: fixed; |
|
|
|
|
bottom: 0; |
|
|
|
@ -706,9 +686,11 @@ export default { |
|
|
|
|
background-color: rgba(255, 255, 255, .7); |
|
|
|
|
border-top-left-radius: 20px; |
|
|
|
|
border-top-right-radius: 20px; |
|
|
|
|
|
|
|
|
|
.btns { |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
|
|
li { |
|
|
|
|
width: 200px; |
|
|
|
|
margin-right: 50px; |
|
|
|
@ -719,12 +701,14 @@ export default { |
|
|
|
|
background: url(../../../assets/img/lobby-btn-bg.png) 0 0/cover no-repeat; |
|
|
|
|
background-size: 100% 100%; |
|
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
|
|
&:last-child { |
|
|
|
|
margin-right: 0; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/deep/.data-dia { |
|
|
|
|
// width:80%; |
|
|
|
|
width: 800px; |
|
|
|
@ -736,12 +720,14 @@ export default { |
|
|
|
|
margin-top: 20px; |
|
|
|
|
max-height: 95%; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.take-list { |
|
|
|
|
width: 600px; |
|
|
|
|
margin: 0 auto; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
|
|
|
|
|
li { |
|
|
|
|
display: inline-flex; |
|
|
|
|
align-items: center; |
|
|
|
@ -751,16 +737,20 @@ export default { |
|
|
|
|
border-radius: 20px; |
|
|
|
|
cursor: pointer; |
|
|
|
|
background-color: rgba(216, 216, 216, 0.10); |
|
|
|
|
|
|
|
|
|
&:first-child { |
|
|
|
|
margin: 0 0px 30px 0; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&:last-child { |
|
|
|
|
//margin-left: 30px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
img { |
|
|
|
|
margin-left: 10px; |
|
|
|
|
width: 30%; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
p { |
|
|
|
|
font-size: 18px; |
|
|
|
|
color: #000; |
|
|
|
@ -768,34 +758,41 @@ export default { |
|
|
|
|
font-weight: bold; |
|
|
|
|
padding: 0 15px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&.checked { |
|
|
|
|
background: rgba(97, 145, 255, 0.10) url(../../../assets/svg/checked.svg) 96% 7%/auto no-repeat; |
|
|
|
|
border-color: #6191FF; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.result { |
|
|
|
|
margin: 30px 0 20px; |
|
|
|
|
text-align: center; |
|
|
|
|
|
|
|
|
|
img { |
|
|
|
|
width: 136px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
h6 { |
|
|
|
|
margin: 30px 0 10px; |
|
|
|
|
font-size: 30px; |
|
|
|
|
color: #000; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.text { |
|
|
|
|
font-size: 22px; |
|
|
|
|
color: #797979; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
.list { |
|
|
|
|
min-width: 5vw; |
|
|
|
|
overflow: auto; |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
|
|
|
|
|
li { |
|
|
|
|
width: 140px; |
|
|
|
|
height: 140px; |
|
|
|
@ -809,18 +806,22 @@ export default { |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
overflow: hidden; |
|
|
|
|
padding: 10px; |
|
|
|
|
|
|
|
|
|
&>img { |
|
|
|
|
max-height: 80px; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
&>.el-image { |
|
|
|
|
width: 100%; |
|
|
|
|
max-height: 80px; |
|
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
|
|
img { |
|
|
|
|
//transform: translateY(-35%); |
|
|
|
|
// width: 100%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
p { |
|
|
|
|
font-size: 14px; |
|
|
|
|
line-height: 40px; |
|
|
|
@ -838,6 +839,7 @@ export default { |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: center; |
|
|
|
|
flex-wrap: wrap; |
|
|
|
|
|
|
|
|
|
li { |
|
|
|
|
width: 140px; |
|
|
|
|
height: 140px; |
|
|
|
@ -851,6 +853,7 @@ export default { |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
overflow: hidden; |
|
|
|
|
padding: 10px; |
|
|
|
|
|
|
|
|
|
// &>img { |
|
|
|
|
// width: 100%; |
|
|
|
|
// //max-width: 90%; |
|
|
|
@ -859,11 +862,13 @@ export default { |
|
|
|
|
width: 100%; |
|
|
|
|
max-height: 80px; |
|
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
|
|
img { |
|
|
|
|
//transform: translateY(-35%); |
|
|
|
|
// width: 100%; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
p { |
|
|
|
|
font-size: 14px; |
|
|
|
|
line-height: 40px; |
|
|
|
|