zhapp/pages/orders/orders.vue

<template>
	<view class="parent">
		<!-- 查询区域Start -->
		<view>
			<view class=" flexd " style="z-index: 99;">
				<view class="search dis a-c j-s" style="padding-top:55px;">
					<u-search v-model="pageRequest.licenseNo" @custom="custom" @search="search" :shape="shape"
						height='68rpx' bgColor="rgba(255,255,255,0.5)" color="#000"
						:inputStyle="{background:'transparent'}" placeholderColor="#999" :clearabled="clearabled"
						:showAction="showAction" :inputAlign="inputAlign" @clear="clear"
						:actionStyle="{background:'#000'}" placeholder="请输入车牌号"></u-search>
					<image src="/static/image/car-insure/dropdown.png" mode="" @tap="searchPopup"></image>
				</view>
				<view :class="['dropdown-content', { 'show': showDropdown }]" @tap="searchPopup">
					<view :class="['dropdown-content1','dis','f-c','j-s','', { 'scolcentent': showDropdown }]"
						@tap.stop.prevent>
						<scroll-view scroll-y="true" class="scolcentent ">
							<view style="padding: 0px 20px;">
								<view class="term">
									<text>订单状态</text>
									<view class="dis  a-c f-wrap j-start" style="margin-top: 10px;">
										<view class="status-data"
											:class="item.value===pageRequest.orderStatus? 'active':''"
											v-for="(item,index) in statusList"
											@tap.stop.prevent="statusclick(item.value)" :key="index">
											{{item.label}}
										</view>
									</view>
								</view>
								<view class="term">
									<text>投保险种</text>
									<view class="dis  a-c f-wrap j-start" style="margin-top: 10px;">
										<view class="status-data"
											:class="item.value==pageRequest.productid? 'active':''"
											v-for="(item,index) in insurance_typeoptions"
											@tap="productstatusclick(item.value)" :key="index">
											{{item.label}}
										</view>
									</view>
								</view>
								<view class="term">
									<text>保险公司</text>
									<view class="dis  a-c f-wrap j-start" style="margin-top: 10px;">
										<view class="status-data"
											:class="item.companyCode==pageRequest.companyId? 'active':''"
											v-for="(item,index) in esmInsCompanyList"
											@tap="companystatusclick(item.companyCode)" :key="index">
											{{item.nameSimple}}
										</view>
									</view>
								</view>
								<view class="term">
									<text>车牌号</text>
									<view class="dis  a-c f-wrap j-start" style="margin-top: 10px;">
										<view class="status-data" :class="item==pageRequest.licenseNo? 'active':''"
											v-for="(item,index) in vehiclePlateList" @tap="licenseNoclick(item)"
											:key="index">
											{{item}}
										</view>
									</view>
								</view>
								<view class="term">
									<text>被保人</text>
									<view class="dis  a-c f-wrap j-start" style="margin-top: 10px;">
										<view class="status-data" :class="item==pageRequest.insuredName? 'active':''"
											v-for="(item,index) in insuranceList" @tap="insuranceclick(item)"
											:key="index">
											{{item}}
										</view>
									</view>
								</view>
								<view class="term">
									<text>订单日期</text>
									<view class="dis  a-c f-wrap j-start" style="margin-top: 10px;">
										<view class="status-data" :class="item.value==timespecifications? 'active':''"
											v-for="(item,index) in dateList" @tap="dateclick(item.value)" :key="index">
											{{item.label}}
										</view>
										<view class="dis a-c">
											<view class="status-data" :class="startShow? 'active' :''"
												@tap="startShowmethod()">
												<text v-if="pageRequest.startDate!=''">{{pageRequest.startDate}}</text>
												<text v-else>{{transformTime()}}</text>
											</view>
											<text style="margin: 0 8px;font-size: 12px;">至</text>
											<view class="status-data" :class="endShow? 'active' :''"
												@tap="endShowmethod()">
												<text v-if="pageRequest.endDate!=''">{{pageRequest.endDate}}</text>
												<text v-else>{{transformTime()}}</text>
											</view>
										</view>
									</view>
								</view>
							</view>
						</scroll-view>
						<view class="operateBtn dis ">
							<view class="cancel dis a-c j-c" @click="showDropdown=false">
								取消
							</view>
							<view class="confirm dis a-c j-c" @click="querysearch">
								确定
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view style="padding: 110px 16px 50px 16px;">
			<view v-for="(item,index) in pageResult" :key="index">
				<view class="orderItemPane" v-for="(statusitem, statusindex) in statusList" :key="statusindex"
					v-if="item.orderStatus == statusitem.value" :style="{background:statusitem.itemback}">
					<view class="orderItemPane-upper dis j-s a-c ">
						<view class="dis a-c j-start">
							<image :src="statusitem.src" mode="" style="width: 22px;height: 22px;margin-right: 5px;">
							</image>
							<text class="licenseno">{{item.licenseNo}}</text>
						</view>
						<view class="colorBlock">
							{{item.productName}}
						</view>
					</view>
					<view class="orderItemPane-centre">
						<view class="dis f-c">
							<text style="font-size: 14px;">订单号：{{item.orderNo}}</text>
							<view class="dis a-c j-s mt-2">
								<view class="dis a-end ">
									<view class="dis f-c a-c">
										<text style="font-size: 24rpx;color: #333">车主</text>
										<text style="font-size: 24rpx;color: #333">{{item.ownerName}}</text>
									</view>
									<image src="../../static/image/car-insure/phone.png" mode=""
										style="width: 16px;height: 16px;margin: 0 0 5px  10px;"
										@click="phone(item.ownerMobile)"></image>
								</view>
								<view class="dis a-end ">
									<view class="dis f-c a-c">
										<text style="font-size: 24rpx;color: #333">投保人</text>
										<text style="font-size: 24rpx;color: #333">{{item.policyName}}</text>
									</view>
									<image src="../../static/image/car-insure/phone.png" mode=""
										style="width: 16px;height: 16px;margin: 0 0 5px  10px;"
										@click="phone(item.policyMobile)"></image>
								</view>
								<view class="dis a-end ">
									<view class="dis f-c a-c">
										<text style="font-size: 24rpx;color: #333">被保人</text>
										<text style="font-size: 24rpx;color: #333">{{item.insurName}}</text>
									</view>
									<image src="../../static/image/car-insure/phone.png" mode=""
										style="width: 16px;height: 16px;margin: 0 0 5px  10px;"
										@click="phone(item.insurMobile)"></image>
								</view>
							</view>
							<view class="dis f-c mt-2">
								<template>
									<view v-if=" item.ciStartDate " class="time dis j-s a-c">
										<template>
											<text>交强险投保时间</text>
											<text>{{item.ciStartDate}}</text>
										</template>
									</view>
								</template>
								<template>
									<view v-if=" item.biStartDate " class="time dis j-s a-c">
										<template>
											<text>商业险投保时间</text>
											<text>{{item.biStartDate}}</text>
										</template>
									</view>
								</template>

							</view>
						</view>
					</view>
					<view class="orderItemPane-below dis a-c  j-end f-wrap">
						<u-button :custom-style="{fontSize:'12px'}" shape="circle" size="mini" :hair-line="false"
							:plain="true" @click="CloseEdit(item.orderNo)" style="width: auto;margin: 0;">编辑</u-button>
						<u-button shape="circle" size="mini" :custom-style="{fontSize:'12px'}" :hair-line="false"
							:plain="true" @click="detial(item.orderNo)"
							style="width: auto;margin: 0;margin-left: 10px;">查看详情</u-button>
					</view>
				</view>
			</view>
			<!-- <u-loadmore v-if="pageResult.length!=0" :status="status" /> -->
		</view>
		<u-empty v-if="pageResult.length==0" />
		<!-- 回到顶部 -->
		<u-picker :show="startShow" mode="time" :params="params" @confirm="startconfirm"></u-picker>
		<u-picker :show="endShow" mode="time" :params="params" @confirm="endconfirm"></u-picker>
		<u-modal :show="closeOrderShow" title="提示" :showCancelButton="true" @confirm="closeOrderconfirm"
			confirm-text="确定">
			<view class="slot-content dis  a-c j-c  p-2">
				确认关闭订单?
			</view>
		</u-modal>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from "vuex"
	// import carOrders from "@/components/modules/orders/carOrders.vue";
	import {
		watch
	} from "vue";
	export default {
		components: {},
		data() {
			return {
				closeOrderShow: false,
				insurance_typeoptions: [],
				show: true,
				showDropdown: false,
				/* 时间筛选相关 */
				startShow: false,
				endShow: false,
				params: {
					year: true, //年
					month: true, //月
					day: true, //日
				},
				/* 时间筛选相关 */
				pageRequest: { //查询的默认条件
					companyId: "",
					orderNo: "",
					frameNo: "",
					insuredName: "",
					licenseNo: "",
					orderStatus: "",
					userId: "",
					deptId: "",
					endDate: "",
					startDate: "",
					productid: "",
					pages: 1,
					size: 20,
				},
				timespecifications: null,
				pageResult: [], //列表数据
				/* 搜索框配置 */
				shape: 'square',
				clearabled: true,
				showAction: false,
				inputAlign: 'left',
				/* 搜索框配置 */
				//状态筛选list
				statusList: [{
						label: '全部',
						value: " ",
					},
					{
						label: '待核保',
						value: 1,
						btnColor: "#229805",
						btnbackground: "rgba(34,152,5,0.05)",
						itemback: "linear-gradient( 180deg, #EEFFE4 0%, #CDFFB6 100%)",
						src: "/static/image/car-insure/state.png"
					},
					{
						label: '人工处理',
						value: 3,
						btnColor: "#FF5600",
						btnbackground: "rgba(255,86,0,0.05)",
						itemback: "linear-gradient( 180deg, #FFEDE3 0%, #FFC7AB 100%)",
						src: "/static/image/car-insure/state.png"
					},
					{
						label: '待缴费',
						value: 4,
						btnColor: "#FF0F00",
						btnbackground: "rgba(255,15,0,0.05)",
						itemback: "linear-gradient( 180deg, #FFEEEC 0%, #FFA8A2 100%)",
						src: "/static/image/car-insure/state.png"
					},
					{
						label: '已承保',
						value: 5,
						btnColor: "#0052FF",
						btnbackground: "rgba(0,82,255,0.05)",
						itemback: "linear-gradient( 180deg, #ECFFFE 0%, #CCF9FF 100%)",
						src: "/static/image/car-insure/state.png"
					},

					{
						label: '报价失败',
						value: 6,
						btnbackground: "rgba(158,0,255,0.05)",
						itemback: "linear-gradient( 180deg, #FFF4E4 0%, #FFEBB6 100%)",
						src: "/static/image/car-insure/state.png"
					},
					{
						label: '核保失败',
						value: 7,
						btnbackground: "rgba(158,0,255,0.05)",
						itemback: "linear-gradient( 180deg, #FFF4E4 0%, #FFEBB6 100%)",
						src: "/static/image/car-insure/state.png"
					},
					{
						label: '订单关闭',
						value: 8,
						btnbackground: "rgba(158,0,255,0.05)",
						itemback: "linear-gradient( 180deg, #FFF4E4 0%, #FFEBB6 100%)",
						src: "/static/image/car-insure/state.png"
					}
				],
				//日期筛选list
				dateList: [{
						label: '全部',
						value: 0,
					},
					{
						label: '近1天',
						value: 1,
					},
					{
						label: '近2天',
						value: 2,
					},
					{
						label: '近3天',
						value: 3,
					},
					{
						label: '近4天',
						value: 4,
					},
					{
						label: '近5天',
						value: 5,
					},
					{
						label: '近6天',
						value: 6,
					},
					{
						label: '近7天',
						value: 7,
					},
					{
						label: '一个月内',
						value: '一个月内',
					},
					{
						label: '三个月内',
						value: '三个月内',
					},
					{
						label: '六个月内',
						value: '六个月内',
					},

				],
				typeArray: [{
						label: '车险',
						value: 0,
					},
					{
						label: '意外险',
						value: 1,
					},
					{
						label: '寿险',
						value: 2,
					}
				], //订单的类型
				vehiclePlateList: [], //车牌
				insuranceList: [], //被保人
				toTopFlag: false, //显示回到顶部按钮
				queryLicenseNo: "",
				queryFrameNo: "",
				insureMore: false,
				insureMoreIndex: null,
				esmInsCompanyList: [],
				status: 'loadmore',
				totalPages: 0, //订单总页数
				stepShow: false, //步骤条弹框
				numList: [{
						"processingStatus": "1",
						"processingStatusFlag": true,
						"name": "提现申请",
						"date": "2024-07-31 19:25:12"
					},
					{
						"processingStatus": "2",
						"processingStatusFlag": true,
						"name": "处理中",
						"date": "2024-07-31 19:25:12"
					},
					{
						"processingStatus": "4",
						"processingStatusFlag": true,
						"name": "提现成功",
						"date": "2024-08-01 08:49:12"
					}
				],
				orderno: "",
			}
		},
		onReachBottom() {
			if (this.pageRequest.pages >= this.totalPages) return;
			this.status = 'loading';
			this.pageRequest.pages = ++this.pageRequest.pages;
			setTimeout(async () => {
				let res = await this.$http.post('/supplementOrder/queryList', this.pageRequest);
				if (res.code == '200') {
					this.pageResult = [...this.pageResult, ...res.data.records];
				}
				if (this.pageRequest.pages >= this.totalPages) this.status = 'nomore';
				else this.status = 'loading';
			}, 1000)
		},
		computed: {
			...mapState(['userInfo', 'licenseNo'])
		},

		// 页面滚动触发
		onPageScroll(e) { //根据距离顶部距离是否显示回到顶部按钮
			if (e.scrollTop > 600) { //当距离大于600时显示回到顶部按钮
				this.toTopFlag = true
			} else { //当距离小于600时显示回到顶部按钮
				this.toTopFlag = false
			}
		},
		onShow() {
			console.log(this.licenseNo);
			if (this.licenseNo) {
				this.pageRequest.licenseNo = this.licenseNo;
			}
			const arr = uni.getStorageSync('historyInfo');
			if (arr) {
				uni.removeStorageSync('historyInfo');
			}
			this.getOrdersList(1, 20)
			this.esmInsCompany()

		},
		onPullDownRefresh() {
			this.getOrdersList(1, 20)
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		onLoad() {
			this.getOrdersList(1, 20)
			this.getDicType("insurance_type"); //车船税类型
		},
		methods: {
			...mapMutations(['setOrderStage']),
			phone(phone) {
				// 获取宿主上下文  
				var main = plus.android.runtimeMainActivity();
				var Uri = plus.android.importClass("android.net.Uri");
				// 通过反射获取Android的Intent对象  
				var Intent = plus.android.importClass("android.content.Intent");
				// 创建Intent，设置Action为ACTION_DIAL  
				var intent = new Intent("android.intent.action.DIAL");
				// 设置要拨打的电话号码  
				intent.setData(Uri.parse("tel:" + phone));
				// 启动Intent  
				main.startActivity(intent);
				// ...  	
				// uni.makePhoneCall({
				// 	phoneNumber: phone, //仅为示例
				// });

			},
			async closeOrderconfirm() {
				let res = await this.$http.get('/insurance/order/shutDown/' + this.orderno);
				if (res.code == '200') {
					this.getOrdersList(1, 20);
					uni.showToast({
						title: "关闭成功",
						icon: 'none',
					});
				}
			},
			//关闭订单
			closeOrder(orderno) {
				this.orderno = orderno;
				this.closeOrderShow = true;
			},
			btn_click() {
				uni.navigateTo({
					url: '/pages/chat/chat'
				})
			},
			async getOrdersList(page, size) {
				this.pageRequest.pages = page;
				this.pageRequest.size = size;
				let res = await this.$http.post('/supplementOrder/queryList', this.pageRequest);
				console.log(res);
				if (res.code == '200') {
					this.pageResult = res.data.records;
					this.totalPages = res.data.total;
				}
			},
			async getDicType(type) {
				let res = await this.$http.get('/dict/get?dictCode=' + type);
				if (res.code == 200) {
					this[type + 'options'] = [{
						label: "全部",
						value: " ",
					}, ...res.data];
				}
			},
			async esmInsCompany() {
				let commpanykad = await this.$http.get('/supplementOrder/getExistCompany');
				if (commpanykad.code == '200') {
					this.esmInsCompanyList = commpanykad.data;
				}
			},
			searchPopup() {
				this.showDropdown = !this.showDropdown;
			},
			//展开
			selectMore(val) {
				this.insureMore = true;
				this.insureMoreIndex = val;
			},
			packup(val) {
				this.insureMore = false;
				this.insureMoreIndex = val;
			},
			//查询事件
			querysearch() {
				this.getOrdersList(1, 20);
				this.showDropdown = false;
			},
			insuranceclick(e) {
				if (e === this.pageRequest.insuredName) {
					this.pageRequest.insuredName = ''
				} else {
					this.pageRequest.insuredName = e;
				}
			},
			licenseNoclick(e) {
				if (e === this.pageRequest.licenseNo) {
					this.pageRequest.licenseNo = ''
				} else {
					this.pageRequest.licenseNo = e;
				}
			},
			//状态筛选
			statusclick(e) {
				if (e === this.pageRequest.orderStatus) {
					this.pageRequest.orderStatus = ''
				} else {
					this.pageRequest.orderStatus = e;
				}
				// console.log(this.pageRequest.orderStatus)

			},
			//保险公司筛选
			companystatusclick(e) {
				// this.pageRequest.companyId = e;
				if (e == this.pageRequest.companyId) {
					this.pageRequest.companyId = ''
				} else {
					this.pageRequest.companyId = e;
				}

			},
			//投保险种筛选
			productstatusclick(e) {

				if (e == this.pageRequest.productid) {
					this.pageRequest.productid = ''
				} else {
					this.pageRequest.productid = e;
				}
			},
			startShowmethod() {
				this.startShow = true;
				this.timespecifications = null;
			},
			endShowmethod() {
				this.endShow = true;
				this.timespecifications = null;
			},
			//日期筛选
			dateclick(e) {
				console.log(e);
				/* 0:全部  1：一周内 2：一个月内 3：三个月内  4:六个月内*/
				switch (e) {

					case 0:
						this.pageRequest.startDate = "";
						this.pageRequest.endDate = "";

						break;
					case 1:
					case 2:
					case 3:
					case 4:
					case 5:
					case 6:
					case 7:
						this.pageRequest.startDate = this.transformTime(e);
						this.pageRequest.endDate = this.transformTime();
						this.vehiclePlateform(this.pageRequest.startDate, this.pageRequest.endDate);
						this.insuranceform(this.pageRequest.startDate, this.pageRequest.endDate);
						break;
					case '一个月内':
						this.pageRequest.startDate = this.transformTime1(1);
						this.pageRequest.endDate = this.transformTime();
						break;
					case '三个月内':
						this.pageRequest.startDate = this.transformTime1(3);
						this.pageRequest.endDate = this.transformTime();
						break;
					case '六个月内':
						this.pageRequest.startDate = this.transformTime1(6);
						this.pageRequest.endDate = this.transformTime();
						break;
					default:
				}
				this.timespecifications = e;

			},
			async vehiclePlateform(start, end) {
				let res = await this.$http.post('/insurance/order/queryLicenseInOrder', {
					startDate: start,
					endDate: end,
				});
				if (res.code == 200) {
					this.vehiclePlateList = res.data;
				}
			},
			async insuranceform(start, end) {
				let res = await this.$http.post('/insurance/order/queryInsuredInOrder', {
					startDate: start,
					endDate: end,
				});
				if (res.code == 200) {
					this.insuranceList = res.data;
				}
			},
			startconfirm(e) {
				this.pageRequest.startDate = e.year + '-' + e.month + '-' + e.day;
			},
			endconfirm(e) {
				this.pageRequest.endDate = e.year + '-' + e.month + '-' + e.day;
			},
			//验证车架号
			isFrameno(str) {
				let mPattern = /^([0-9A-Z]){17}$/;
				return mPattern.test(str);
			},
			isCarBrand(str) {
				let mPattern = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼A-Z]{1}[A-Z]{1}[A-Z0-9]{4,5}([A-Z0-9挂学警港澳使领]{1}|应急)$/ ||
					/^沪[0-9A-Z]{5}$/ || /^陆丰[0-9A-Z]{4}临$/;
				return mPattern.test(str.trim())
				// return /^陆丰[0-9A-Z]{4}临$/.test(str.trim())
			},
			//查看详情
			detial(id) {
				uni.navigateTo({
					url: '/pages/quote/quoteDetail',
					success: (res) => {
						res.eventChannel.emit("acceptData", {
							id: id,
						})
					}
				}, "navigateTo", true);
			},
			//报价历史
			quotehistory(val, Status) {
				let params = {
					orderno: val.orderno,
					insuredname: val.insuredname,
					licenseno: val.licenseno,
					modelcname: val.carinfo.modelcname,
					orderStatus: Status,
					product: val.product,
					ownername: val.ownerinfo.name,
					applyname: val.applyinfo.name,
					insurename: val.insureinfo.name,
				}
				uni.navigateTo({
					url: `/pages/orders/quoteHistory?orderno=${JSON.stringify(params)}`
				})
			},

			//编辑
			CloseEdit(val) {
				uni.navigateTo({
					url: "/pages/quote/premiumCalc?orderno=" + val
				})
				// this.navigate({
				// 	url: '/pages/carInsure1/quote1',
				// 	success: (res) => {
				// 		res.eventChannel.emit("acceptData", {
				// 			carInfo: val.carinfo, //车辆信息
				// 			ownerInfo: val.ownerinfo, //车主信息
				// 			policyHolderInfo: val.applyinfo, //
				// 			insuredPersonInfo: val.insureinfo,
				// 			riskList: val.risk,
				// 			kindList: val.king,
				// 			orderno: val.orderno, //车辆
				// 			quoteno: val.quoteno, //车主
				// 			vehicleAndVesselTaxForm: val.vehicleAndVesselTax, //车船税
				// 		})
				// 	}
				// }, "navigateTo", true);
			},
			//回车搜索事件
			search(val) {
				this.getOrdersList(1, 20);
			},
			//搜索按钮事件
			custom(val) {
				this.getOrdersList(1, 20);
			},
			//搜索框清除事件
			clear(val) {

			},
			//关闭订单后查询
			closeOrders() {
				this.totalSize = 0;
				this.ordersList = []; //获取到的订单列表
				this.currentPage = 1; //当前的页数
				this.totalPages = 1; //总共的页数
			},
			//当前时间
			transformTime(day) {
				var date = new Date();
				date.setFullYear(date.getFullYear());
				date.setTime(date.getTime());
				var strYear = date.getFullYear();
				var strDay = day ? date.getDate() - day : date.getDate();
				var strMonth = date.getMonth() + 1;
				if (strMonth < 10) {
					strMonth = "0" + strMonth;
				}
				if (strDay < 10) {
					strDay = "0" + strDay;
				}
				var datastr = strYear + "-" + strMonth + "-" + strDay;
				return datastr;
			},
			transformTime1(month) {
				var date = new Date();
				date.setFullYear(date.getFullYear());
				date.setTime(date.getTime());
				var strYear = date.getFullYear();
				var strDay = date.getDate();
				var strMonth = month ? (date.getMonth() + 1) - month : date.getMonth() + 1;
				if (strMonth < 10) {
					strMonth = "0" + strMonth;
				}
				if (strDay < 10) {
					strDay = "0" + strDay;
				}
				var datastr = strYear + "-" + strMonth + "-" + strDay;
				return datastr;
			},
		}
	}
</script>
<style>
	page {
		background-color: #F8FAFE;
	}

	.warp {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 100%;
	}

	.rect {
		width: 90%;
		height: 80%;
		background-color: #fff;
	}
</style>
<style lang="scss" scoped>
	::deep uni-tabbar .uni-tabbar-bottom {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
	}

	::deep .u-action[data-v-1a326067] {
		color: #FFFFFF;
	}

	::deep .u-dropdown__menu__item__arrow[data-v-01c0c507] uni-text {
		color: #FFFFFF !important;
	}

	.dropdown-content {
		background-color: rgba(0, 0, 0, 0.6);
		height: 0px;
		opacity: 0;
		transition: opacity 0.3s ease;

		.title {
			font-size: 14px;
			color: #232832;
			font-weight: bold;
			border-bottom: 1px solid #E1E1E1;
		}

		.term {
			padding-top: 10px;

			>text {
				color: #232832;
				font-weight: bold;
				font-size: 13px;
			}
		}

		.operateBtn {
			font-weight: bold;
			font-size: 16px;
			margin-bottom: 20px;

			.cancel {
				width: 50%;
				height: 46px;
				color: #333333;
				background-color: #fff;
				border-radius: 50rpx;
				border: 1px solid #FDE935;
				margin-right: 20px;
			}

			.confirm {
				width: 50%;
				height: 46px;
				color: #1f1f1f;
				background-color: #FDE935;
				border-radius: 50rpx;
			}
		}
	}


	.dropdown-content1 {
		background-color: #fff;
		height: 0px;
		overflow: hidden;
		transition: height 0.4s ease;
	}

	.show {
		height: 100vh;
		opacity: 1;
		/* 下拉菜单内容的最大高度 */
	}

	.scolcentent {
		height: 450px;
		margin-bottom: 10px;
		overflow-y: auto;
		/* 下拉菜单遮罩最大高度 */
	}

	.headers {
		background-color: rgba(199, 198, 202, 0.4);
		width: 100%;
		height: 0;
		position: absolute;
		z-index: 999;
	}

	.parent {
		position: relative;
	}

	.search-condition {
		padding: 0 16px;

		.title {
			font-size: 14px;
			color: #232832;
			font-weight: bold;
			border-bottom: 1px solid #E1E1E1;
		}

		.term {
			padding-top: 10px;

			>text {
				color: #232832;
				font-weight: bold;
				font-size: 13px;
			}
		}
	}



	.search {
		padding: 13px 16px;
		background-image: url("/static/image/ePolicy.png");
		background-size: cover;

		image {
			width: 22px;
			height: 22px;
			margin-left: 20px;
		}
	}

	.slot-content1 {
		background-color: #FFFFFF;
		padding: 24rpx;
	}

	.title {
		font-weight: bold;
		color: #333;
	}

	.status-data {
		padding: 4px 10px;
		box-sizing: border-box;
		margin: 0 4px 4px 0;
		font-size: 12px;
		border: 1px solid #eee;
		cursor: pointer;
	}

	.active {
		position: relative;
		border: 1px solid #FDE935;
		font-weight: bold;

		&::after {
			content: '';
			position: absolute;
			right: 0;
			bottom: 0;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 0 0 24rpx 24rpx;
			/* 调整三角形大小 */
			border-color: transparent transparent #FDE935 transparent;
			/* 黄色三角形 */
		}

		&::before {
			content: '✓';
			position: absolute;
			right: 3rpx;
			/* 微调位置 */
			bottom: 0;
			font-size: 14rpx;
			/* 调整对勾大小 */
			color: #333;
			/* 对勾颜色 */
			z-index: 1;
			/* 确保对勾在三角形上方 */
		}

	}




	.orderItemPane {
		width: 100%;
		height: auto;
		margin: 10px 0;
		border-radius: 10px;
		background: #FFFFFF;
		box-shadow: 0px 4px 10px 0px #DAE3F4;
		border-radius: 6px;
		cursor: pointer;
	}

	.orderItemPane-upper {
		background: rgba(255, 255, 255, 0.5);
		border-radius: 6px 6px 0px 0px;
		padding: 13rpx 16rpx;

		.licenseno {
			font-family: Source Han Sans SC, Source Han Sans SC;
			font-weight: bold;
			font-size: 14px;
			color: #181818;
		}

		.colorBlock {
			background: #FF7F00;
			box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.1);
			border-radius: 4px;
			border: 1px solid #FEEDDF;
			color: #fff;
			font-size: 26rpx;
			font-weight: bold;
			padding: 0 10px;
		}
	}

	.orderItemPane-centre {
		padding: 7px 14px;

		>view>text {
			font-weight: bold;
			color: #232832;
		}

		.time {
			>text {
				color: rgba(51, 51, 51, 0.8);
				font-size: 12px;
			}

			.downstyle {
				background: rgba(255, 255, 255, 0.6);
				border-radius: 2px;
				padding: 2px 8px;
				margin: 0 4px;
				color: #333333;
				font-size: 12px;
			}
		}
	}

	.orderItemPane .orderItemPane-centre,
	.inscommny-sum>text {
		color: rgba(51, 51, 51, 0.8);
		font-weight: 400;
	}

	.orderItemPane-below {
		height: auto;
		padding: 10px;
		background: #ffff;
		border-radius: 0 0 6px 6px;

		&>button {
			margin-left: 10px;
			margin-bottom: 5px;
		}
	}


	.orderItemPane-extend .extend-button>text {
		color: #ff9000;
		font-size: 12px;
	}

	.orderItemPane-extend {
		border-bottom-right-radius: 10px;
		border-bottom-left-radius: 10px;
	}

	.classes::before {
		content: "·";
		color: #ff9000;
		margin-right: 10px;
	}

	.flexd {
		position: fixed;
		left: 0;
		right: 0;
	}

	.moosize {
		font-size: 12px;
		color: rgba(51, 51, 51, 0.6);
		font-weight: 400;
	}

	.color {
		color: #ff9000;
	}

	/* 查询区域End */
</style>