repairCard.vue 4.49 KB
<template>
	<view class="orderCardCss usuallyCard">
		<view class="flex justify-between">
			<view class="">
				{{orderObj.fBxlx}}_{{orderObj.fBxlxmx}}
			</view>
			<view class="themeColor">
				{{orderObj.fZt || ""}}
				<!-- <span v-if="orderObj.fZt =='待处理'">待维修</span>
				<span v-else>已维修</span> -->
			</view>
		</view>
		<view class="flex justify-between w100 margin-top align-center">
			<view class="text-grey">
				报修单号:{{orderObj.fGdh}}
			</view>
		</view>
		<view class="flex justify-between w100 margin-top align-center">
			<view class="text-grey">
				联系人:{{orderObj.fLxr || ""}}({{orderObj.fLxrdh || ''}})
			</view>
			<view class="" @click="handlePhone">
				<u-image src="/static/images/home/dianhua.png" width="18px" height="18px"></u-image>
			</view>
		</view>
		<view class="flex justify-between w100 margin-top align-center">
			<view class="text-grey w80 flex align-start">
				<u-icon name="map-fill" color="#8799AC" class="" style="margin:3px 5px 0 0;"></u-icon>
				<view class="">
					{{orderObj.fLxdzsf || ""}} {{orderObj.fLxdzs || ""}} {{orderObj.fLxdzq || ""}}
					{{orderObj.fLxdzjd || ''}} {{orderObj.fLxdzxxdz || ""}}
				</view>
			</view>
			<view class="" @click.stop="handleMap">
				<u-image src="/static/images/home/daohang.png" width="18px" height="18px"></u-image>
			</view>
		</view>
		<view class="flex justify-end align-center margin-top-lg">
			<view class="" v-if="orderStatus === 0" @click="goToDetailPage('dcl')">
				<u-button shape="circle" :customStyle="{color:'#666666'}">查看详情</u-button>
			</view>
			<view class="margin-left" v-if="orderObj.fZt === '待处理' && orderStatus === 0" @click="goToTjgdPage">
				<u-button shape="circle" color="#EA5504">提交工单</u-button>
			</view>
			<view class="margin-left" v-if="orderStatus === 1" @click="goToDetailPage('ycl')">
				<u-button shape="circle" color="#EA5504">查看详情</u-button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		components: {

		},
		props: {
			orderStatus: {
				type: Number,
				default: 0
			},
			orderObj: {
				type: Object,
				default: () => {}
			}
		},
		data() {
			return {

			};
		},
		async mounted() {
			this.loadImages();
		},
		watch: {
			orderObj: {
				handler() {
					this.$nextTick(() => {
						this.loadImages();
					});
				},
				deep: true, // 深度监听orderList的变化
			},
		},
		methods: {
			async loadImages() {
				let that = this;
				if (this.orderObj.ddxqList && this.orderObj.ddxqList.length > 0) {
					for (let i = 0; i < this.orderObj.ddxqList.length; i++) {
						let JsonParse = JSON.parse(this.orderObj.ddxqList[i].fTp);
						let photoUrl = await this.$getPhotoUrl(JsonParse[0].response.fileId);
						this.$set(this.orderObj.ddxqList[i], 'image', photoUrl);
					}
				}
			},
			goToDetailPage(type) {
				console.log(this.orderObj);
				let Json = JSON.stringify(this.orderObj)
				uni.navigateTo({
					url: `/pages/home/appList/onSiteRepair/repairDetail?mode=wx&type=${type}&id=${this.orderObj.id}`
				})
			},
			handleMap() {
				let jd = this.orderObj.fJd || "";
				let wd = this.orderObj.fWd || "";
				let ads = this.orderObj.ddqc || "";
				if(!jd || !wd){
					uni.$u.toast('无定位信息')
					return
				}
				this.$viewMapLocation(jd, wd, ads);
				console.log('打印this.orderObj', this.orderObj);
			},
			handlePhone() {
				console.log('打印this.orderObj', this.orderObj);
				uni.makePhoneCall({
					phoneNumber: this.orderObj.fLxrdh, // 电话号码
					success: function() {
						console.log('拨打电话成功!');
					},
					fail: function(err) {
						console.log('拨打电话失败:' + JSON.stringify(err));
					}
				});
			},
			goToTjgdPage() {
				console.log('订单详情', JSON.parse(JSON.stringify(this.orderObj)));
				let orderParams = {
					id: this.orderObj.id,
					fBxlx: this.orderObj.fBxlx,
					fGdh: this.orderObj.fGdh,
					fXdxm: this.orderObj.fXdxm,
					fLxfs: this.orderObj.fLxfs,
					fLxdzsf: this.orderObj.fLxdzsf,
					fLxdzs: this.orderObj.fLxdzs,
					fLxdzq: this.orderObj.fLxdzq,
					fLxdzjd: this.orderObj.fLxdzjd,
					fLxdzxxdz: this.orderObj.fLxdzxxdz,
					fJd: this.orderObj.fJd,
					fWd: this.orderObj.fWd,
					adsName:this.orderObj.ddqc
				}
				uni.navigateTo({
					url: '/pages/home/appList/onSiteRepair/submitOrder?type=wx&orderParams=' + JSON.stringify(
						orderParams)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.orderCardCss {
		padding: 12px 15px;

		.shopItemCss {
			height: 108px;
			margin: 15px 0 0 0;
		}
	}
</style>