Skip to content

F
founder_vue
Commit b4ac62d7 by maxiaohan
Options

查重-卡片

parent 166cc135
Showing with 289 additions and 82 deletions
src/assets/css/el-table-style.css
......@@ -57,28 +57,28 @@ width: 100%;
line-height: 16px;
}
.tt_candidate_table{
width:100%
}
/* 修改表头内容 */
.tt_candidate_table .el-table__header-wrapper th {
width: 340px;
height: 32px;
background: #F6F8FA;/*width: 352px;*/
font-size: 14px;color: #282F3C;
line-height: 22px;
}
/* 修改表格里内容 */
.tt_candidate_table .el-table__body-wrapper tr td {
width: 340px;
height: 24px;
background: #FFFFFF;
font-size: 12px;
font-family: MicrosoftYaHei;
color: #333333;
line-height: 16px;
}
/* 选中的颜色 */
.tt_candidate_table tbody tr.current-row > td {
background: #F5F5F7;
}
\ No newline at end of file
/*.tt_candidate_table{*/
/* width:100%*/
/*}*/
/*!* 修改表头内容 *!*/
/*.tt_candidate_table .el-table__header-wrapper th {*/
/* width: 340px;*/
/* height: 32px;*/
/* background: #F6F8FA;!*width: 352px;*!*/
/* font-size: 14px;color: #282F3C;*/
/* line-height: 22px;*/
/*}*/
/*!* 修改表格里内容 *!*/
/*.tt_candidate_table .el-table__body-wrapper tr td {*/
/* width: 340px;*/
/* height: 24px;*/
/* background: #FFFFFF;*/
/* font-size: 12px;*/
/* font-family: MicrosoftYaHei;*/
/* color: #333333;*/
/* line-height: 16px;*/
/*}*/
/*!* 选中的颜色 *!*/
/*.tt_candidate_table tbody tr.current-row > td {*/
/* background: #F5F5F7;*/
/*}*/
\ No newline at end of file
src/views/cxyrd/QueryConfirm.vue
......@@ -384,14 +384,6 @@
</div>
</div>
<!--历史信息弹窗-->
<!-- <el-dialog title="提示" :visible.sync="historyDialogVisible" width="30%">-->
<!-- <span>这是一段信息</span>-->
<!-- &lt;!&ndash; <el-button @click="historyDialogVisible = false">取 消</el-button>&ndash;&gt;-->
<!-- &lt;!&ndash; <el-button type="primary" @click="historyDialogVisible = false"&ndash;&gt;-->
<!-- &lt;!&ndash; >确 定</el-button&ndash;&gt;-->
<!-- >-->
<!-- </el-dialog>-->
<el-dialog :visible.sync="historyDialogVisible" style="z-index: 1500">
</el-dialog>
</div>
......
src/views/cxyrd/TT.scss
......@@ -171,4 +171,28 @@
}
}
}
}
.tt-detail{
z-index: 1000;
position: absolute;
display: flex;
flex-direction: column;
//top: auto;
//top: calc(50% - 470px);
//left: calc(50% - 100px);
.head-title{
width: 32px;
height: 28px;
font-size: 16px;
font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
font-weight: bold;
color: #333333;
line-height: 28px;
}
.finger{
border: #001e33 1px solid;
width: 400px;
height: 400px;
}
}
\ No newline at end of file
src/views/cxyrd/TT.vue
......@@ -3,19 +3,52 @@
<div class="header">
<div class="label">查重</div>
<div class="btns">
<div style="border: black 1px solid" @click="showDetail">详情</div>
<div class="bz-btn" @click="Bz">比中</div>
<div class="rd-btn" @click="Rdwc">认定完成</div>
</div>
</div>
<div class="tt_main">
<div class="tt_main_top">
<div class="tt_main_top_button">
<el-button type="primary" @click="finger">指纹</el-button>
<el-button type="primary" @click="plam">掌纹</el-button>
<el-button type="primary" @click="face">人像</el-button>
<div class="main">
<div class="data">
<div class="source-data">
<div class="source-top">
<div class="barcode">任务号：{{ qid }}</div>
<div class="count">
<img
src="../../assets/img/TT/ttcount.png"
style="width: 14px;height: 14px;margin:0 5px 3px 0"
/>已认定：{{ qid }}条
</div>
</div>
<div class="source-bottom">
<div class="source-count">34/100</div>
<div class="source">
<div class="label">查询ID：</div>
<div class="value">123456</div>
</div>
<div class="source">
<div class="label">源条码号：</div>
<div class="value">A2323232323232323232</div>
</div>
<div class="more">
<div class="last">
<img src="../../assets/img/TT/last.png" />
<!-- <img src="../../assets/img/TT/last-active.png" />-->
</div>
<div class="next">
<!-- <img src="../../assets/img/TT/next.png" />-->
<img src="../../assets/img/TT/next-active.png" />
</div>
</div>
</div>
</div>
<div class="tt_main_top_table">
<span>源条码号:{{ barcode }}</span>
<div class="btns">
<div class="btn" @click="finger">指纹</div>
<div class="btn" @click="plam">掌纹</div>
<div class="btn" @click="face">人像</div>
</div>
<div class="dest-data">
<el-table
highlight-current-row
:data="tableData"
......@@ -41,14 +74,33 @@
</el-table>
</div>
</div>
<div class="imgs"></div>
</div>
<div class="tt_main">
<!-- <div class="tt_main_top" style="border:deeppink 1px solid ">-->
<!-- <div class="tt_main_top_button">-->
<!-- </div>-->
<!-- &lt;!&ndash; <div class="tt_main_top_table">&ndash;&gt;-->
<!-- &lt;!&ndash; <span>源条码号:{{ barcode }}</span>&ndash;&gt;-->
<!-- &lt;!&ndash; </div>&ndash;&gt;-->
<!-- </div>-->
<div class="tt_main_bottom">
<div class="tt_main_bottom_finger middle">
<t-t-finger-print v-show="isFinger === true"></t-t-finger-print>
<t-t-plam v-show="isPlam === true"></t-t-plam>
<t-t-face v-show="isFace === true"></t-t-face>
</div>
<!-- <div class="tt_main_bottom_finger middle">-->
<!-- <t-t-finger-print v-show="isFinger === true"></t-t-finger-print>-->
<!-- <t-t-plam v-show="isPlam === true"></t-t-plam>-->
<!-- <t-t-face v-show="isFace === true"></t-t-face>-->
<!-- </div>-->
</div>
</div>
<!-- 指纹详情 -->
<div class="bzDialog" v-show="isShowDetailBg" @click="cancelDetail"></div>
<div class="tt-detail" v-show="isShowDetail">
<div class="head-title">拇指</div>
<div class="finger">a</div>
<div class="finger">b</div>
</div>
<!-- 比中弹窗 -->
<div class="bzDialog" v-show="isShowbzDialogBg" @click="cancelbz"></div>
<div class="bzcontent" v-show="isShowbzDialog">
......@@ -160,6 +212,8 @@ export default {
barcode: null,
isShowbzDialog: false,
isShowbzDialogBg: false,
isShowDetail: false,
isShowDetailBg: false,
phone: null,
radio: 6,
textarea: "",
......@@ -216,23 +270,25 @@ export default {
this.isFinger = false;
this.isPlam = false;
},
/**
* @description: 取消比中
* @param {*}
* @return {*}
*/
// 取消比中
cancelbz() {
this.isShowbzDialogBg = false;
this.isShowbzDialog = false;
this.isShowbzDialogBg = false;
},
/**
* @description: 确认比中
* @param {*}
* @return {*}
*/
// 确认比中
confirmbz() {
let self = this;
console.log("比中");
},
// 展示详情
showDetail() {
this.isShowDetail = true;
this.isShowDetailBg = true;
},
// 取消详情
cancelDetail() {
this.isShowDetail = false;
this.isShowDetailBg = false;
}
},
mounted() {
......@@ -247,7 +303,7 @@ div {
padding: 0;
display: inline-block;
/*border: #0cc106 1px solid;*/
/*border: none;*/
///*border: none;*/
}
.tt {
width: 100%;
......@@ -258,7 +314,9 @@ div {
flex-direction: column;
}
.header {
height: 42px;
border-bottom: 2px solid #eeeeee;
height: 52px;
padding-bottom: 10px;
display: flex;
flex-direction: row;
justify-content: space-between;
......@@ -267,36 +325,168 @@ div {
width: 32px;
height: 22px;
font-size: 16px;
font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
font-weight: bold;
color: #333333;
line-height: 22px;
margin-top: 14px;
}
.btns {
align-self: flex-end;
//margin-right: 50px;
margin-top: 18px;
color: #ffffff;
font-size: 14px;
line-height: 22px;
.bz-btn {
width: 96px;
height: 32px;
background: #ff0039;
border-radius: 4px;
margin-right: 16px;
text-align: center;
line-height: 32px;
}
.rd-btn {
width: 96px;
height: 32px;
background: #055fe7;
border-radius: 4px;
text-align: center;
line-height: 32px;
}
}
}
.btns {
align-self: flex-end;
margin-right: 50px;
margin-top: 18px;
color: #ffffff;
font-size: 14px;
line-height: 22px;
.bz-btn {
width: 96px;
height: 32px;
background: #ff0039;
border-radius: 4px;
margin-right: 16px;
text-align: center;
line-height: 32px;
.main {
border: #ffa219 1px solid;
width: 100%;
display: flex;
flex-direction: column;
.data {
width: 100%;
height: 200px;
padding: 0 25px 0 25px;
border: #a2134c 1px solid;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
.source-data {
.source-top {
height: 25px;
width: 315px;
display: flex;
flex-direction: row;
justify-content: space-between;
.barcode {
width: 117px;
height: 22px;
font-size: 14px;
font-family: MicrosoftYaHei-Bold, MicrosoftYaHei;
font-weight: bold;
color: #282f3c;
line-height: 22px;
}
.count {
width: 106px;
height: 22px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #055fe7;
line-height: 22px;
}
}
.source-bottom {
width: 315px;
height: 147px;
background: #ffffff;
box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.06);
border-radius: 6px;
.source-count {
background: url("../../assets/img/TT/ttbg.png") no-repeat right top;
width: 315px;
height: 26px;
//position: absolute;
//left: 294px;
padding-right: 9px;
text-align: right;
line-height: 26px;
font-size: 12px;
color: #999999;
}
.source {
margin: 7px 0 9px 24px;
height: 20px;
.label {
width: 73px;
height: 19px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #999999;
line-height: 19px;
}
.value {
width: 191px;
height: 19px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #333333;
line-height: 19px;
}
}
.more {
border-top: #eeeeee 1px solid;
width: 315px;
height: 27px;
margin-top: 9px;
padding-top: 9px;
text-align: center;
.last {
width: 157px;
height: 20px;
border-right: #eeeeee 1px solid;
img {
margin-top: -7px;
}
}
.next {
width: 157px;
img {
margin-top: -7px;
}
}
}
}
}
.btns {
margin-top: -60px;
.btn {
width: 72px;
height: 40px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #2e3846;
line-height: 40px;
text-align: center;
border-radius: 4px;
border: 1px solid #aeb5c2;
margin: 0 12px 0 12px;
&:hover {
background: #055fe7;
color: #ffffff;
}
}
}
.dest-data {
border: #5f7b9d 1px solid;
width: 340px;
height: 160px;
}
}
.rd-btn {
width: 96px;
height: 32px;
background: #055fe7;
border-radius: 4px;
text-align: center;
line-height: 32px;
.imgs {
border: #160e02 1px solid;
width: 100%;
}
}
.tt_main .tt_main_top {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment