1055 lines
24 KiB
Vue
1055 lines
24 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="mubu">
|
|
<view class="c-top">
|
|
<view class="topjianjian">
|
|
<view style="width: 10px; height: 100%;" @click="goback()">
|
|
<uni-icons type="left" color="#ffffff" size="22"></uni-icons>
|
|
</view>
|
|
<view class="bai-title">订单详情</view>
|
|
<view style="width: 10px; height: 100%;"></view>
|
|
</view>
|
|
<view class="dis-b" style="margin-top: 16px; box-sizing: border-box; padding: 0px 15px; ">
|
|
<view class="t-left">
|
|
<view class="left-t">
|
|
<view class="sj">
|
|
<image src="../../static/detection/sja.png" mode=""></image>
|
|
</view>
|
|
<view class="t-zi1">
|
|
<text>{{detailsData.rescueStatus}}</text>
|
|
</view>
|
|
</view>
|
|
<view class="t-zi2">请尽快与救援车辆联系</view>
|
|
</view>
|
|
<view class="t-right">
|
|
|
|
<view class="" @click="gotel(detailsData.connectionPhone)">
|
|
<view class="ximg">
|
|
<image src="../../static/detection/shouji.png" mode=""></image>
|
|
</view>
|
|
<view class="ai">拨打电话</view>
|
|
</view>
|
|
<view style="margin-left: 10px;" @click="gogogo()">
|
|
<view class="ximg">
|
|
<image src="../../static/detection/xiaofeij.png" mode=""></image>
|
|
</view>
|
|
<view class="ai">到这去</view>
|
|
</view>
|
|
<view style="margin-left: 10px;"
|
|
v-if="detailsData.setMoney&&(!detailsData||detailsData.orderStatus<2)" @click="showCode()">
|
|
<view class="ximg">
|
|
<uni-icons type="scan" color="#ffffff" size="24"></uni-icons>
|
|
<!-- <image src="../../static/detection/xiaofeij.png" mode=""></image> -->
|
|
</view>
|
|
<view class="ai">收款</view>
|
|
</view>
|
|
<view style="margin-left: 10px;" v-if="detailsData&&detailsData.orderStatus>=2">
|
|
<view class="ximg">
|
|
<uni-icons type="checkbox" color="#ffffff" size="24"></uni-icons>
|
|
<!-- <image src="../../static/detection/xiaofeij.png" mode=""></image> -->
|
|
</view>
|
|
<view class="ai">已收款</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
<view class="ding-top">
|
|
|
|
<view class="dis-bb">
|
|
<view style="display: flex;justify-content: space-between;width: 100%; align-items: center;">
|
|
<view class="xhui">
|
|
救援地点
|
|
</view>
|
|
<view class="ribox" v-if="detailsData.rescueStatus == '救援中'" @click="show = true">
|
|
<text>确认编辑</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="ja-you">{{detailsData.rescuePosition || ''}}</view>
|
|
<view class="xhui" v-if="detailsData.rescueStatus == '救援中'" @click="getmap1">
|
|
终点位置
|
|
</view>
|
|
<view class="ja-you " @click="getmap1" v-if="detailsData.rescueStatus == '救援中'">
|
|
{{detailsData.destinationInfo || '暂未设置'}} <uni-icons type="paperplane-filled"
|
|
color="#0D2E8D" size="18"></uni-icons>
|
|
</view>
|
|
<!-- <view class="xhei">{{detailsData.connectionName || ''}} {{detailsData.connectionPhone || ''}}</view> -->
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">客户车牌:</text>
|
|
<u--input placeholder="客户车牌" style="height: 15px;" v-model="detailsData.licenseNum"></u--input>
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">驾驶车辆:</text>
|
|
|
|
<text>{{detailsData.driverCarNum || ''}}</text> <text @click="getCarList()"
|
|
style="margin-left: 20px;color:blue;font-size: 12px;">
|
|
点击选择</text>
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">路段:</text>
|
|
|
|
<text>{{detailsData.sectionRoad || ''}}</text> <text @click="getRoadList()"
|
|
style="margin-left: 20px;color:blue;font-size: 12px;">
|
|
点击选择</text>
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">起止公里数:</text>
|
|
<u--input placeholder="救援开始公里数" style="height: 15px;" type="number"
|
|
v-model="detailsData.startScale"></u--input> -
|
|
<u--input placeholder="救援结束公里数" style="height: 15px;" type="number"
|
|
v-model="detailsData.endScale"></u--input>
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">放空公里数:</text>
|
|
<view style="width: 158px;display: flex;align-items: center;"><u--input type="number"
|
|
style="height: 15px; " placeholder="请输入公里数" border="surround"
|
|
v-model="detailsData.emptyNum" clearable></u--input> <text>KM</text></view>
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">过关费:</text>
|
|
<view style="width: 150px;display: flex;align-items: center;margin-left: 28px;"><u--input
|
|
type="number" style="height: 15px; " placeholder="请输入金额" border="surround"
|
|
v-model="detailsData.checkpointMoney" clearable></u--input><text>元</text> </view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">联系人:</text>
|
|
<input type="text" :placeholder="detailsData.connectionName"
|
|
v-model="detailsData.connectionName" v-if="detailsData.rescueStatus == '救援中'">
|
|
<text v-if="detailsData.rescueStatus != '救援中'">{{detailsData.connectionName || ''}}</text>
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">手机号:</text>
|
|
<input type="text" :placeholder="detailsData.connectionPhone"
|
|
v-model="detailsData.connectionPhone" v-if="detailsData.rescueStatus == '救援中'">
|
|
<text v-if="detailsData.rescueStatus != '救援中'">{{detailsData.connectionPhone || ''}}</text>
|
|
</view>
|
|
<view class="dix">
|
|
<text class="huiy">车辆类型:</text>
|
|
<text v-if="detailsData.rescueStatus != '救援中'">{{detailsData.carTypeStr || ''}}</text>
|
|
<view class="ribox" v-if="detailsData.rescueStatus == '救援中'"
|
|
:class="{'actbox' : carindex == item.value}" v-for="(item,index) in carList"
|
|
:key="index" @click="getcarindex(item.value)">{{item.label}}</view>
|
|
</view>
|
|
|
|
<view class="dix">
|
|
<text class="huiy">收款类型:</text>
|
|
<text v-if="detailsData.rescueStatus != '救援中'">{{detailsData.feeTypeStr || ''}}</text>
|
|
<view class="ribox" v-if="detailsData.rescueStatus == '救援中'"
|
|
:class="{'actbox' : skindex == item.value}" v-for="(item,index) in qdList" :key="index"
|
|
@click="getskindex(item.value)">{{item.label}}</view>
|
|
</view>
|
|
<view class="dix" v-if="detailsData.kcPosition" @click="getmap1">
|
|
<text class="huiy">扣车地点:</text>
|
|
<text>{{detailsData.kcPosition || ''}}</text>
|
|
</view>
|
|
<view class="dix">
|
|
|
|
<text class="huiy">救援类型:</text>
|
|
<text>{{detailsData.rescueTypeStr || ''}}</text>
|
|
|
|
</view>
|
|
<view style="position: absolute;bottom: 25px; right: 25px;text-align: center; "
|
|
@click="getrescueDetail(id)">
|
|
<uni-icons type="refresh-filled" color="#0D2E8D" size="40"
|
|
style="margin: 5px auto;"></uni-icons>
|
|
<view style="font-size: 14px; color: #0D2E8D;">刷新订单</view>
|
|
</view>
|
|
|
|
</view>
|
|
<view class="hui-content">
|
|
<view class="content-box">
|
|
<view class="dis-bb">
|
|
<view class="ja-you" style="margin: 0px;">事情描述:</view>
|
|
</view>
|
|
<u--textarea v-model="detailsData.rescueDetail" v-if="detailsData.rescueStatus == '救援中'"
|
|
placeholder="请输入救援描述" border="bottom" autoHeight></u--textarea>
|
|
<view class="xx-hui" v-if="detailsData.rescueStatus != '救援中'">
|
|
{{detailsData.rescueDetail || '暂无描述'}}
|
|
</view>
|
|
|
|
</view>
|
|
<view class="content-box" v-if="detailsData.rescueSceneImageList != null ">
|
|
<view class="dis-bb">
|
|
<view class="ja-you" style="margin: 0px;">现场图片</view>
|
|
</view>
|
|
<view class="img-boxs">
|
|
<view class="g-img" v-for="(item,index) in detailsData.rescueSceneImageList" :key="index">
|
|
<image :src=" baseUrl + item " mode=""></image>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view class="content-box">
|
|
<view class="dis-bb">
|
|
<view class="ja-you" style="margin: 0px;">救援进程</view>
|
|
</view>
|
|
<view class="lan-ga" v-for="(item,index) in detailList" :key="index">
|
|
<view class="ga-top">
|
|
<view class="gain">{{index + 1}}</view>
|
|
<view class="">{{item.title}}</view>
|
|
</view>
|
|
<view class="xhui" style="margin-left: 20px;">
|
|
{{item.createTime}}
|
|
</view>
|
|
<view class="beizh" style="margin-left: 20px;">
|
|
{{item.remark}}
|
|
</view>
|
|
<view class="wrap-box" style="margin-left: 20px;" v-if="item.images">
|
|
<view class="img-box" v-for="(items,index) in item.images.split(',') "
|
|
@click="lookimg(index,item.images.split(','))" :key="index">
|
|
<image :src="baseUrl + items " mode=""></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
|
|
|
|
</view>
|
|
<u-picker :show="carNumShow" @cancel="carNumShow = false" @close="carNumShow = false" @confirm="chooseCar"
|
|
:columns="[carNumList]" keyName="rescueCarNum"></u-picker>
|
|
<u-modal :show="show" title="修改" content='您确认修改吗' :showCancelButton="true" @confirm="confirmadd()"
|
|
@cancel="cancelopen()"></u-modal>
|
|
<u-popup :show="codeShow" :round="10" mode="bottom" @close="closeCodePop" :closeable='true'>
|
|
<view class="codePop flex-col align-center">
|
|
|
|
<canvas style="width:100px; height: 100px; z-index: 9999999;margin: 40px auto;"
|
|
canvas-id="myQrcode"></canvas>
|
|
<view class="popup-title">收款码</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
<u-picker :show="roadShow" @cancel="roadShow = false" @close="roadShow = false" @confirm="chooseRoad"
|
|
:columns="[roadList]" keyName="label"></u-picker>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import request from '../../utils/request';
|
|
import tabBar from '../../components/tabBar/tabBar.vue'
|
|
import drawQrcode from 'weapp-qrcode';
|
|
import dayjs from '../../uni_modules/uview-ui/libs/util/dayjs';
|
|
export default {
|
|
data() {
|
|
return {
|
|
show: false,
|
|
qdList: [],
|
|
skindex: 0,
|
|
carNumList: [],
|
|
carindex: 0,
|
|
codeShow: false,
|
|
carNumShow: false,
|
|
roadShow: false,
|
|
roadList: [],
|
|
carList: [],
|
|
rescueDetail: '',
|
|
id: 0,
|
|
baseUrl: this.$baseUrl,
|
|
type: 'center',
|
|
msgType: 'success',
|
|
imageList: [],
|
|
isLoop: true,
|
|
messageText: '这是一条成功提示',
|
|
msg: '1',
|
|
detailsData: {},
|
|
singleList: [],
|
|
detailList: [],
|
|
tabindex: 0,
|
|
title: 'user',
|
|
checkedindex: false,
|
|
destinationLongitude: '',
|
|
destinationLatitude: '',
|
|
destinationInfo: '请选择',
|
|
province1: '',
|
|
city1: '',
|
|
area1: '',
|
|
four1: '',
|
|
}
|
|
},
|
|
onLoad(option) {
|
|
this.id = option.id
|
|
this.getrescueDetail(option.id)
|
|
this.newtwo()
|
|
},
|
|
onShow() {
|
|
|
|
},
|
|
|
|
methods: {
|
|
chooseRoad(data) {
|
|
console.log(data);
|
|
this.detailsData.sectionRoad = data.value[0].id
|
|
this.roadShow = false
|
|
},
|
|
chooseCar(data) {
|
|
this.carNumShow = false
|
|
this.detailsData.driverCarNum = data.value[0].rescueCarNum
|
|
},
|
|
getRoadList() {
|
|
request({
|
|
url: '/system/rescueInfo/getRescueRoad',
|
|
method: 'get'
|
|
}).then((res) => {
|
|
this.roadShow = true
|
|
this.roadList = res.data
|
|
})
|
|
},
|
|
getCarList() {
|
|
|
|
let data = {
|
|
pageNum: 1,
|
|
pageSize: 100
|
|
}
|
|
request({
|
|
url: '/system/rescueCar/list',
|
|
method: 'get',
|
|
params: data
|
|
}).then((res) => {
|
|
this.carNumShow = true
|
|
console.log('获取车辆信息', res);
|
|
this.carNumList = res.rows
|
|
})
|
|
},
|
|
|
|
getmap1() {
|
|
let that = this
|
|
if (this.detailsData.kcPosition) {
|
|
uni.chooseLocation({
|
|
success: function(res) {
|
|
console.log('位置名称：' + res.name);
|
|
console.log('详细地址：' + res.address);
|
|
console.log('纬度：' + res.latitude);
|
|
console.log('经度：' + res.longitude);
|
|
that.destinationLongitude = res.longitude
|
|
that.destinationLatitude = res.latitude
|
|
that.kcPosition = res.address
|
|
var address = res.address;
|
|
var reg = /.+?(省|市|自治区|自治州|县|区)/g;
|
|
let addressList = address.match(reg).toString().split(",");
|
|
if (addressList[0] == '重庆市' || addressList[0] == '北京市' || addressList[0] ==
|
|
'天津市' || addressList[0] == '上海市') {
|
|
that.province1 = addressList[0];
|
|
that.city1 = '市辖区';
|
|
that.area1 = addressList[1];
|
|
that.detailsData.kcPosition = address.replace(that.province, '').replace(that
|
|
.city, '').replace(that.area, '');
|
|
} else {
|
|
that.province1 = addressList[0];
|
|
that.city1 = addressList[1];
|
|
that.area1 = addressList[2];
|
|
that.detailsData.kcPosition = address.replace(that.province, '').replace(that
|
|
.city, '').replace(that.area, '');
|
|
};
|
|
console.log(that.detailsData.kcPosition);
|
|
|
|
}
|
|
});
|
|
|
|
|
|
} else {
|
|
uni.chooseLocation({
|
|
success: function(res) {
|
|
console.log('位置名称：' + res.name);
|
|
console.log('详细地址：' + res.address);
|
|
console.log('纬度：' + res.latitude);
|
|
console.log('经度：' + res.longitude);
|
|
that.destinationLongitude = res.longitude
|
|
that.destinationLatitude = res.latitude
|
|
that.destinationInfo = res.address
|
|
var address = res.address;
|
|
var reg = /.+?(省|市|自治区|自治州|县|区)/g;
|
|
let addressList = address.match(reg).toString().split(",");
|
|
if (addressList[0] == '重庆市' || addressList[0] == '北京市' || addressList[0] ==
|
|
'天津市' || addressList[0] == '上海市') {
|
|
that.province1 = addressList[0];
|
|
that.city1 = '市辖区';
|
|
that.area1 = addressList[1];
|
|
that.detailsData.destinationInfo = address.replace(that.province, '').replace(
|
|
that.city, '').replace(that.area, '');
|
|
} else {
|
|
that.province1 = addressList[0];
|
|
that.city1 = addressList[1];
|
|
that.area1 = addressList[2];
|
|
that.detailsData.destinationInfo = address.replace(that.province, '').replace(
|
|
that.city, '').replace(that.area, '');
|
|
};
|
|
console.log(that.detailsData.destinationInfo);
|
|
|
|
}
|
|
});
|
|
}
|
|
},
|
|
lookimg(idx, tmpList) {
|
|
|
|
let resList = [];
|
|
tmpList.forEach(it => {
|
|
resList.push(this.baseUrl + it)
|
|
})
|
|
|
|
uni.previewImage({
|
|
urls: resList,
|
|
current: idx,
|
|
indicator: 'none',
|
|
loop: this.isLoop
|
|
})
|
|
},
|
|
confirmadd() {
|
|
// this.show = false
|
|
let data = this.detailsData
|
|
|
|
request({
|
|
url: '/app/rescueInfo/edit',
|
|
method: 'post',
|
|
data: data
|
|
}).then((res) => {
|
|
console.log(res);
|
|
if (res.code == 200) {
|
|
uni.showToast({
|
|
title: '修改成功',
|
|
icon: 'none'
|
|
})
|
|
this.show = false
|
|
this.getrescueDetail(this.detailsData.id)
|
|
}
|
|
|
|
})
|
|
|
|
},
|
|
cancelopen() {
|
|
this.show = false
|
|
},
|
|
newtwo() {
|
|
request({
|
|
url: '/rescue/dict/data/type/fee_type',
|
|
method: 'get',
|
|
}).then((res) => {
|
|
console.log('fee_type', res);
|
|
this.qdList = res.data
|
|
})
|
|
|
|
request({
|
|
url: '/rescue/dict/data/type/rescue_car_type',
|
|
method: 'get',
|
|
}).then((res) => {
|
|
this.carList = res.data
|
|
console.log('rescue_car_type', res);
|
|
})
|
|
|
|
},
|
|
getcarindex(index) {
|
|
this.carindex = index
|
|
this.detailsData.carType = index
|
|
},
|
|
getskindex(index) {
|
|
this.skindex = index
|
|
this.detailsData.feeType = index
|
|
},
|
|
closeCodePop() {
|
|
this.codeShow = false
|
|
},
|
|
showCode() {
|
|
this.codeShow = true
|
|
let data = {
|
|
id: this.id
|
|
}
|
|
request({
|
|
url: '/rescuePayApi/createOrder',
|
|
method: 'post',
|
|
params: data
|
|
}).then((res) => {
|
|
console.log(res.data.code_url);
|
|
drawQrcode({
|
|
width: 100,
|
|
height: 100,
|
|
canvasId: 'myQrcode',
|
|
text: res.data.code_url
|
|
})
|
|
})
|
|
|
|
|
|
},
|
|
gogogo() {
|
|
console.log('执行');
|
|
uni.openLocation({
|
|
latitude: parseFloat(this.detailsData.rescueLatitude),
|
|
longitude: parseFloat(this.detailsData.rescueLongitude),
|
|
success: function() {
|
|
console.log('success');
|
|
},
|
|
complete: function(res) {
|
|
console.log(res);
|
|
}
|
|
});
|
|
},
|
|
|
|
goback() {
|
|
uni.navigateBack()
|
|
},
|
|
gotel(num) {
|
|
uni.makePhoneCall({
|
|
phoneNumber: num //仅为示例
|
|
});
|
|
},
|
|
getrescueDetail(id) {
|
|
uni.showLoading({
|
|
title: '刷新中'
|
|
});
|
|
request({
|
|
url: '/app/driver/rescueDetail?rescueId=' + id,
|
|
method: 'get',
|
|
}).then((res) => {
|
|
console.log('详情', res);
|
|
this.detailsData = res.data.rescueInfo
|
|
this.carindex = res.data.rescueInfo.carType // 回显车型
|
|
this.skindex = res.data.rescueInfo.feeType
|
|
this.detailList = res.data.detailList
|
|
if (this.detailList && this.detailList.length > 0) {
|
|
this.detailList.forEach(item => {
|
|
if (item.createTime) {
|
|
item.createTime = dayjs(item.createTime).format('YYYY-MM-DD HH:mm:ss')
|
|
}
|
|
})
|
|
}
|
|
uni.hideLoading();
|
|
})
|
|
},
|
|
dialogToggle() {
|
|
this.$refs.alertDialog.open()
|
|
},
|
|
inputDialogToggle() {
|
|
this.$refs.inputDialog.open()
|
|
},
|
|
dialogClose() {
|
|
console.log('点击关闭')
|
|
},
|
|
dialogInputConfirm(val) {
|
|
this.$refs.inputDialog.close()
|
|
},
|
|
|
|
getnaiv() {
|
|
uni.navigateTo({
|
|
url: '/pages/rescue/rescue'
|
|
})
|
|
},
|
|
getcheckedindex() {
|
|
let data = {
|
|
driverId: uni.getStorageSync('driverInfo')
|
|
}
|
|
request({
|
|
url: '/app/driver/updateWork',
|
|
method: 'post',
|
|
params: data
|
|
}).then((res) => {
|
|
console.log(res);
|
|
this.getStatus
|
|
})
|
|
// this.checkedindex =! this.checkedindex
|
|
console.log(this.checkedindex);
|
|
|
|
|
|
},
|
|
gettab(index) {
|
|
this.tabindex = index
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.content {
|
|
box-sizing: border-box;
|
|
// padding-top: 40px;
|
|
// background: #F4F4F4;
|
|
width: 100%;
|
|
// height: calc(100vh);
|
|
}
|
|
|
|
.left-t {
|
|
display: flex;
|
|
height: 25px;
|
|
}
|
|
|
|
.xx-hui {
|
|
font-size: 15px;
|
|
font-weight: 400;
|
|
color: #666666;
|
|
line-height: 25px;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.img-boxs {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
}
|
|
|
|
.lan-ga {
|
|
width: 100%;
|
|
margin: 10px auto;
|
|
box-sizing: border-box;
|
|
padding-bottom: 15px;
|
|
border-bottom: 1px solid #EEEEEE;
|
|
}
|
|
|
|
.ga-top {
|
|
display: flex;
|
|
align-items: center;
|
|
color: #0D2E8D;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.img-box {
|
|
width: 70px;
|
|
height: 70px;
|
|
border-radius: 6px;
|
|
overflow: hidden;
|
|
margin-top: 10px;
|
|
margin-right: 10px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.wrap-box {
|
|
width: 100%;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.beizh {}
|
|
|
|
.gain {
|
|
font-style: 18px;
|
|
font-weight: bold;
|
|
margin-right: 10px;
|
|
color: #0D2E8D;
|
|
}
|
|
|
|
.g-img {
|
|
width: 30%;
|
|
height: 111px;
|
|
margin-right: 10px;
|
|
margin-top: 5px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.ximg {
|
|
width: 20px;
|
|
height: 20px;
|
|
|
|
margin: 0 auto;
|
|
margin-bottom: 10px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.sj {
|
|
width: 25px;
|
|
height: 25px;
|
|
margin-right: 10px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.bai-title {
|
|
font-weight: bold;
|
|
color: #ffffff;
|
|
|
|
}
|
|
|
|
.ai {
|
|
font-size: 14px;
|
|
}
|
|
|
|
.topjianjian {
|
|
width: 100%;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: 40px;
|
|
box-sizing: border-box;
|
|
padding: 15px 15px;
|
|
|
|
}
|
|
|
|
.dix {
|
|
display: flex;
|
|
align-items: center;
|
|
margin: 10px auto;
|
|
}
|
|
|
|
.huiy {
|
|
font-size: 15px;
|
|
font-weight: 400;
|
|
color: #999999;
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.htzit {
|
|
display: flex;
|
|
align-items: center;
|
|
font-size: 15px;
|
|
color: #999999;
|
|
|
|
}
|
|
|
|
.xshui {
|
|
font-size: 15px;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
}
|
|
|
|
.changimg {
|
|
width: 58px;
|
|
height: 20px;
|
|
margin-right: 5px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.shiwuimg {
|
|
width: 15px;
|
|
height: 15px;
|
|
margin-right: 5px;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
}
|
|
|
|
.inanniu {
|
|
width: 30%;
|
|
height: 38px;
|
|
border-radius: 19px 19px 19px 19px;
|
|
border: 1px solid #3CBC6F;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 15px;
|
|
color: #3CBC6F;
|
|
}
|
|
|
|
.caanniu {
|
|
width: 30%;
|
|
height: 38px;
|
|
border-radius: 19px 19px 19px 19px;
|
|
border: 1px solid #e43d33;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 15px;
|
|
color: #e43d33;
|
|
}
|
|
|
|
.lanniu {
|
|
width: 30%;
|
|
height: 38px;
|
|
border-radius: 19px 19px 19px 19px;
|
|
border: 1px solid #3C9CFF;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 15px;
|
|
color: #3C9CFF;
|
|
}
|
|
|
|
.anniua {
|
|
width: 30%;
|
|
height: 38px;
|
|
border-radius: 19px 19px 19px 19px;
|
|
border: 1px solid #0D2E8D;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 15px;
|
|
background: #0D2E8D;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.qrxg {
|
|
width: 20%;
|
|
height: 20px;
|
|
background-color: #0D2E8D;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: white;
|
|
border-radius: 6px;
|
|
|
|
font-size: 14px;
|
|
}
|
|
|
|
.dis-bb {
|
|
// display: flex;
|
|
// align-items: center;
|
|
// justify-content: space-between;
|
|
box-sizing: border-box;
|
|
padding-bottom: 15px;
|
|
border-bottom: 1px solid #EEEEEE;
|
|
}
|
|
|
|
.dis-tt {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
box-sizing: border-box;
|
|
padding-top: 15px;
|
|
border-top: 1px solid #EEEEEE;
|
|
}
|
|
|
|
.c-top {
|
|
width: 100%;
|
|
height: 180px;
|
|
background: #0D2E8D;
|
|
box-sizing: border-box;
|
|
// padding: 15px;
|
|
// position: relative;
|
|
}
|
|
|
|
.ding-top {
|
|
// position: absolute;
|
|
// padding: 15px;
|
|
// bottom: -220px;
|
|
// left: 0px;
|
|
width: 100%;
|
|
|
|
background-color: white;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
border-radius: 8px 8px 0px 0px;
|
|
position: relative;
|
|
}
|
|
|
|
.t-title {
|
|
font-size: 18px;
|
|
font-weight: bold;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.dis-b {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.t-left {}
|
|
|
|
.t-zi1 {
|
|
font-size: 20px;
|
|
font-weight: bold;
|
|
color: white;
|
|
|
|
}
|
|
|
|
.t-zi2 {
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
color: white;
|
|
margin-bottom: 10px;
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.t-biao {
|
|
border-radius: 11px 11px 11px 0px;
|
|
background: linear-gradient(90deg, #EE8342 0%, #EA3942 100%);
|
|
color: white;
|
|
text-align: center;
|
|
}
|
|
|
|
.t-right {
|
|
color: white;
|
|
display: flex;
|
|
}
|
|
|
|
.t-zi2 {
|
|
font-size: 14px;
|
|
font-weight: bold;
|
|
color: white;
|
|
text-align: center;
|
|
}
|
|
|
|
.t-bottom {
|
|
// height: 77px;
|
|
background: #FFFFFF;
|
|
box-shadow: 0px 4px 4px 0px rgba(13, 46, 141, 0.15);
|
|
border-radius: 8px;
|
|
margin-top: 10px;
|
|
box-sizing: border-box;
|
|
padding: 16px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
z-index: 99;
|
|
}
|
|
|
|
.top-box {
|
|
width: 33%;
|
|
height: 100%;
|
|
border-right: 1px solid #EEEEEE;
|
|
text-align: center;
|
|
|
|
}
|
|
|
|
.t-lan {
|
|
font-size: 28px;
|
|
font-weight: bold;
|
|
color: #0D2E8D;
|
|
}
|
|
|
|
.t-hui {
|
|
font-size: 14px;
|
|
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
|
font-weight: 400;
|
|
color: #999999;
|
|
}
|
|
|
|
.t-ybr {
|
|
width: 100%;
|
|
z-index: -99;
|
|
height: 120px;
|
|
box-sizing: border-box;
|
|
padding-top: 90px;
|
|
display: flex;
|
|
justify-content: space-around;
|
|
|
|
// background-color: white;
|
|
}
|
|
|
|
.anniu {
|
|
width: 95%;
|
|
height: 44%;
|
|
border-radius: 6px;
|
|
background-color: #0D2E8D;
|
|
color: white;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
|
|
.gang {
|
|
width: 24px;
|
|
height: 4px;
|
|
background: #ffffff;
|
|
border-radius: 4px 4px 4px 4px;
|
|
margin: 2px auto;
|
|
}
|
|
|
|
.hui-content {
|
|
width: 100%;
|
|
// height: calc(60vh);
|
|
background-color: #f4f4f4;
|
|
box-sizing: border-box;
|
|
padding: 10px 0px;
|
|
|
|
}
|
|
|
|
.content-box {
|
|
width: 100%;
|
|
box-sizing: border-box;
|
|
padding: 15px;
|
|
// height: 222px;
|
|
background: #FFFFFF;
|
|
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.hui-text {
|
|
font-size: 16px;
|
|
font-weight: 400;
|
|
color: #666666;
|
|
}
|
|
|
|
.indexhei {
|
|
color: #333333 !important;
|
|
font-weight: bold !important;
|
|
}
|
|
|
|
.indexlan {
|
|
background: #0D2E8D !important;
|
|
}
|
|
|
|
.mubu {
|
|
width: 100%;
|
|
// height: calc(60vh);
|
|
background-color: #f4f4f4;
|
|
}
|
|
|
|
.jsy {
|
|
margin: 10px auto;
|
|
}
|
|
|
|
.ja-you {
|
|
width: 100%;
|
|
font-weight: bold;
|
|
display: -webkit-box;
|
|
-webkit-line-clamp: 2;
|
|
-webkit-box-orient: vertical;
|
|
margin: 10px auto;
|
|
|
|
}
|
|
|
|
.xhui {
|
|
font-size: 12px;
|
|
font-weight: 400;
|
|
color: #999999;
|
|
}
|
|
|
|
.codePop {
|
|
width: 100%;
|
|
background-color: white;
|
|
box-sizing: border-box;
|
|
height: 300px;
|
|
}
|
|
|
|
.popup-title {
|
|
|
|
text-align: center;
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.ribox {
|
|
box-sizing: border-box;
|
|
padding: 5px 10px;
|
|
// background: #0D2E8D;
|
|
border: 1px solid #0D2E8D;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
color: #0D2E8D;
|
|
border-radius: 5px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.actbox {
|
|
background: #0D2E8D !important;
|
|
color: white;
|
|
}
|
|
</style> |