|
|
@@ -0,0 +1,303 @@
|
|
|
+<template>
|
|
|
+ <view class="detail-page">
|
|
|
+ <scroll-view class="detail-content" :scroll-y="true">
|
|
|
+ <!-- 工单信息 -->
|
|
|
+ <view class="info-section">
|
|
|
+ <view class="section-title">
|
|
|
+ <text class="section-title-text">工单信息</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-card">
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">工单编号</text>
|
|
|
+ <text class="info-value">{{ detailData.contractorName }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">工单类型</text>
|
|
|
+ <text class="info-value">{{ detailData.creditCode }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">风机编号</text>
|
|
|
+ <text class="info-value">{{ detailData.legalRepresentative }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">场站</text>
|
|
|
+ <text class="info-value">{{ detailData.contactPhone }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">机型</text>
|
|
|
+ <text class="info-value">{{ detailData.companyAddress }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">创建时间</text>
|
|
|
+ <text class="info-value">{{ detailData.companyAddress }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 工单流转 -->
|
|
|
+ <view class="info-section">
|
|
|
+ <view class="section-title">
|
|
|
+ <text class="section-title-text">工单流转</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-card">
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">资质等级</text>
|
|
|
+ <text class="info-value highlight">{{ detailData.qualificationLevel }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">资质证书号</text>
|
|
|
+ <text class="info-value">{{ detailData.qualificationCertNo }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item full-width">
|
|
|
+ <text class="info-label">经营范围</text>
|
|
|
+ <text class="info-value">{{ detailData.businessScope }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 银行信息 -->
|
|
|
+ <view class="info-section">
|
|
|
+ <view class="section-title">
|
|
|
+ <text class="section-title-text">银行信息</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-card">
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">开户银行</text>
|
|
|
+ <text class="info-value">{{ detailData.bankName }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">银行账号</text>
|
|
|
+ <text class="info-value">{{ detailData.bankAccount }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
+ <!-- 其他信息 -->
|
|
|
+ <view class="info-section">
|
|
|
+ <view class="section-title">
|
|
|
+ <text class="section-title-text">其他信息</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-card">
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">创建时间</text>
|
|
|
+ <text class="info-value">{{ detailData.createTime }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item">
|
|
|
+ <text class="info-label">创建人</text>
|
|
|
+ <text class="info-value">{{ detailData.createBy }}</text>
|
|
|
+ </view>
|
|
|
+ <view class="info-item full-width">
|
|
|
+ <text class="info-label">备注</text>
|
|
|
+ <text class="info-value">{{ detailData.remark }}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </scroll-view>
|
|
|
+
|
|
|
+ <!-- 加载中状态 -->
|
|
|
+ <view v-if="loading" class="loading-mask">
|
|
|
+ <text class="loading-text">加载中...</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup lang="uts">
|
|
|
+ import { ref } from 'vue'
|
|
|
+ import type { orderInfo } from '../../../types/order'
|
|
|
+ import { getOrderInfoById } from '../../../api/order/detail'
|
|
|
+
|
|
|
+ // 详情数据
|
|
|
+ const detailData = ref<orderInfo>({
|
|
|
+ orderType: '',
|
|
|
+ id: '',
|
|
|
+ teamLeaderName: null,
|
|
|
+ acceptUserName: null,
|
|
|
+ acceptTime: null,
|
|
|
+ assignTime: null,
|
|
|
+ assignUserName: null,
|
|
|
+ status: 0,
|
|
|
+ workOrderProjectNo: null,
|
|
|
+ workOrderStatus: null,
|
|
|
+ gxtCenterId: 0,
|
|
|
+ gxtCenter: null,
|
|
|
+ pcsStationId: 0,
|
|
|
+ pcsStationName: null,
|
|
|
+ pcsDeviceId: 0,
|
|
|
+ pcsDeviceName: null,
|
|
|
+ brand: null,
|
|
|
+ model: null,
|
|
|
+ createTime: null,
|
|
|
+ })
|
|
|
+
|
|
|
+ const loading = ref<boolean>(false)
|
|
|
+
|
|
|
+ // 加载详情数据
|
|
|
+ const loadDetail = async (id: string): Promise<void> => {
|
|
|
+ try {
|
|
|
+ loading.value = true
|
|
|
+
|
|
|
+ const result = await getOrderInfoById(id)
|
|
|
+
|
|
|
+ // 提取响应数据
|
|
|
+ const resultObj = result as UTSJSONObject
|
|
|
+ const success = resultObj['success'] as boolean
|
|
|
+ const data = resultObj['data'] as UTSJSONObject | null
|
|
|
+
|
|
|
+ if (success && data != null) {
|
|
|
+ // 转换数据
|
|
|
+ const orderDtail: orderInfo = {
|
|
|
+ orderType: data['orderType'] as Number,
|
|
|
+ id: data['id'] as Number,
|
|
|
+ teamLeaderName: data['teamLeaderName'] as string | null,
|
|
|
+ acceptUserName: data['acceptUserName'] as string | null,
|
|
|
+ acceptTime: data['acceptTime'] as string | null,
|
|
|
+ assignTime: data['assignTime'] as string | null,
|
|
|
+ assignUserName: data['assignUserName'] as string | null,
|
|
|
+ status: (data['status']==null)?0:data['status'] as Number,
|
|
|
+ workOrderProjectNo: data['workOrderProjectNo'] as string | null,
|
|
|
+ workOrderStatus: data['workOrderStatus'] as string | null,
|
|
|
+ gxtCenterId: data['gxtCenterId'] as Number | 0,
|
|
|
+ gxtCenter: data['gxtCenter'] as string | null,
|
|
|
+ pcsStationId: data['pcsStationId'] as Number | 0,
|
|
|
+ pcsStationName: data['pcsStationName'] as string | null,
|
|
|
+ pcsDeviceId: data['pcsDeviceId'] as Number | 0,
|
|
|
+ pcsDeviceName: data['pcsDeviceName'] as string | null,
|
|
|
+ brand: data['brand'] as string | null,
|
|
|
+ model: data['model'] as string | null,
|
|
|
+ createTime: data['createTime'] as string | null
|
|
|
+ }
|
|
|
+ detailData.value = orderDtail
|
|
|
+ } else {
|
|
|
+ const msg = resultObj['msg'] as string | null
|
|
|
+ uni.showToast({
|
|
|
+ title: msg ?? '加载失败',
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ } catch (e: any) {
|
|
|
+ uni.showToast({
|
|
|
+ title: e.message ?? '加载失败',
|
|
|
+ icon: 'none'
|
|
|
+ })
|
|
|
+ } finally {
|
|
|
+ loading.value = false
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ // 页面加载
|
|
|
+ onLoad((options: any) => {
|
|
|
+ const params = options as UTSJSONObject
|
|
|
+ const id = params['id'] as string | null
|
|
|
+ if (id != null) {
|
|
|
+ loadDetail(id)
|
|
|
+ }
|
|
|
+ })
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ .detail-page {
|
|
|
+ flex: 1;
|
|
|
+ background-color: #e8f0f9;
|
|
|
+ }
|
|
|
+
|
|
|
+ .detail-content {
|
|
|
+ flex: 1;
|
|
|
+ padding: 20rpx 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-section {
|
|
|
+ margin: 0 30rpx 24rpx;
|
|
|
+
|
|
|
+ .section-title {
|
|
|
+ position: relative;
|
|
|
+ padding-left: 20rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+
|
|
|
+ &::before {
|
|
|
+ // content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ top: 50%;
|
|
|
+ transform: translateY(-50%);
|
|
|
+ width: 8rpx;
|
|
|
+ height: 32rpx;
|
|
|
+ background-color: #007aff;
|
|
|
+ border-radius: 4rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ &-text {
|
|
|
+ font-size: 32rpx;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-card {
|
|
|
+ background-color: #ffffff;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ padding: 30rpx;
|
|
|
+
|
|
|
+ .info-item {
|
|
|
+ flex-direction: row;
|
|
|
+ padding: 20rpx 0;
|
|
|
+ border-bottom: 1rpx solid #f0f0f0;
|
|
|
+
|
|
|
+ &:last-child {
|
|
|
+ border-bottom: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ &.full-width {
|
|
|
+ flex-direction: column;
|
|
|
+
|
|
|
+ .info-label {
|
|
|
+ margin-bottom: 12rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-value {
|
|
|
+ line-height: 44rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-label {
|
|
|
+ width: 240rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #666666;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-value {
|
|
|
+ flex: 1;
|
|
|
+ font-size: 28rpx;
|
|
|
+ color: #333333;
|
|
|
+ text-align: right;
|
|
|
+
|
|
|
+ &.highlight {
|
|
|
+ color: #007aff;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .loading-mask {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ background-color: rgba(0, 0, 0, 0.3);
|
|
|
+
|
|
|
+ .loading-text {
|
|
|
+ padding: 30rpx 60rpx;
|
|
|
+ background-color: rgba(0, 0, 0, 0.7);
|
|
|
+ color: #ffffff;
|
|
|
+ font-size: 28rpx;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
|
|
+
|
HD_wangm