diff --git a/src/views/caseList/caseDetail.vue b/src/views/caseList/caseDetail.vue index 0204f06e..e68b9dca 100644 --- a/src/views/caseList/caseDetail.vue +++ b/src/views/caseList/caseDetail.vue @@ -2,7 +2,7 @@
-
- {{ item.name }} + {{ item.name }} + {{item.num}}
-
-
审核批次PC1234123443243232131
-
报销金额300
-
案件数量30
-
提交人员张三
-
提交时间2023-11-22 12:12:00
+
+
审核批次:PC1234123443243232131
+
+ +
待审核
+ +
+
报销金额:1238元
+
+
+
+
审核批次:PC1234123443243232131
+
+ +
不通过
+ +
+
+
报销金额:1238元
+
审核备注:缺失凭证照片
+
+
+
+
审核批次:PC1234123443243232131
+
+ +
审核通过
+ +
+
+
报销金额:1238元
-
+
@@ -36,11 +62,11 @@ import {myMixins} from "@/utils/myMixins"; export default { - name: "caseDetail", + name: "caseList", mixins: [myMixins], data(){ return{ - tabArr: [{name: '待审核', status: 1}, {name: '审核通过', status: 2},{name: '审核不通过', status: 3},], + tabArr: [{name: '待审核', status: 1,num:1}, {name: '审核通过', status: 2,num:3},{name: '审核不通过', status: 2,num:4},], activeIndex: 0, pageList:[], pageNum:1, @@ -50,6 +76,7 @@ export default { methods:{ async changeTab(index) { this.activeIndex = index + console.log(' this.activeIndex', this.activeIndex) this.pageNum = 1 this.pageList = []; if(this.activeIndex === 0){ @@ -59,6 +86,18 @@ export default { } // await this.getList() }, + goPageDetail(){ + console.log("去查看详情") + this.$router.push({ + name: 'caseDetail', // 目标路由的名称 + /* params: { + id: item.id, // 参数对象的属性 + postfix:item.postfix, + index:this.activeIndex, + queryTime: this.time || this.queryTime + }*/ + }); + }, } } @@ -73,51 +112,113 @@ export default { .navBar{ margin-bottom: 46px; } +::v-deep .van-nav-bar__content{ + background-color: #354683 !important; +} .tab_wrap { - @include fontWeightSize(bolder, 15px); - display: flex; - justify-content: space-around; - padding: 5px 0 5px 0; - @include colorOpa(#737373,0.7); + @include fontWeightSize(500, 14px); + @include flexColAround(); + padding: 2px 0 10px 0; + background: #354683; div { padding-top: 8px; + color: #FFFFFF; + } + .alpha{ + opacity: 0.5; + } + .numTip{ + display: inline-block; + @include wh(15px,15px); + @include bgcolorOpa(#F95B45,0.9); + border-radius: 4px; + text-align: center; + line-height: 15px; + margin-left: 5px; + opacity: 1; /* 保持透明度为1 */ } .active { - color: #3678FF; position: relative; + opacity: 1; } .active:after { content: ''; display: block; - @include wh(50px,3px); - background: linear-gradient(270deg, #33A3FF 0%, #176AFE 100%); - border-radius: 2px; + @include wh(18px,2px); + opacity: .8; + background: #FFFFFF; position: absolute; + border-radius: 2px; margin-top: 3px; left: 50%; + opacity: 1; transform: translateX(-50%); } } .listWrap{ width: 100%; + height: calc(100% - 86px); + overflow-y: auto; + background-color: #F4F5F7; .listItem{ width: 100%; - //@include wh(100%,200px); - padding: 12px 12px; box-sizing: border-box; - .item{ - @include wh(100%,100%); - box-sizing: border-box; - padding: 6px 0; - border-bottom: 1px solid #cccccc; - border-top: 1px solid #cccccc; - div{ - line-height: 22px; - span:first-child{ - display: inline-block; - margin-right: 8px; - } + padding: 14px 25px 13px 29px; + background-color: #FFFFFF; + margin-bottom: 10px; + .line1{ + @include flexColBet(); + .viewBtn{ + @include wh(48px,18px); + text-align: center; + line-height: 18px; + background: #354D93; + border-radius: 3px; + color: #FFFFFF; + } + } + div{ + line-height: 27px; + span:first-child{ + display: inline-block; + width: 60px; + opacity: 0.5; + } + .right{ + @include flexCenter(); } } } -} \ No newline at end of file +} +.greColor{ + color:#38AD00 ; + font-weight: 500; +} +.redColor{ + color:#FF5D2E ; + font-weight: 500; +} +.commonImg{ + @include widHeiMar(13px,13px,4px); +} +.rightArrImg{ + @include wh(6px,9px); + margin-left: 6px; +} +.yelColor{ + color: #E69B0B; + font-weight: 600; +} +.greColor{ + color: #56B628; + font-weight: 600; +} +.oraColor{ + color: #FF5D2E; + font-weight: 600; +} +.garyColor{ + color: #9C9C9C; + font-weight: 600; +} +