You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

948 lines
28 KiB

<template>
<view id="page">
<view class="Width100 Box BorderBox">
<view class="Content BorderBox Width100">
<top-title @skipPage="$.back(1)" :isCuMethod="true" :is-show-left="true" title="三轮车信息登记"
:rightWidth='120' class="custom_bg">
</top-title>
</view>
<view class="formBox">
<uni-forms :modelValue="formData" border>
<view class="label-box">
<view class="border"></view> 车辆信息
</view>
<uni-forms-item label="车辆号牌" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px ">
<input type="text" :placeholder="editFlag?'请填写车辆号牌':''" v-model="formData.vehicleLicense"
:disabled="!editFlag" class="font_style" />
</view>
</uni-forms-item>
<uni-forms-item label="车辆类型" class="border-bottom" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; "
@click="handleShowDrop('vehicleType') ">
<u-picker :show="pickerType == 'vehicleType'" :columns="[this.enumList.vehicleTypeEnum]"
@cancel="pickerType = ''" keyName='enumname'
@confirm="e=>handleSelect(e,'vehicleType')"></u-picker>
<view :class="formData.vehicleType?'':'gary'" class="font_style">
{{editFlag?formData.vehicleType ||'请选择车辆类型':formData.vehicleType}}
</view>
</view>
</uni-forms-item>
<uni-forms-item label="车辆颜色" class="border-bottom" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; "
@click=" handleShowDrop('vehicleColor')">
<u-picker :show="pickerType == 'vehicleColor'" :columns="[this.enumList.vehicleColorEnum]"
@cancel="pickerType = ''" keyName='enumname' :disabled="!editFlag"
@confirm="e=>handleSelect(e,'vehicleColor')"></u-picker>
<view :class="formData.vehicleColor?'':'gary'" class="font_style">
{{editFlag?formData.vehicleColor ||'请选择车辆颜色':formData.vehicleColor}}
</view>
</view>
</uni-forms-item>
<uni-forms-item label="车辆品牌" class="border-bottom">
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<input type="text" :placeholder="editFlag?'请填写车辆品牌':''" v-model="formData.vehicleBrand"
:disabled="!editFlag" class="font_style" />
</view>
</uni-forms-item>
<uni-forms-item label="车架号" class="border-bottom" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<input type="text" :placeholder="editFlag?'请填写车架号':''" v-model="formData.vin"
:disabled="!editFlag" class="font_style" />
</view>
</uni-forms-item>
<view class="label-box">
<view class="border"></view> 驾驶人信息
</view>
<uni-forms-item label="驾驶人" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<input type="text" :placeholder="editFlag?'请填写驾驶人姓名':''" v-model="formData.driverName"
:disabled="!editFlag" class="font_style" />
</view>
</uni-forms-item>
<uni-forms-item label="身份证号" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<input type="text" :placeholder="editFlag?'请填写驾驶人身份证号':''" v-model="formData.driverIdNumber"
:disabled="!editFlag" class="font_style" />
</view>
</uni-forms-item>
<uni-forms-item label="联系电话" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<input type="text" :placeholder="editFlag?'请填写驾驶人联系电话':''" v-model="formData.driverPhone"
:disabled="!editFlag" class="font_style" />
</view>
</uni-forms-item>
<uni-forms-item label="准驾车型" class="border-top">
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; "
>
<!-- <u-picker :show="pickerType === 'driverAuthorizedModel'"
:columns="[this.enumList.getVehicleAuthorizedModelEnum]" @cancel="pickerType = ''"
keyName='enumname' :disabled="!editFlag"
@confirm="e=>handleSelect(e,'driverAuthorizedModel')"></u-picker> -->
<!-- <view :class="formData.driverAuthorizedModel?'':'gary'"
style="text-align: left;width: 190rpx;" class="font_style">
{{editFlag?formData.driverAuthorizedModel || '请选择准驾车型':formData.driverAuthorizedModel}}
</view> -->
<multiplePick v-model="multiplePickValue" :columns="multiplePickColumns"
@confirm="multiplePickConfirm" :disabled="!editFlag"/>
</view>
<!-- <view v-if="formData.driverAuthorizedModel && editFlag"
style="width: 10%;position: absolute;right: 0;top: 0;"><uni-icons
@click="multiplePickValue = ''" type="clear" color="#7e7d96ff" size="36">
</uni-icons>
</view> -->
</uni-forms-item>
<uni-forms-item label="街镇" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; "
@click="handleShowDrop('streetCommunity')">
<u-picker :show="pickerType === 'streetCommunity'" :columns="[this.streetCommunityByXq]"
@cancel="pickerType = ''" keyName='jdname' :disabled="!editFlag"
@confirm="e=>handleSelect(e,'streetCommunity')"></u-picker>
<view :class="formData.streetCommunity?'':'gary'" class="font_style">
{{editFlag? formData.streetCommunity || '请选择街镇':formData.streetCommunity}}
</view>
</view>
</uni-forms-item>
<uni-forms-item label="村社区" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; "
@click="handleShowDrop('villageCommunity') ">
<u-picker :show="pickerType === 'villageCommunity'" :columns="[this.streetCommunityByJd]"
@cancel="pickerType = ''" keyName='sqname' :disabled="!editFlag"
@confirm="e=>handleSelect(e,'villageCommunity')"></u-picker>
<view :class="formData.villageCommunity?'':'gary'" class="font_style">
{{editFlag? formData.villageCommunity || '请选择村社区':formData.villageCommunity}}
</view>
</view>
</uni-forms-item>
<uni-forms-item label="村社区干部" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<input type="text" :placeholder="editFlag?'请填写村社区干部':''" v-model="formData.communityCadre"
:disabled="!editFlag" class="font_style" />
</view>
</uni-forms-item>
<!-- <uni-forms-item label="村社区干部电话" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<input type="text" placeholder="请填写村社区干部电话" v-model="formData.communityCadrePhone"
:disabled="!editFlag" />
</view>
</uni-forms-item> -->
</uni-forms>
</view>
<view class="formBox">
<uni-forms border>
<view class="label-box">
<view class="border"></view> 其他信息
</view>
<uni-forms-item label="保险购置情况" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; "
@click=" handleShowDrop('vehicleInsurance')">
<u-picker :show="pickerType === 'vehicleInsurance'"
:columns="[this.enumList.getVehicleInsuranceEnum]" @cancel="pickerType = ''"
keyName='enumname' :disabled="!editFlag"
@confirm="e=>handleSelect(e,'vehicleInsurance')"></u-picker>
<view :class="formData.vehicleInsurance?'':'gary'" class="font_style">
{{editFlag?formData.vehicleInsurance ||'请选择保险购置情况':formData.vehicleInsurance}}
</view>
</view>
</uni-forms-item>
<uni-forms-item label="车辆状态" class="border-top">
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; "
@click="handleShowDrop('vehicleStatus') ">
<u-picker :show="pickerType === 'vehicleStatus'"
:columns="[this.enumList.getVehicleStatusEnum]" @cancel="pickerType = ''"
keyName='enumname' :disabled="!editFlag"
@confirm="e=>handleSelect(e,'vehicleStatus')"></u-picker>
<view :class="formData.vehicleStatus?'':'gary'" style="text-align: left;width: 190rpx;"
class="font_style">
{{editFlag?formData.vehicleStatus||'请选择车辆状态':formData.vehicleStatus}}
</view>
</view>
<view v-if="formData.vehicleStatus && editFlag"
style="width: 10%;position: absolute;right: 0;top:0">
<uni-icons @click="formData.vehicleStatus = ''" type="clear" color="#7e7d96ff" size="36">
</uni-icons>
</view>
</uni-forms-item>
<uni-forms-item label="录入人员" class="border-top">
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<view>
{{formData.insertPersonnel}}
</view>
</view>
</uni-forms-item>
<uni-forms-item label="录入时间" class="border-top">
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<view class="Height100">
{{ formData.insertTime }}
</view>
</view>
</uni-forms-item>
<uni-forms-item label="详细地址" class="border-top" required>
<view class="Height100 Flex Flex_end Flex_C_S-Center" style="line-height: 37px; ">
<input type="text" :placeholder="editFlag?'请填写详细地址':''" v-model="formData.driverAddress"
:disabled="!editFlag" class="font_style" />
</view>
</uni-forms-item>
<view class="detail-item">
<uni-forms-item label="村干部见车主" label-position="top" label-width="100px" required />
<locationUpload :disabled="!editFlag" :fileList="cadreDriverImg"
@afterRead="(e) => afterRead(e, 'cadreDriverImg')"
@delete="(e) => deletePic(e, 'cadreDriverImg')" name="1" :maxCount="1"></locationUpload>
</view>
<view class="detail-item">
<uni-forms-item label="保证书" label-position="top" label-width="100px" required />
<locationUpload :disabled="!editFlag" :fileList="guaranteeImg"
@afterRead="(e) => afterRead(e, 'guaranteeImg')"
@delete="(e) => deletePic(e, 'guaranteeImg')" name="1" :maxCount="1"></locationUpload>
</view>
<view class="detail-item">
<uni-forms-item label="车主驾车" label-position="top" label-width="100px" required />
<locationUpload :disabled="!editFlag" :fileList="drivingImg"
@afterRead="(e) => afterRead(e, 'drivingImg')" @delete="(e) => deletePic(e, 'drivingImg')"
name="1" :maxCount="1"></locationUpload>
</view>
<view class="detail-item">
<uni-forms-item label="车主大头照" label-position="top" label-width="100px" required />
<locationUpload :disabled="!editFlag" :fileList="driverImg"
@afterRead="(e) => afterRead(e, 'driverImg')" @delete="(e) => deletePic(e, 'driverImg')"
name="1" :maxCount="1"></locationUpload>
</view>
</uni-forms>
</view>
<view class="bottom" v-if="!editFlag">
<view class="trapezoidal min" @click="editFlag = true">
<text>修改</text>
</view>
</view>
<view class="bottom" v-else-if="editFlag && !formData.vehicleId">
<view class="trapezoidal min" @click="handleSave">
<text>保存</text>
</view>
</view>
<three class="footer-buttons" :type="'view'" first-text="取消" next-text="确认" :second-primary="true"
@first="handleCancel" @last="handleSave" v-else />
<view style="width: 100%;height: 100rpx;"></view>
</view>
</view>
</template>
<script>
import NoData from "../../components/no-data.vue";
import Tabbar from "../../components/tabbar.vue";
import TopTitle from "../../components/top-title";
import $ from "../../common/globalJs/globalJs";
import taskInfo from "../../components/task-info.vue";
import uploadFile from "../../components/upload-file.vue";
import Three from "../../components/bottom-button/three.vue";
import BottomButton from "../../components/bottom-button/three.vue";
import dayjs from '@/uni_modules/uview-ui/libs/util/dayjs.js';
import locationUpload from '@/components/u-upload/index.js';
import multiplePick from './multiplePick.vue';
export default {
// 组件
components: {
TopTitle,
NoData,
taskInfo,
uploadFile,
Three,
BottomButton,
locationUpload,
multiplePick
},
data() {
return {
editFlag: false,
$: this.$,
formData: {
cadreDriverImg: "",
communityCadre: "",
communityCadrePhone: '',
driverAddress: "",
driverAuthorizedModel: "",
driverIdNumber: "",
driverImg: "",
driverName: "",
driverPhone: "",
drivingImg: "",
guaranteeImg: "",
insertPersonnel: "",
insertTime: "",
streetCommunity: "",
vehicleBrand: "",
vehicleColor: "",
vehicleInsurance: "",
vehicleLicense: "",
vehicleStatus: "",
vehicleType: "",
villageCommunity: "",
vin: ""
},
pickerType: '',
enumList: {},
streetCommunityByXq: [],
streetCommunityByJd: [],
fileList: [],
cadreDriverImg: [],
guaranteeImg: [],
drivingImg: [],
driverImg: [],
multiplePickValue: "",
multiplePickColumns: [],
}
},
// 页面加载
onLoad(e) {
//字典枚举
this.$request
.globalRequest(
"/hiddenDanger/tricycle/getTricycleInfoEnumType",
"GET"
)
.then((res) => {
this.enumList = res.result
if (this.enumList.getVehicleAuthorizedModelEnum) {
this.enumList.getVehicleAuthorizedModelEnum.map(i => {
this.multiplePickColumns.push({
label: i.enumname,
value: i.enumvalue
})
})
}
//街镇
this.$request
.globalRequest(
`/hiddenDanger/config/getStreetCommunityByXq?nuserId=${this.$.getData('token')}`,
"GET"
)
.then((res) => {
res.result.map(i => {
if (this.streetCommunityByXq.every(j => i.jdname != j.jdname)) {
this.streetCommunityByXq.push(i)
}
})
if (e.id) {
this.getDetail(e.id);
} else {
this.editFlag = true
this.formData.insertTime = this.$moment().format('YYYY-MM-DD HH:mm:ss')
this.formData.insertPersonnel = this.$.getData('cusername')
}
});
});
//查询用户名称
this.$request
.globalRequest(
"/hiddenDanger/auth/getOperatorInformation", {
nuserid: this.$.getData('userInfo').username,
},
"GET"
)
.then((res) => {
if (res.code === 200) {
this.$.setData('cusername', res.result.cusername)
}
});
},
computed: {
},
onShow() {
},
methods: {
//取消
handleCancel() {
this.editFlag = false
this.getDetail(this.formData.id)
},
//保存
handleSave() {
if (this.cadreDriverImg[0]?.url) {
this.formData.cadreDriverImg = this.cadreDriverImg[0]?.url;
};
if (this.guaranteeImg[0]?.url) {
this.formData.guaranteeImg = this.guaranteeImg[0]?.url;
};
if (this.drivingImg[0]?.url) {
this.formData.drivingImg = this.drivingImg[0]?.url;
};
if (this.driverImg[0]?.url) {
this.formData.driverImg = this.driverImg[0]?.url;
};
const {
vehicleLicense,
vehicleType,
vehicleColor,
vin,
driverName,
driverIdNumber,
driverPhone,
streetCommunity,
villageCommunity,
communityCadre,
vehicleInsurance,
driverAddress,
cadreDriverImg,
guaranteeImg,
drivingImg,
driverImg,
driverAuthorizedModel,
vehicleStatus,
} = this.formData;
console.log(driverAuthorizedModel,'222222222222')
if (!vehicleLicense || !vehicleType || !vehicleColor || !vin || !driverName || !driverIdNumber || !
driverPhone ||
!streetCommunity || !villageCommunity || !communityCadre || !vehicleInsurance || !driverAddress || !
cadreDriverImg || !guaranteeImg || !drivingImg || !driverImg) {
return this.$.toast("请填写完成表单必填项");
}
let vehicleTypeValue = ''
let vehicleColorValue = ''
let vehicleInsuranceValue = ''
let vehicleStatusValue = ''
if (vehicleType) {
vehicleTypeValue = this.enumList.vehicleTypeEnum?.find(i => i.enumname ==
vehicleType)?.enumvalue
}
if (vehicleColor) {
vehicleColorValue = this.enumList.vehicleColorEnum?.find(i => i.enumname ==
vehicleColor)?.enumvalue
}
if (vehicleInsurance) {
vehicleInsuranceValue = this.enumList.getVehicleInsuranceEnum?.find(i => i
.enumname ==
vehicleInsurance)?.enumvalue
}
if (vehicleStatus) {
vehicleStatusValue = this.enumList.getVehicleStatusEnum?.find(i => i
.enumname ==
vehicleStatus)?.enumvalue
}
let streetCommunityValue = ''
let villageCommunityValue = ''
if (streetCommunity) {
streetCommunityValue = this.streetCommunityByXq?.find(i => i
.jdname ==
streetCommunity).jdcode
this.$request
.globalRequest(
"/hiddenDanger/config/getStreetCommunityByJq", {
jdcode: streetCommunityValue,
},
"GET"
)
.then((res) => {
if (villageCommunity) {
villageCommunityValue = res.result?.find(i => i
.sqname ==
villageCommunity).sqcode
}
console.log(driverAuthorizedModel,'333333333333333')
this.$request.globalRequest("/hiddenDanger/tricycle/saveTricycleInfo", {
...this.formData,
vehicleType: vehicleTypeValue,
vehicleColor: vehicleColorValue,
driverAuthorizedModel,
vehicleInsurance: vehicleInsuranceValue,
vehicleStatus: vehicleStatusValue,
streetCommunity: streetCommunityValue,
villageCommunity: villageCommunityValue
},
"POST"
)
.then((res) => {
this.editFlag = false
if (this.formData.vehicleId) {
uni.showToast({
title: '修改成功'
})
} else {
uni.showToast({
title: '保存成功'
})
setTimeout(() => {
this.$.back(1)
}, 500);
}
});
});
}
},
getDetail(id) {
this.formData = {}
this.$request
.globalRequest(
"/hiddenDanger/tricycle/getTricycleInfoBaseById", {
id
},
"GET"
)
.then((res) => {
if (res.code === 200) {
this.formData = res.result
if (res.result.cadreDriverImg) {
this.cadreDriverImg = [{
url: res.result.cadreDriverImg,
name: ''
}]
}
if (res.result.guaranteeImg) {
this.guaranteeImg = [{
url: res.result.guaranteeImg,
name: ''
}]
}
if (res.result.drivingImg) {
this.drivingImg = [{
url: res.result.drivingImg,
name: ''
}]
}
if (res.result.driverImg) {
this.driverImg = [{
url: res.result.driverImg,
name: ''
}]
}
//字典回显
const {
vehicleType,
vehicleColor,
vehicleInsurance,
vehicleStatus,
streetCommunity,
villageCommunity,
driverAuthorizedModel
} = this.formData
this.multiplePickValue = driverAuthorizedModel
if (vehicleType) {
this.formData.vehicleType = this.enumList.vehicleTypeEnum?.find(i => i.enumvalue ==
vehicleType)?.enumname
}
if (vehicleColor) {
this.formData.vehicleColor = this.enumList.vehicleColorEnum?.find(i => i.enumvalue ==
vehicleColor)?.enumname
}
if (vehicleInsurance) {
this.formData.vehicleInsurance = this.enumList.getVehicleInsuranceEnum?.find(i => i
.enumvalue ==
vehicleInsurance)?.enumname
}
if (vehicleStatus) {
this.formData.vehicleStatus = this.enumList.getVehicleStatusEnum?.find(i => i
.enumvalue ==
vehicleStatus)?.enumname
}
if (streetCommunity) {
this.formData.streetCommunity = this.streetCommunityByXq?.find(i => i
.jdcode ==
streetCommunity).jdname
this.$request
.globalRequest(
"/hiddenDanger/config/getStreetCommunityByJq", {
jdcode: streetCommunity
},
"GET"
)
.then((res) => {
this.streetCommunityByJd = res.result
if (villageCommunity) {
this.formData.villageCommunity = this.streetCommunityByJd?.find(i => i
.sqcode ==
villageCommunity).sqname
}
});
}
}
});
},
timestampToTime() {
var date = new Date()
var Y = date.getFullYear() + '-';
var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate());
return Y + M + D; // 返回格式:YYYY-MM-DD
},
//下拉选择
handleSelect(e, keyName) {
this.pickerType = 'keyName'
if (keyName == 'streetCommunity') {
if (this.formData.streetCommunity == e.value[0].jdname) {
return
}
this.formData.streetCommunity = e.value[0].jdname;
this.formData.villageCommunity = '';
// 村镇
this.$request
.globalRequest(
"/hiddenDanger/config/getStreetCommunityByJq", {
jdcode: e.value[0].jdcode,
nuserId: this.$.getData('token')
},
"GET"
)
.then((res) => {
this.streetCommunityByJd = res.result
});
} else if (keyName === 'villageCommunity') {
this.formData.villageCommunity = e.value[0].sqname;
} else {
this.formData[keyName] = e.value[0].enumname
}
},
//显示下拉
handleShowDrop(pickerType) {
if (!this.editFlag) {
return
}
this.pickerType = pickerType
},
//获取随机id
uuid(len, binary) {
len = !len ? 36 : len;
binary = !binary ? 16 : binary;
return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx"
.replace(/[xy]/g, function(c) {
var r = (Math.random() * binary) | 0,
v = c == "x" ? r : (r & 0x3) | 0x8;
return v.toString(binary);
})
.substring(0, len);
},
uploadFilePromise(event) {
return new Promise((resolve, reject) => {
let a = uni.uploadFile({
url: this.$.baseUrl + "/hiddenDanger/ftp/uploadFileToFtp", // 仅为示例,非真实的接口地址
filePath: event?.file.url,
name: "file",
formData: {
position: event.position,
longitude: event.longitude,
latitude: event.latitude
},
success: (res) => {
resolve(res.data);
},
});
});
},
async afterRead(event, key) {
// console.log(key)
// 当设置 multiple 为 true 时, file 为数组格式,否则为对象格式
const id = this.uuid();
this[key].push({
id,
...event?.file,
status: "uploading",
message: "上传中",
});
const result = await this.uploadFilePromise(event);
const resultInfo = JSON.parse(result);
const index = this[key]?.findIndex((v) => v.id === id);
if (resultInfo.code == 200) {
this[key].splice(
index,
1,
Object.assign(event?.file, {
status: "success",
message: "",
result: resultInfo,
url: resultInfo.result,
})
);
} else {
this.$.toast("上传失败");
this[key].splice(
index,
1,
);
}
},
// 删除图片
deletePic(event, keyName) {
if (!this.editFlag) {
return
}
this[keyName].splice(event.index, 1);
},
//多选确认
multiplePickConfirm(data, value, label) {
this.formData.driverAuthorizedModel = value.join()
console.log(value,this.formData.driverAuthorizedModel,'valuevaluevaluevaluevalue')
},
},
onReady() {},
// 页面卸载
onUnload() {},
}
</script>
<style>
</style>
<style lang="scss" scoped>
.footer-buttons {
z-index: 3;
}
page {
background: #F6F8FA;
}
.query-form {
font-size: 16px;
height: 44px;
background: #ffffff;
box-shadow: 3px 0px 10px #ccc;
color: #666666;
position: sticky;
// top: var(--status-bar-height + 88rpx);
top: calc(var(--status-bar-height) + 88rpx);
z-index: 10;
.search-box {
padding: 10px 10px 3px;
}
}
.formBox {
margin: 30rpx 20rpx;
border: 1px solid #e6e6e6;
background: #ffffff;
padding: 0 20rpx 20rpx;
box-sizing: border-box;
/deep/ .uni-forms-item--border .uni-forms-item__content {
justify-content: flex-end;
text-align: right;
}
.photo {
width: 100%;
image {
width: 100%;
}
}
}
.Box {
padding-top: var(--status-bar-height);
.Content {
width: calc(100% - 48rpx);
padding-bottom: 88rpx;
}
.Unit {
padding: 12rpx;
display: flex;
justify-content: space-between;
align-items: center;
position: relative;
box-shadow: 1px 1px 3px #ccc;
.trapezoidal {
position: absolute;
top: -0px;
right: 0px;
color: #ffffff;
font-size: 22rpx;
font-weight: normal;
z-index: 1;
}
image {
width: 200rpx;
}
.right {
flex: 1;
padding-left: 30rpx;
.title {
font-size: 16px;
width: 380rpx;
min-height: 80rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
.type {
font-size: 14px;
color: #666;
font-weight: normal;
text {
margin-right: 20rpx;
}
}
}
}
}
.label-box {
display: flex;
align-items: center;
height: 110rpx;
font-size: 30rpx;
font-weight: 600;
.border {
background-color: #2663BF;
height: 35rpx;
width: 6rpx;
margin-right: 14rpx;
}
}
.label-box2 {
height: 100rpx;
}
.label-box-small {
font-size: 28rpx;
margin-top: -25rpx;
font-weight: 500;
}
.border-bottom {
border-bottom: 1px #eee solid;
}
.border-top {
border-top: 1px #eee solid;
}
/deep/ .uni-forms-item__label {
font-size: 28rpx;
height: auto;
margin-bottom: 20rpx;
white-space: nowrap;
}
/deep/ .u-input {
background-color: #ffffff !important;
}
.detail-item-flex {
display: flex;
align-items: center;
justify-content: space-between;
}
.investigation-item-zl {
.uni-forms-item--border {
border: none;
}
border-top: 1px solid #eee;
}
.btn-right {
width: 100%;
text-align: right;
}
.bottom {
position: fixed;
bottom: 0;
width: calc(100% - 40rpx);
padding: 18rpx 20rpx;
height: 80rpx;
background: #FFFFFF;
border-top: 1px solid #cccccc;
display: flex;
justify-content: space-between;
align-items: center;
z-index: 3;
}
.Img {
width: 512rpx;
height: 440rpx;
margin: 0 auto;
}
.trapezoidal {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
flex: 1;
width: 20%;
height: 100%;
box-sizing: border-box;
text-align: center;
border-radius: 10rpx;
line-height: 60rpx;
&.primary {
background: #2663BF;
color: #fff;
&::after,
&::before {
background: #2663BF;
}
}
}
.trapezoidal::before,
.trapezoidal::after {
content: '';
position: absolute;
top: 0;
width: 100%;
height: 100%;
border-radius: 10rpx;
background: #E9EDF5;
z-index: -1;
transform-origin: bottom;
box-sizing: border-box;
}
.trapezoidal::after {
left: auto;
right: 0;
border-radius: 10rpx;
background-color: #E9EDF5;
border-left: 0 none;
}
.gary {
color: gray;
text-align: right !important;
}
.Height100 {
font-size: 14px;
}
.font_style {
font-size: 14px;
white-space: nowrap;
}
</style>