From 4ddfa807643c73ff90840b0b65a5118741e12b48 Mon Sep 17 00:00:00 2001
From: WXL <wl_5969728@163.com>
Date: 星期六, 09 五月 2026 18:06:13 +0800
Subject: [PATCH] 移动端维护
---
pages/case/transferinfo.vue | 160 +++++++++++++++++++++++++++++++++++++----------------
1 files changed, 111 insertions(+), 49 deletions(-)
diff --git a/pages/case/transferinfo.vue b/pages/case/transferinfo.vue
index 1ada6e7..54ffe7e 100644
--- a/pages/case/transferinfo.vue
+++ b/pages/case/transferinfo.vue
@@ -95,29 +95,21 @@
<view class="form-item">
<text class="item-label">杞繍鐘舵��</text>
- <u-select
- v-model="statusSelectVisible"
- :list="statusOptions"
- :default-value="[statusIndex]"
- :confirm-text="'纭畾'"
- :cancel-text="'鍙栨秷'"
- @confirm="onStatusConfirm"
- :disabled="!isEdit"
+ <view
+ class="picker-trigger"
+ @click="isEdit && handleStatusClick()"
+ :class="{ disabled: !isEdit }"
>
- <template #default>
- <view class="picker-trigger">
- <text>{{
- getTransportStatusText(transportData.transitStatus)
- }}</text>
- <u-icon
- v-if="isEdit"
- name="arrow-down"
- size="16"
- color="#999"
- ></u-icon>
- </view>
- </template>
- </u-select>
+ <text>{{
+ getTransportStatusText(transportData.transitStatus)
+ }}</text>
+ <u-icon
+ v-if="isEdit"
+ name="arrow-down"
+ size="16"
+ color="#999"
+ ></u-icon>
+ </view>
</view>
<view class="form-item">
@@ -331,14 +323,23 @@
@cancel="showTimePicker = false"
title="閫夋嫨鍑哄彂鏃堕棿"
></u-datetime-picker>
-
+ <!-- 鐘舵�侀�夋嫨鍣� -->
+ <u-picker
+ :show="statusPickerVisible"
+ :columns="[statusLabels]"
+ :defaultIndex="[statusCurrentIndex]"
+ keyName="label"
+ @confirm="onStatusPickerConfirm"
+ @cancel="statusPickerVisible = false"
+ title="璇烽�夋嫨杞繍鐘舵��"
+ ></u-picker>
<!-- 鍔犺浇鐘舵�� -->
<u-loading-icon :show="loading" :text="loadingText"></u-loading-icon>
</view>
</template>
<script setup>
-import { ref, computed, onMounted } from "vue";
+import { ref, computed, onMounted,watch } from "vue";
import attachmentUpload from "@/components/attachment";
import { useUserStore } from "@/stores/user";
@@ -354,13 +355,14 @@
const loading = ref(false);
const saving = ref(false);
const isEdit = ref(false);
+const statusPickerVisible = ref(false);
+const statusCurrentIndex = ref(0);
const transportId = ref(null);
const showTimePicker = ref(false);
const departureTimeValue = ref(0);
const statusSelectVisible = ref(false);
const isReadonly = ref(false);
const attachments = ref([]);
-
// 瀛楀吀閫夐」
const statusOptions = ref([
@@ -411,14 +413,35 @@
return true; // 鏍规嵁瀹為檯鏉冮檺鎺у埗
});
-// 璁＄畻绱㈠紩
-const statusIndex = computed(() => {
- if (!transportData.value.transitStatus) return 0;
- return statusOptions.value.findIndex(
- (item) => item.value === transportData.value.transitStatus,
- );
+// 淇敼鎴栨坊鍔犺绠楀睘鎬�
+const statusLabels = computed(() => {
+ return statusOptions.value.map((item) => item.label);
});
+// 淇敼 statusIndex 璁＄畻灞炴��
+const statusIndex = computed(() => {
+ if (!transportData.value.transitStatus) return 0;
+ const index = statusOptions.value.findIndex(
+ (item) => item.value == transportData.value.transitStatus,
+ );
+ return index >= 0 ? index : 0;
+});
+
+// 娣诲姞鐩戝惉锛屽綋杞繍鐘舵�佸彉鍖栨椂鏇存柊褰撳墠绱㈠紩
+watch(
+ () => transportData.value.transitStatus,
+ (newVal) => {
+ if (newVal !== undefined && newVal !== null) {
+ const index = statusOptions.value.findIndex(
+ (item) => item.value == newVal,
+ );
+ if (index >= 0) {
+ statusCurrentIndex.value = index;
+ }
+ }
+ },
+ { immediate: true },
+);
onLoad(async (options) => {
if (options.id) {
transportId.value = options.id;
@@ -427,6 +450,14 @@
// 鏂板妯″紡
isEdit.value = true;
await initNewTransport(options.caseId, options.caseNo);
+ }
+
+ // 纭繚鐘舵�佺储寮曟纭垵濮嬪寲
+ if (transportData.value.transitStatus !== undefined) {
+ const index = statusOptions.value.findIndex(
+ (item) => item.value == transportData.value.transitStatus,
+ );
+ statusCurrentIndex.value = index >= 0 ? index : 0;
}
});
@@ -438,14 +469,21 @@
if (res.data) {
transportData.value = res.data;
-
- if (res.data.annexfilesList) {
- attachments.value = res.data.annexfilesList;
- attachments.value.forEach(item=>{
- item.url=item.opath,
- item.name=item.fileName
- })
- }
+
+ if (res.data.annexfilesList) {
+ attachments.value = res.data.annexfilesList;
+ attachments.value.forEach((item) => {
+ (item.url = item.opath), (item.name = item.fileName);
+ });
+ }
+
+ // 鏇存柊鐘舵�佺储寮�
+ if (transportData.value.transitStatus !== undefined) {
+ const index = statusOptions.value.findIndex(
+ (item) => item.value == transportData.value.transitStatus,
+ );
+ statusCurrentIndex.value = index >= 0 ? index : 0;
+ }
} else {
throw new Error(res.msg || "鏁版嵁鍔犺浇澶辫触");
}
@@ -561,12 +599,18 @@
showTimePicker.value = false;
};
-// 鐘舵�佺‘璁�
-const onStatusConfirm = (e) => {
- if (e[0]) {
- transportData.value.transitStatus = e[0].value;
+// 鍒犻櫎鍘熸潵鐨� onStatusConfirm 鍑芥暟锛屾坊鍔犳柊鐨勫嚱鏁�
+const handleStatusClick = () => {
+ if (!isEdit.value) return;
+ statusPickerVisible.value = true;
+};
+
+const onStatusPickerConfirm = (e) => {
+ const index = e.indexs[0];
+ if (statusOptions.value[index]) {
+ transportData.value.transitStatus = statusOptions.value[index].value;
}
- statusSelectVisible.value = false;
+ statusPickerVisible.value = false;
};
// 棰勮鏂囦欢
@@ -736,7 +780,7 @@
id: transportId.value,
transitStatus: newStatus,
...transportData.value,
- annexfilesList: attachments.value.map((file) => ({
+ annexfilesList: attachments.value.map((file) => ({
path: file.url,
fileName: file.name,
type: file.type,
@@ -761,13 +805,12 @@
const handleBaseUpload = (file) => {
console.log("鍩虹闄勪欢涓婁紶鎴愬姛:", file);
attachments.value.push(file);
-
};
// 澶勭悊鍏朵粬闄勪欢涓婁紶
const handleFilesUpdate = (files) => {
- console.log(files,'files');
-
+ console.log(files, "files");
+
attachments.value = files.map((file) => ({
...file,
// 纭繚鍙瓨鍌ㄥ崐璺緞
@@ -776,7 +819,6 @@
// : file.url,
}));
console.log(attachments.value);
-
};
// 棰勮鏂囦欢 - 淇敼涓轰娇鐢ㄥ畬鏁碪RL
@@ -831,7 +873,27 @@
.form-content {
padding: 30rpx;
}
+.picker-trigger {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ height: 88rpx;
+ padding: 0 20rpx;
+ background: #f5f5f5;
+ border-radius: 8rpx;
+ border: 1rpx solid #dcdfe6;
+ font-size: 28rpx;
+ color: #303133;
+ &.disabled {
+ background: #f8f9fa;
+ color: #909399;
+ }
+
+ text {
+ font-size: 28rpx;
+ }
+}
.form-section {
background: #fff;
border-radius: 20rpx;
--
Gitblit v1.9.3