Skip to content

dev / pingan-life-index-pro

Go to a project
Toggle navigation
Toggle navigation pinning
bc0cf6aa by simon
Options

默认提交

1 parent 3e4494f5
Inline Side-by-side
Showing 14 changed files with 494 additions and 446 deletions

566 KB | W: | H:

316 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

5.51 KB | W: | H:

4.04 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

4.63 KB | W: | H:

3.38 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

6.64 KB | W: | H:

5.71 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

6.62 KB | W: | H:

5.05 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

2.34 KB | W: | H:

2.03 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

8.52 KB | W: | H:

6.04 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin

511 Bytes | W: | H:

365 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
import api from '@/api/api'
import {
httpGet,
httpPost,
formdata
httpGet,
httpPost,
formdata
} from '@/api/fetch-api.js'
import Vue from 'vue';
import { Loading } from 'vant';
import {
Loading
} from 'vant';
Vue.use(Loading);
export default {
props: {
// 是否显示组件
options: {
type: Object,
default() {
return {
// 名称
name: "",
// 图标编号
icon: "",
// 主单证类型
imageMainTypeID: "",
// 副单证类型
imageTypeID: "",
// toast消息
toast: "",
};
}
},
icon: {
type: String,
default: ""
}
},
data() {
return {
uploadFiles: 0,
images: [],
}
},
components: {
},
computed: {
uploading() {
let len = this.images.length;
if (len < 0) {
return false;
}
for (let index = 0; index < len; index++) {
let d = this.images[index] || null;
if (!d) {
continue;
}
if (d.intervial) {
return true;
}
}
return false;
},
i18n() {
return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
},
},
methods: {
initData() {
props: {
// 是否显示组件
options: {
type: Object,
default () {
return {
// 名称
name: "",
// 图标编号
icon: "",
// 主单证类型
imageMainTypeID: "",
// 副单证类型
imageTypeID: "",
// toast消息
toast: "",
};
}
},
icon: {
type: String,
default: ""
}
},
data() {
return {
uploadFiles: 0,
images: [],
tipsVisible: false,
}
},
components: {},
computed: {
uploading() {
let len = this.images.length;
if (len < 0) {
return false;
}
for (let index = 0; index < len; index++) {
let d = this.images[index] || null;
if (!d) {
continue;
}
if (d.intervial) {
return true;
}
}
return false;
},
i18n() {
return this.$i18n.messages && this.$i18n.locale ? this.$i18n.messages[this.$i18n.locale] : {};
},
},
methods: {
initData() {
},
selectMutilFile() {
if (this.uploading) {
return;
}
this.$emit("beforeUpload", { type: this.options.imageTypeID });
let _this = this;
let input = document.createElement("input");
input.setAttribute("type", "file");
input.setAttribute("multiple", "multiple");
input.setAttribute("accept", "image/*");
input.onchange = function (val) {
let position = _this.images.length;
for (let index = 0; index < input.files.length; index++) {
setTimeout(function () {
_this.initFileUpload(input.files[index], position + index);
}, index * 50);
};
};
input.click();
},
initFileUpload(file, index) {
let _this = this;
var reader = new FileReader();
reader.onload = function (e) {
let d = {
fileName: "",
file: file,
data: reader.result,
cacheKey: "",
showMask: false,
key: _this.randomAesKey(),
intervial: false,
tips: "",
err: ""
};
_this.$set(_this.images, index, d);
_this.handleFileUpload(d, index);
}
reader.readAsDataURL(file);
},
handleFileUpload(item, index) {
item.intervial = setInterval(function () {
item.tips = item.tips + ".";
if (item.tips.length > 3) {
item.tips = "";
}
}, 1000);
this.$set(this, "images", this.images);
let param = {
file: item.file,
key: item.key
}
formdata({ url: api.uploadClarmsImage, data: param }).then(res => {
if (res && res.content && res.content.id) {
item.fileName = res.content.fileName;
item.cacheKey = res.content.id;
clearInterval(item.intervial);
item.intervial = false;
this.$set(this, "images", this.images);
this.refreshUploadNumber();
} else {
clearInterval(item.intervial);
item.intervial = false;
item.err = "失败";
this.$set(this, "images", this.images);
this.refreshUploadNumber();
}
}).catch(err => {
clearInterval(item.intervial);
item.intervial = false;
item.err = "失败";
this.$set(this, "images", this.images);
this.refreshUploadNumber();
});
},
refreshUploadNumber() {
let d = this.images.length;
let number = 0;
for (let index = 0; index < d; index++) {
let v = this.images[index] || null;
if (v && v.cacheKey) {
number++;
}
}
this.uploadFiles = number;
this.emitResult();
},
onOverHandler(event, item, index) {
item.showMask = true;
event.preventDefault();
},
onOutHandler(event, item, index) {
item.showMask = false;
event.preventDefault();
},
removeItem(index) {
let images = JSON.parse(JSON.stringify(this.images));
images.splice(index, 1);
this.$set(this, "images", images);
this.refreshUploadNumber();
},
randomAesKey() {
let chars = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z".split(",");
let res = "";
for (let i = 0; i < 16; i++) {
let id = Math.ceil(Math.random() * (chars.length - 1));
res += chars[id];
}
return res;
},
emitResult() {
if (this.images.length == 0) {
this.$emit("success", []);
return;
}
if (this.uploading) {
return;
}
let list = [];
let len = this.images.length;
if (len < 0) {
return false;
}
for (let index = 0; index < len; index++) {
let d = this.images[index] || null;
if (!d || !d.cacheKey) {
continue;
}
// 结果
let res = {
cloudStorageID: d.cacheKey,
imageFileName: d.fileName,
imageMainTypeID: this.options.imageMainTypeID,
imageTypeID: this.options.imageTypeID
}
list.push(res);
}
let result = {
type: this.options.imageTypeID,
list: list
};
this.$emit("success", result);
}
},
watch: {
},
selectMutilFile() {
if (this.uploading) {
return;
}
this.$emit("beforeUpload", {
type: this.options.imageTypeID
});
console.log("options:", this.options);
let _this = this;
let input = document.createElement("input");
input.setAttribute("type", "file");
input.setAttribute("multiple", "multiple");
input.setAttribute("accept", "image/*");
input.onchange = function (val) {
let position = _this.images.length;
for (let index = 0; index < input.files.length; index++) {
setTimeout(function () {
_this.initFileUpload(input.files[index], position + index);
}, index * 50);
};
};
input.click();
},
initFileUpload(file, index) {
let _this = this;
var reader = new FileReader();
reader.onload = function (e) {
let d = {
fileName: "",
file: file,
data: reader.result,
cacheKey: "",
showMask: false,
key: _this.randomAesKey(),
intervial: false,
tips: "",
err: ""
};
_this.$set(_this.images, index, d);
_this.handleFileUpload(d, index);
}
reader.readAsDataURL(file);
},
handleFileUpload(item, index) {
item.intervial = setInterval(function () {
item.tips = item.tips + ".";
if (item.tips.length > 3) {
item.tips = "";
}
}, 1000);
this.$set(this, "images", this.images);
let param = {
file: item.file,
key: item.key
}
formdata({
url: api.uploadClarmsImage,
data: param
}).then(res => {
if (res && res.content && res.content.id) {
item.fileName = res.content.fileName;
item.cacheKey = res.content.id;
clearInterval(item.intervial);
item.intervial = false;
this.$set(this, "images", this.images);
this.refreshUploadNumber();
} else {
clearInterval(item.intervial);
item.intervial = false;
item.err = "失败";
this.$set(this, "images", this.images);
this.refreshUploadNumber();
}
}).catch(err => {
clearInterval(item.intervial);
item.intervial = false;
item.err = "失败";
this.$set(this, "images", this.images);
this.refreshUploadNumber();
});
},
refreshUploadNumber() {
let d = this.images.length;
let number = 0;
for (let index = 0; index < d; index++) {
let v = this.images[index] || null;
if (v && v.cacheKey) {
number++;
}
}
this.uploadFiles = number;
this.emitResult();
},
onOverHandler(event, item, index) {
item.showMask = true;
event.preventDefault();
},
onOutHandler(event, item, index) {
item.showMask = false;
event.preventDefault();
},
removeItem(index) {
let images = JSON.parse(JSON.stringify(this.images));
images.splice(index, 1);
this.$set(this, "images", images);
this.refreshUploadNumber();
},
randomAesKey() {
let chars = "0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z".split(",");
let res = "";
for (let i = 0; i < 16; i++) {
let id = Math.ceil(Math.random() * (chars.length - 1));
res += chars[id];
}
return res;
},
emitResult() {
if (this.images.length == 0) {
this.$emit("success", []);
return;
}
if (this.uploading) {
return;
}
let list = [];
let len = this.images.length;
if (len < 0) {
return false;
}
for (let index = 0; index < len; index++) {
let d = this.images[index] || null;
if (!d || !d.cacheKey) {
continue;
}
// 结果
let res = {
cloudStorageID: d.cacheKey,
imageFileName: d.fileName,
imageMainTypeID: this.options.imageMainTypeID,
imageTypeID: this.options.imageTypeID
}
list.push(res);
}
let result = {
type: this.options.imageTypeID,
list: list
};
this.$emit("success", result);
},
onShowTipsOverHandler(event) {
this.tipsVisible = true;
},
onShowTipsOutHandler(event) {
this.tipsVisible = false;
}
},
watch: {
},
mounted() {
this.initData();
},
created() { }
},
mounted() {
this.initData();
},
created() {}
}
......
@import '@/styles/_support';
$borderSize: 8px;
.clarms-container {
box-sizing:border-box;
padding:.166667rem;
box-sizing: border-box;
padding: .166667rem;
border-radius: .416667rem;
background-image: linear-gradient(to right, #ffb31d, #f15907);
.clarms-box {
position: relative;
width: 100%;
height: 100%;
border-radius: .416667rem;
background-image: linear-gradient(to right , #ffb31d, #f15907) ;
background: #fff;
padding: 1.666667rem 2.5rem 0 2.5rem;
// padding: 1.666667rem 2.5rem;
.clarms-tips {
top: 20px;
left: 80px;
position: absolute;
z-index: 11;
border-radius: 2px;
padding: 2px;
background-image: linear-gradient(to right, #ffb31d, #f15907);
.cont {
@extend .bb;
padding: 4px;
width: 100%;
height: 100%;
background-color: #ffffff;
border-radius: 2px;
}
}
.clarms-header {
display: flex;
align-items: center;
padding-bottom: 1.666667rem;
.clarms-header-2 {
position: relative;
flex-grow: 1;
display: flex;
align-items: center;
}
.clarms-icon {
width: 4.166667rem;
}
}
.clarms-title-container {
margin-left: 2.5rem;
flex-grow: 1;
width: 100%;
.clarmsActivty {
color: #ffb31d !important;
}
.clarms-t1 {
font-size: 1.5rem;
color: #f15907;
letter-spacing: .166667rem;
}
.clarms-t2 {
color: #58595b;
letter-spacing: .166667rem;
}
}
.clarms-box {
width:100%;
height:100%;
border-radius: .416667rem;
background:#fff;
padding: 1.666667rem 2.5rem 0 2.5rem;
hr {
margin: 0 .833333rem 1.666667rem .833333rem;
border-top: 1px solid #dddede;
}
.clarms-btn {
background: url(~@/assets/images/clarms/button.png);
background-size: 100% 100%;
width: 10.583333rem !important;
height: 3rem;
text-align: center;
line-height: 3rem;
color: white;
letter-spacing: .166667rem;
font-size: 1.166667rem;
cursor: pointer;
}
.clarms-header {
.clarms-img-group {
display: flex;
flex-wrap: wrap;
.clarms-img-item-plugin {
cursor: pointer;
margin-right: .833333rem;
margin-bottom: .833333rem;
width: 5.833333rem;
height: 5.833333rem;
.clarms-img-item {
position: relative;
width: 5.833333rem;
height: 5.833333rem;
.clarms-img-cont {
width: 5.833333rem;
height: 5.833333rem;
position: absolute;
left: 0;
top: 0;
}
.clarms-img-mask {
width: 5.833333rem;
height: 5.833333rem;
text-align: center;
line-height: 5.833333rem;
position: absolute;
left: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 1.666667rem;
.clarms-header-2 {
flex-grow: 1;
display: flex;
align-items: center;
}
.clarms-icon {
width: 4.166667rem;
}
}
.clarms-title-container {
margin-left: 2.5rem ;
flex-grow: 1;
width: 100%;
.clarmsActivty {
color: #ffb31d !important;
}
.clarms-t1 {
font-size: 1.5rem ;
color: #f15907;
letter-spacing: .166667rem;
}
background-color: rgba($color: #000000, $alpha: .1);
.clarms-t2 {
color: #58595b;
letter-spacing: .166667rem;
img {
width: 2.5rem;
height: 2.5rem;
}
}
}
hr {
margin: 0 .833333rem 1.666667rem .833333rem;
border-top: 1px solid #dddede ;
.mask-bg-2 {
background-color: rgba($color: #000000, $alpha: .5) !important;
color: white !important;
font-size: 1rem;
}
}
.clarms-btn {
background: url(~@/assets/images/clarms/button.png);
background-size: 100% 100%;
width: 10.583333rem !important;
height: 3rem;
text-align: center;
line-height: 3rem;
color: white;
letter-spacing: .166667rem ;
font-size: 1.166667rem;
cursor: pointer;
.clarms-upload-tips {
font-size: 1rem;
color: #58595b;
text-align: center;
}
.clarms-img-group {
display: flex;
flex-wrap: wrap;
.clarms-img-item-plugin {
cursor: pointer;
margin-right: .833333rem;
margin-bottom: .833333rem;
width: 5.833333rem;
height: 5.833333rem;
.clarms-img-item {
position: relative;
width: 5.833333rem;
height: 5.833333rem;
.clarms-img-cont {
width: 5.833333rem;
height: 5.833333rem;
position: absolute;
left: 0;
top: 0;
}
.clarms-img-mask {
width: 5.833333rem;
height: 5.833333rem;
text-align: center;
line-height: 5.833333rem;
position: absolute;
left: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
background-color: rgba($color: #000000, $alpha: .1);
img {
width: 2.5rem ;
height: 2.5rem ;
}
}
.mask-bg-2 {
background-color: rgba($color: #000000, $alpha: .5) !important;
color: white !important;
font-size: 1rem;
}
}
.clarms-upload-tips {
font-size: 1rem ;
color: #58595b;
text-align: center;
}
}
}
}
.clarms-empty-line {
height: .833333rem;
}
}
}
.clarms-empty-line {
height: .833333rem;
}
}
@media (max-width: 800px) {
.clarms-container {
.clarms-box {
.clarms-header {
flex-direction: column;
.clarms-header-2{
align-self: flex-start;
}
.clarms-btn {
align-self: flex-end;
margin-top: .833333rem;
}
.clarms-icon {
width: 4.166667rem;
}
}
.clarms-title-container {
margin-top: .833333rem;
margin-left: .833333rem;
}
.clarms-container {
.clarms-box {
.clarms-header {
flex-direction: column;
.clarms-header-2 {
align-self: flex-start;
}
.clarms-btn {
align-self: flex-end;
margin-top: .833333rem;
}
.clarms-icon {
width: 4.166667rem;
}
}
.clarms-title-container {
margin-top: .833333rem;
margin-left: .833333rem;
}
}
}
}
@media (max-width: 600px) {
.clarms-container .clarms-box .clarms-title-container .clarms-t1{
font-size: 1.333333rem ;
}
.clarms-container .clarms-box .clarms-title-container .clarms-t1 {
font-size: 1.333333rem;
}
.clarms-container .clarms-box .clarms-title-container .clarms-t2{
font-size: 1.333333rem ;
}
.clarms-container .clarms-box .clarms-title-container .clarms-t2 {
font-size: 1.333333rem;
}
}
@media (max-width: 500px) {
.clarms-container .clarms-box .clarms-title-container .clarms-t1{
font-size: 1rem;
}
.clarms-container .clarms-box .clarms-title-container .clarms-t1 {
font-size: 1rem;
}
.clarms-container .clarms-box .clarms-title-container .clarms-t2{
font-size: 1rem;
}
}
\ No newline at end of file
.clarms-container .clarms-box .clarms-title-container .clarms-t2 {
font-size: 1rem;
}
}
......
<template>
<div>
<div class="clarms-container">
<div class="clarms-box">
<div class="clarms-header">
<div class="clarms-header-2">
<img class="clarms-icon" :src='icon'>
<div class="clarms-title-container">
<div class="clarms-t1" :class="{clarmsActivty:images && images.length > 0}">{{options.name}}</div>
<div class="clarms-t2">{{$t('clarms.step2.uploadFile')}}{{uploadFiles}}</div>
</div>
</div>
<div class="clarms-btn" :class="{disabled:uploading}" @click="selectMutilFile">
{{$t('clarms.step2.btnUpload')}}
</div>
</div>
<div v-if="images && images.length > 0">
<hr>
<div class="clarms-img-group">
<div class="clarms-img-item-plugin" @mouseover="onOverHandler($event,item,index)" v-for="(item,index) in images" :key="index">
<div class="clarms-img-item">
<img class="clarms-img-cont" :src="item.data">
<div class="clarms-img-mask" v-if="item.showMask && !item.intervial && !item.err">
<img src="@/assets/images/clarms/close.png">
</div>
<div class="clarms-img-mask" v-if="item.showMask && !item.intervial && !item.err" @mouseout="onOutHandler($event,item,index)" @click="removeItem(index)">
</div>
<div class="clarms-img-mask mask-bg-2" v-if="item.intervial">
Uploading{{item.tips}}
</div>
<div class="clarms-img-mask mask-bg-2" v-if="item.err" @click="removeItem(index)">
Uploading{{item.err}}
</div>
</div>
</div>
</div>
<div class="clarms-empty-line"></div>
</div>
</div>
</div>
</div>
<div>
<div class="clarms-container">
<div class="clarms-box">
<div class="clarms-tips" v-if="tipsVisible">
<div class="cont">{{options.toast}}</div>
</div>
<div class="clarms-header">
<div class="clarms-header-2">
<div @mouseover="onShowTipsOverHandler($event)" @mouseout="onShowTipsOutHandler($event)">
<img class="clarms-icon" :src='icon'>
</div>
<div class="clarms-title-container">
<div class="clarms-t1" :class="{clarmsActivty:images && images.length > 0}">{{options.name}}</div>
<div class="clarms-t2">{{$t('clarms.step2.uploadFile')}}{{uploadFiles}}</div>
</div>
</div>
<div class="clarms-btn" :class="{disabled:uploading}" @click="selectMutilFile">
{{$t('clarms.step2.btnUpload')}}
</div>
</div>
<div v-if="images && images.length > 0">
<hr>
<div class="clarms-img-group">
<div class="clarms-img-item-plugin" @mouseover="onOverHandler($event,item,index)" v-for="(item,index) in images" :key="index">
<div class="clarms-img-item">
<img class="clarms-img-cont" :src="item.data">
<div class="clarms-img-mask" v-if="item.showMask && !item.intervial && !item.err">
<img src="@/assets/images/clarms/close.png">
</div>
<div class="clarms-img-mask" v-if="item.showMask && !item.intervial && !item.err" @mouseout="onOutHandler($event,item,index)" @click="removeItem(index)">
</div>
<div class="clarms-img-mask mask-bg-2" v-if="item.intervial">
Uploading{{item.tips}}
</div>
<div class="clarms-img-mask mask-bg-2" v-if="item.err" @click="removeItem(index)">
Uploading{{item.err}}
</div>
</div>
</div>
</div>
<div class="clarms-empty-line"></div>
</div>
</div>
</div>
</div>
</template>
<script src="./clarms-plugins-upload.js"></script>
<style lang="scss" scoped>
@import "./clarms-plugins-upload.scss";
</style>
\ No newline at end of file
</style>
......
......@@ -117,8 +117,10 @@ export default {
// let videoUrl = sessionStorage.getItem("_video_url");
// let posterUrl = sessionStorage.getItem("_poster_url");
let playerOptions = {
width: 800,
height: 450,
// width: 800,
// height: 450,
width: 1200,
height: 675,
// aspectRatio: '16:9', // 将播放器置于流畅模式，并在计算播放器的动态大小时使用该值。值应该代表一个比例 - 用冒号分隔的两个数字（例如"16:9"或"4:3"）
autoplay: false, //如果true,浏览器准备好时开始回放。
muted: true, // 默认情况下将会消除任何音频。
......@@ -154,11 +156,11 @@ export default {
}, {
title: "不設終身保障限額"
}, {
title: "一家投保<br>盡享稅務扣減"
title: "一家投保 盡享稅務扣減"
}, {
title: "承保投保前未知的已有疾病"
}, {
title: "出院免找數<br>讓您安心無憂"
title: "出院免找數 讓您安心無憂"
}, {
title: "無索償折扣"
}];
......
......@@ -16,7 +16,7 @@
// banner 轮播
.banner-contaner {
width: 100%;
height: 791px;
height: 502px;
margin: 0 auto;
position: relative;
z-index: 1;
......@@ -50,20 +50,20 @@
// top: 272px;
// left: 1228px;
// top: 310px;
top: 562px;
left: 379px;
top: 309px;
left: 466px;
display: flex;
.banner-btn {
@extend .pointer;
@extend .bb;
@include btc4(288px, 60px, $fontSizeTitle);
font-size: 30px;
@include btc4(300px, 50px, $fontSizeTitle);
font-size: 22px;
width: auto;
padding: 0 24px;
min-width: 288px;
margin-left: 12px;
background: url("~@assets/images/vhis/vhis-btn2.png");
background: url("~@assets/images/vhis/vhis-btn.png");
letter-spacing: 1.5px;
}
}
......@@ -119,7 +119,7 @@
position: relative;
width: 100%;
height: 100%;
background-color: #ffffff;
background-color: rgba($color: #ffffff, $alpha: 0.8);
border-radius: $borderSize;
.tit {
......@@ -152,13 +152,11 @@
// 标题
.title {
@extend .bb;
padding: 62px 0;
padding: 42px 0;
background-color: #fff1ed;
text-align: center;
font-size: $fontSize;
.tt {
// display: flex;
// justify-content: center;
......@@ -174,24 +172,25 @@
.easy1 {
margin-right: 8px;
margin-top: -4px;
height: 36px;
}
.easy2 {
margin-right: 10px;
margin-top: -4px;
height: 26px;
}
.t1 {
color: $cOrange2;
letter-spacing: 2px;
font-weight: bold;
font-size: 45px;
font-size: 34px;
letter-spacing: 6px;
}
.t2 {
font-size: 34px;
font-size: 24px;
margin-top: 36px;
line-height: 1.39;
letter-spacing: 2px;
......@@ -206,12 +205,12 @@
.tit {
color: $cOrange2;
letter-spacing: 2.5px;
font-size: 50px;
font-size: 36px;
font-weight: bold;
}
.prod {
margin: 48px auto 0;
margin: 24px auto 0;
color: $cOrange2;
display: flex;
justify-content: space-between;
......@@ -234,18 +233,18 @@
.icon-wrap {
@extend .fcc;
width: 210px;
width: 202px;
}
.detail {
padding: 40px 40px 40px 0;
flex: 1;
padding: 52px 40px 0 0;
// flex: 1;
flex-grow: 1;
.t1 {
letter-spacing: 2px;
font-size: 38px;
font-size: 22px;
font-weight: bold;
}
.desc {
......@@ -259,7 +258,7 @@
.c1 {
letter-spacing: 1.2px;
font-size: 24px;
font-size: 18px;
}
}
}
......@@ -276,13 +275,14 @@
// 保障
.guarantee {
margin: 100px auto 0;
font-size: 26px;
font-size: 22px;
.tit {
text-align: center;
color: $cOrange2;
letter-spacing: 1.4px;
letter-spacing: 1.8px;
font-size: 36px;
font-weight: bold;
}
.table {
......@@ -302,19 +302,19 @@
.tt {
@extend .bb;
width: 50%;
padding: 26px 0;
padding: 20px 0;
letter-spacing: 1.12px;
color: #666666;
}
.label {
background-color: #fef1ed;
padding-left: 76px;
padding-left: 100px;
border-right: solid 1px #e4e4e5;
}
.val {
padding-left: 76px;
padding-left: 100px;
}
}
}
......@@ -352,7 +352,7 @@
position: relative;
background-image: url('~@assets/images/vhis/vhis-tick.png');
background-repeat: no-repeat;
background-position: 0 10px;
background-position: 0 5px;
padding-left: 40px;
margin: 24px 0;
......@@ -393,9 +393,9 @@
@extend .bb;
@extend .fcc;
margin: 0 auto 24px;
max-width: 740px;
height: 82px;
line-height: 82px;
max-width: 602px;
height: 67px;
line-height: 67px;
padding: 2px;
border-radius: 2px;
cursor: pointer;
......@@ -405,28 +405,30 @@
@extend .bb;
display: flex;
align-items: center;
padding-left: 220px;
padding-left: 178px;
width: 100%;
height: 100%;
background-color: #ffffff;
font-size: 36px;
font-size: 22px;
font-weight: bold;
border-radius: 2px;
.icon {
margin-right: 24px;
height: 47px;
margin-right: 48px;
}
}
}
}
// 提交订单
.submit-btn {
margin: 120px auto 100px;
margin: 64px auto 100px;
@extend .pointer;
@extend .bb;
@include btc4(406px, 60px, 28px);
@include btc4(300px, 50px, 22px);
font-weight: bold;
}
......
......@@ -7,8 +7,8 @@
<div class="banner banner-pc">
<swiper :options="swiperOption">
<swiper-slide v-for="(item,index) in bannerList" :key="index">
<img class="banner-img" :src="item.pcBannerUrl">
<!-- <img :src="require('@/assets/images/vhis/kv.png')"> -->
<!-- <img class="banner-img" :src="item.pcBannerUrl"> -->
<img :src="require('@/assets/images/vhis/kv.png')">
<div class="btn-wrap">
<div v-for="(btnItem, btnIndex) in item.btns" :key="btnIndex">
<div class="banner-btn" v-if="btnItem.n && btnItem.t && btnItem.c" @click="btnNavigateTo(btnItem.t,btnItem.l)" :style="{backgroundColor:btnItem.c}">{{btnItem.n}}</div>
......