Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
b196a9fd by joe
Options

保单查询

1 parent 7f539609
Expand all
Inline Side-by-side
Showing 18 changed files with 284 additions and 0 deletions
import api from '@/api/api'
import {
httpGet,
httpPost
} from '@/api/fetch-api.js'
// import InsuranceQuery from './components/insurance-query'
export default {
data() {
return {
activity: "m1",
insuranceForm: {
f1 : true,
f2 : true,
f3 : true,
f4 : true,
f5 : true,
}
}
},
methods: {
initData() { },
},
created() { },
components: {
// InsuranceQuery
}
}
.content {
display: flex;
}
.left-panel {
width: 12.833333rem ;
height: 42.333333rem ;
margin-left: 3.166667rem;
.separator {
margin:auto;
width: 10.5rem ;
height: .083333rem;
background-color: #dcdddd;
}
.menu-item {
height: 5.916667rem;
line-height: 5.916667rem;
font-size: 1.5rem ;
font-weight: bold;
color: #4c4948;
text-align: center;
cursor: pointer;
i {
display: inline-block;
width: 1.666667rem ;
height: 1.666667rem;
margin-right: 1.333333rem;
vertical-align: middle;
}
.m1 {
background: url("~@/assets/images/insurance-query/m1-unselect.png") no-repeat center center;
background-size: 100% 100%;
}
.m2 {
background: url("~@/assets/images/insurance-query/m2-unselect.png") no-repeat center center;
background-size: 100% 100%;
}
.m3 {
background: url("~@/assets/images/insurance-query/m3-unselect.png") no-repeat center center;
background-size: 100% 100%;
}
.m4 {
background: url("~@/assets/images/insurance-query/m4-unselect.png") no-repeat center center;
background-size: 100% 100%;
}
.m5 {
background: url("~@/assets/images/insurance-query/m5-unselect.png") no-repeat center center;
background-size: 100% 100%;
}
.m6 {
background: url("~@/assets/images/insurance-query/m6-unselect.png") no-repeat center center;
background-size: 100% 100%;
}
}
.menu-item.activity {
color: #f05a23 !important;
.m1 {
background: url("~@/assets/images/insurance-query/m1.png") no-repeat center center;
background-size: 100% 100%;
}
.m2 {
background: url("~@/assets/images/insurance-query/m2.png") no-repeat center center;
background-size: 100% 100%;
}
.m3 {
background: url("~@/assets/images/insurance-query/m3.png") no-repeat center center;
background-size: 100% 100%;
}
.m4 {
background: url("~@/assets/images/insurance-query/m4.png") no-repeat center center;
background-size: 100% 100%;
}
.m5 {
background: url("~@/assets/images/insurance-query/m5.png") no-repeat center center;
background-size: 100% 100%;
}
.m6 {
background: url("~@/assets/images/insurance-query/m6.png") no-repeat center center;
background-size: 100% 100%;
}
}
}
.min-panel {
margin-left: .666667rem;
width: 1.166667rem;
.item {
width: 1.166667rem ;
height: 6rem;
display: flex;
justify-content: flex-start;
align-items: center;
}
.activity .triangle {
width: .583333rem;
height: 1.166667rem ;
background: url("~@/assets/images/insurance-query/triangle.png") no-repeat center center;
background-size: 100% 100%;
}
}
.right-panel {
margin-left: 1.166667rem;
width: 64.166667rem ;
background-color: #ffffff;
.panel {
display: none;
}
.activity {
display: block !important;
}
}
/** 可以抽出来作为一个插件 **/
.cell-group {
margin-bottom: 1rem /* 12/12 */;
div{
font-size: 1rem /* 12/12 */;
color: #4c4948;
}
.w1 {
min-width: 9.166667rem /* 110/12 */;
text-align: center;
}
.w2 {
min-width: 6.25rem /* 75/12 */;
text-align: center;
}
.table-header {
width: 64.166667rem /* 770/12 */;
height: 2.5rem /* 30/12 */;
border-top-left-radius: .666667rem /* 8/12 */;
border-top-right-radius: .666667rem /* 8/12 */;
background-color: #f2f2f2;
display: flex;
align-items: center;
.normal-header {
width: 58.833333rem /* 706/12 */;
margin: auto;
display: flex;
justify-content: space-between;
align-items: center;
.title {
font-size: 1rem /* 12/12 */;
font-weight: bold;
color: #575453;
}
.guide {
transition: all 0.5s;
cursor: pointer;
width: 1rem /* 12/12 */;
height: .666667rem /* 8/12 */ ;
background: url("~@/assets/images/insurance-query/triangle-down.png") no-repeat center center;
background-size: 100% 100%;
}
.rotate180 {
transform: rotate(180deg);
transition: all 0.5s;
}
}
}
.table-content {
width: 64.166667rem /* 770/12 */;
height: auto;
display: inline-block;
border-bottom-left-radius: .666667rem /* 8/12 */;
border-bottom-right-radius: .666667rem /* 8/12 */;
border-left: solid .083333rem /* 1/12 */ #f2f2f2;
border-right: solid .083333rem /* 1/12 */ #f2f2f2;
border-bottom: solid .083333rem /* 1/12 */ #f2f2f2;
padding: 0 2.583333rem /* 31/12 */;
max-height: 41.666667rem /* 500/12 */;
transition: max-height ease-out 0.3s !important;
overflow: hidden;
.data-line {
height: 4.416667rem /* 53/12 */;
margin: auto;
display: flex;
justify-content: space-between;
align-items: center;
.cell1 {
width: 29.166667rem /* 350/12 */;
display: flex;
justify-content: space-between;
margin: auto;
}
.separator-v {
height: 2.5rem /* 30/12 */;
width: .166667rem /* 2/12 */;
background-color: #f2f2f2;
margin: 0 .916667rem /* 11/12 */;
}
}
.label span {
color: #f05a23;
margin-left: .583333rem /* 7/12 */;
cursor: pointer;
text-decoration: underline;
}
.separator-h {
width: 58.833333rem /* 706/12 */;
height: .083333rem /* 1/12 */;
background-color: #f2f2f2;
}
}
.orange {
background-color: #f05a23 !important;
div {
color: #ffffff;
}
}
.hide {
max-height: 0;
border-bottom:none;
}
}
.empty-line {
height: 1.333333rem /* 16/12 */;
}
\ No newline at end of file
......@@ -88,6 +88,14 @@ const routes = [
title: ''
}
},
{
path: '/custom/service',
name: 'customService',
component: () => import('./pages/custom-service/custom-service.vue'),
meta: {
title: '保单查询'
}
},
{
path: '/demo',
......