<template>
|
<view class="transport-edit-container">
|
<!-- 表单内容 -->
|
<scroll-view scroll-y class="form-scroll" :show-scrollbar="false">
|
<view class="form-content">
|
<!-- 案例信息卡片 -->
|
<view class="form-section" v-if="transportData.caseNo">
|
<view class="section-header">
|
<view class="section-icon">📋</view>
|
<text class="section-title">关联案例信息</text>
|
</view>
|
|
<view class="case-info">
|
<view class="info-row">
|
<text class="info-label">案例编号:</text>
|
<text class="info-value">{{ transportData.caseNo }}</text>
|
</view>
|
<view class="info-row">
|
<text class="info-label">患者姓名:</text>
|
<text class="info-value">{{ transportData.patName }}</text>
|
</view>
|
<view class="info-row">
|
<text class="info-label">性别/年龄:</text>
|
<text class="info-value"
|
>{{ getGenderText(transportData.sex) }} /
|
{{ transportData.age }}岁</text
|
>
|
</view>
|
<view class="info-row">
|
<text class="info-label">疾病诊断:</text>
|
<text class="info-value">{{ transportData.diagnosisname }}</text>
|
</view>
|
<view class="info-row">
|
<text class="info-label">治疗医院:</text>
|
<text class="info-value">{{
|
transportData.treatmentHospitalName
|
}}</text>
|
</view>
|
</view>
|
</view>
|
|
<!-- 基础信息卡片 -->
|
<view class="form-section">
|
<view class="section-header">
|
<view class="section-icon">📄</view>
|
<text class="section-title">转运单信息</text>
|
<!-- 状态标签 -->
|
<view
|
class="status-tag"
|
:class="getTransportStatusClass(transportData.transitStatus)"
|
>
|
{{ getTransportStatusText(transportData.transitStatus) }}
|
</view>
|
</view>
|
|
<view class="form-grid">
|
<view class="form-item">
|
<text class="item-label">转运单号</text>
|
<u-input
|
v-model="transportData.reportId"
|
placeholder="自动生成"
|
disabled
|
:disabledColor="disabledColor"
|
border="none"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label required">出发地点</text>
|
<u-input
|
v-model="transportData.transportStartPlace"
|
placeholder="请输入出发地点"
|
border="none"
|
:readonly="!isEdit"
|
:customStyle="inputStyle(!transportData.transportStartPlace)"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label required">出发时间</text>
|
<u-input
|
v-model="transportData.transportStartTime"
|
placeholder="请选择出发时间"
|
readonly
|
border="none"
|
:disabled="!isEdit"
|
@click="isEdit && (showTimePicker = true)"
|
:customStyle="inputStyle(!transportData.transportStartTime)"
|
>
|
<template #suffix v-if="isEdit">
|
<u-icon name="arrow-down" color="#86868b"></u-icon>
|
</template>
|
</u-input>
|
</view>
|
|
<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"
|
>
|
<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>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label required">负责协调员</text>
|
<u-input
|
v-model="transportData.contactPerson"
|
placeholder="请输入协调员姓名"
|
border="none"
|
:readonly="!isEdit"
|
:customStyle="inputStyle(!transportData.contactPerson)"
|
/>
|
</view>
|
|
<view class="form-item" v-if="transportData.createTime">
|
<text class="item-label">创建时间</text>
|
<u-input
|
v-model="transportData.createTime"
|
placeholder="自动生成"
|
disabled
|
:disabledColor="disabledColor"
|
border="none"
|
/>
|
</view>
|
|
<view class="form-item" v-if="transportData.createBy">
|
<text class="item-label">创建人</text>
|
<u-input
|
v-model="transportData.createBy"
|
placeholder="自动获取"
|
disabled
|
:disabledColor="disabledColor"
|
border="none"
|
/>
|
</view>
|
</view>
|
</view>
|
|
<!-- 医护人员信息 -->
|
<view class="form-section">
|
<view class="section-header">
|
<view class="section-icon">👥</view>
|
<text class="section-title">医护人员信息</text>
|
</view>
|
|
<view class="form-grid">
|
<view class="form-item">
|
<text class="item-label">急诊科医生</text>
|
<u-input
|
v-model="transportData.doctor"
|
placeholder="请输入急诊科医生"
|
border="none"
|
:readonly="!isEdit"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label">医生电话</text>
|
<u-input
|
v-model="transportData.doctorPhone"
|
placeholder="请输入医生手机号"
|
type="number"
|
border="none"
|
:readonly="!isEdit"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label">护士</text>
|
<u-input
|
v-model="transportData.nurse"
|
placeholder="请输入护士姓名"
|
border="none"
|
:readonly="!isEdit"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label">护士电话</text>
|
<u-input
|
v-model="transportData.nursePhone"
|
placeholder="请输入护士手机号"
|
type="number"
|
border="none"
|
:readonly="!isEdit"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label">驾驶员</text>
|
<u-input
|
v-model="transportData.driver"
|
placeholder="请输入驾驶员姓名"
|
border="none"
|
:readonly="!isEdit"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label">驾驶员电话</text>
|
<u-input
|
v-model="transportData.driverPhone"
|
placeholder="请输入驾驶员手机号"
|
type="number"
|
border="none"
|
:readonly="!isEdit"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label">ICU评估医生</text>
|
<u-input
|
v-model="transportData.icuDoctor"
|
placeholder="请输入ICU评估医生"
|
border="none"
|
:readonly="!isEdit"
|
/>
|
</view>
|
|
<view class="form-item">
|
<text class="item-label">ICU医生电话</text>
|
<u-input
|
v-model="transportData.icuDoctorPhone"
|
placeholder="请输入ICU医生手机号"
|
type="number"
|
border="none"
|
:readonly="!isEdit"
|
/>
|
</view>
|
</view>
|
</view>
|
|
<!-- 附件信息 -->
|
<view
|
class="form-section"
|
v-if="
|
transportData.annexfilesList &&
|
transportData.annexfilesList.length > 0
|
"
|
>
|
<view class="section-header">
|
<view class="section-icon">📎</view>
|
<text class="section-title"
|
>附件信息 ({{ transportData.annexfilesList.length }})</text
|
>
|
</view>
|
|
<view class="attachment-list">
|
<view
|
v-for="(file, index) in transportData.annexfilesList"
|
:key="index"
|
class="attachment-item"
|
@click="previewFile(file)"
|
>
|
<view class="file-info">
|
<u-icon
|
name="file-text"
|
color="#409EFF"
|
size="20"
|
class="file-icon"
|
></u-icon>
|
<view class="file-details">
|
<text class="file-name">{{ file.fileName }}</text>
|
<text class="file-time">{{
|
formatTime(file.createTime)
|
}}</text>
|
</view>
|
</view>
|
<u-icon name="arrow-right" color="#999" size="16"></u-icon>
|
</view>
|
</view>
|
</view>
|
|
<!-- 备注信息 -->
|
<view class="form-section">
|
<view class="section-header">
|
<view class="section-icon">📝</view>
|
<text class="section-title">备注信息</text>
|
</view>
|
|
<view class="form-grid">
|
<view class="form-item full-width">
|
<u-textarea
|
v-model="transportData.remark"
|
placeholder="请输入备注信息"
|
border="none"
|
:readonly="!isEdit"
|
:count="isEdit"
|
maxlength="500"
|
height="150"
|
/>
|
</view>
|
</view>
|
</view>
|
|
<!-- 操作按钮 -->
|
<view class="action-buttons">
|
<!-- 查看模式 -->
|
<template v-if="!isEdit">
|
<u-button class="btn secondary" @click="goBack">返回</u-button>
|
<u-button v-if="canEdit" class="btn primary" @click="handleEdit">
|
编辑
|
</u-button>
|
<u-button
|
v-if="canStartTransport"
|
class="btn warning"
|
@click="handleStartTransport"
|
>
|
开始转运
|
</u-button>
|
<u-button
|
v-if="canCompleteTransport"
|
class="btn success"
|
@click="handleCompleteTransport"
|
>
|
完成转运
|
</u-button>
|
<u-button v-if="canDelete" class="btn error" @click="handleDelete">
|
删除
|
</u-button>
|
</template>
|
|
<!-- 编辑模式 -->
|
<template v-else>
|
<u-button class="btn secondary" @click="cancelEdit">取消</u-button>
|
<u-button
|
class="btn success"
|
@click="handleSave"
|
:disabled="!isFormValid"
|
:loading="saving"
|
>
|
保存
|
</u-button>
|
</template>
|
</view>
|
</view>
|
</scroll-view>
|
|
<!-- 时间选择器 -->
|
<u-datetime-picker
|
:show="showTimePicker"
|
v-model="departureTimeValue"
|
mode="datetime"
|
@confirm="onTimeConfirm"
|
@cancel="showTimePicker = false"
|
title="选择出发时间"
|
></u-datetime-picker>
|
|
<!-- 加载状态 -->
|
<u-loading-icon :show="loading" :text="loadingText"></u-loading-icon>
|
</view>
|
</template>
|
|
<script setup>
|
import { ref, computed, onMounted } from "vue";
|
import { onLoad } from "@dcloudio/uni-app";
|
|
// 字典数据
|
const dict = ref({});
|
|
// 数据
|
const transportData = ref({});
|
const loading = ref(false);
|
const saving = ref(false);
|
const isEdit = ref(false);
|
const transportId = ref(null);
|
const showTimePicker = ref(false);
|
const departureTimeValue = ref(0);
|
const statusSelectVisible = ref(false);
|
|
// 字典选项
|
const statusOptions = ref([
|
{ label: "待转运", value: 1 },
|
{ label: "转运中", value: 2 },
|
{ label: "转运完成", value: 3 },
|
{ label: "转运取消", value: 4 },
|
{ label: "暂存", value: 5 },
|
]);
|
|
// 样式
|
const disabledColor = ref("#f5f5f7");
|
|
// 计算属性
|
const loadingText = computed(() => {
|
return loading.value ? "加载中..." : saving.value ? "保存中..." : "";
|
});
|
|
const isFormValid = computed(() => {
|
return (
|
transportData.value.transportStartPlace &&
|
transportData.value.transportStartTime &&
|
transportData.value.contactPerson
|
);
|
});
|
|
// 权限判断
|
const canEdit = computed(() => {
|
if (loading.value) return false;
|
return (
|
transportData.value.transitStatus === 1 || // 待转运
|
transportData.value.transitStatus === 5
|
); // 暂存
|
});
|
|
const canStartTransport = computed(() => {
|
if (loading.value) return false;
|
return transportData.value.transitStatus === 1; // 待转运
|
});
|
|
const canCompleteTransport = computed(() => {
|
if (loading.value) return false;
|
return transportData.value.transitStatus === 2; // 转运中
|
});
|
|
const canDelete = computed(() => {
|
if (loading.value) return false;
|
return true; // 根据实际权限控制
|
});
|
|
// 计算索引
|
const statusIndex = computed(() => {
|
if (!transportData.value.transitStatus) return 0;
|
return statusOptions.value.findIndex(
|
(item) => item.value === transportData.value.transitStatus,
|
);
|
});
|
|
onLoad(async (options) => {
|
if (options.id) {
|
transportId.value = options.id;
|
await loadTransportData(options.id);
|
} else if (options.caseId) {
|
// 新增模式
|
isEdit.value = true;
|
await initNewTransport(options.caseId, options.caseNo);
|
}
|
});
|
|
// 加载转运单数据
|
const loadTransportData = async (id) => {
|
loading.value = true;
|
try {
|
const res = await uni.$uapi.post(`/project/transport/list`, { id: id });
|
|
if (res) {
|
transportData.value = res[0];
|
} else {
|
throw new Error(res.msg || "数据加载失败");
|
}
|
} catch (error) {
|
console.error("加载转运单失败:", error);
|
uni.showToast({
|
title: "数据加载失败，请重试",
|
icon: "none",
|
});
|
} finally {
|
loading.value = false;
|
}
|
};
|
|
// 初始化新的转运单
|
const initNewTransport = async (caseId, caseNo) => {
|
try {
|
// 如果有案例ID，加载案例信息
|
if (caseId) {
|
const res = await uni.$uapi.post(
|
`/project/transport/list`,
|
{ id: caseId },
|
);
|
if (res) {
|
const caseData = res[0];
|
transportData.value = {
|
...transportData.value,
|
caseNo: caseNo || caseData.caseNo,
|
patName: caseData.patName,
|
sex: caseData.sex,
|
age: caseData.age,
|
diagnosisname: caseData.diagnosisname,
|
treatmentHospitalName: caseData.treatmenthospitalname,
|
transitStatus: 1, // 待转运
|
createTime: new Date()
|
.toISOString()
|
.replace("T", " ")
|
.substring(0, 19),
|
};
|
}
|
} else {
|
transportData.value = {
|
transitStatus: 1,
|
createTime: new Date().toISOString().replace("T", " ").substring(0, 19),
|
};
|
}
|
} catch (error) {
|
console.error("初始化转运单失败:", error);
|
}
|
};
|
|
// 获取转运状态文本
|
const getTransportStatusText = (status) => {
|
const map = {
|
1: "待转运",
|
2: "转运中",
|
3: "转运完成",
|
4: "转运取消",
|
5: "暂存",
|
};
|
return map[status] || "未知";
|
};
|
|
// 获取转运状态样式
|
const getTransportStatusClass = (status) => {
|
const map = {
|
1: "pending",
|
2: "transporting",
|
3: "completed",
|
4: "cancelled",
|
5: "draft",
|
};
|
return map[status] || "draft";
|
};
|
|
// 获取性别文本
|
const getGenderText = (gender) => {
|
if (!gender) return "未知";
|
return gender === "1" ? "男" : "女";
|
};
|
|
// 格式化时间
|
const formatTime = (timeStr) => {
|
if (!timeStr) return "";
|
return timeStr.replace("T", " ").substring(0, 16);
|
};
|
|
// 输入框样式
|
const inputStyle = (isError) => {
|
return isError
|
? "border: 2rpx solid #f56c6c !important; border-radius: 12rpx !important;"
|
: "border: 2rpx solid #e5e5e7 !important; border-radius: 12rpx !important;";
|
};
|
|
// 时间确认
|
const onTimeConfirm = (e) => {
|
const date = new Date(e.value);
|
transportData.value.transportStartTime = `${date.getFullYear()}-${(
|
date.getMonth() + 1
|
)
|
.toString()
|
.padStart(2, "0")}-${date.getDate().toString().padStart(2, "0")} ${date
|
.getHours()
|
.toString()
|
.padStart(2, "0")}:${date.getMinutes().toString().padStart(2, "0")}`;
|
showTimePicker.value = false;
|
};
|
|
// 状态确认
|
const onStatusConfirm = (e) => {
|
if (e[0]) {
|
transportData.value.transitStatus = e[0].value;
|
}
|
statusSelectVisible.value = false;
|
};
|
|
// 预览文件
|
const previewFile = (file) => {
|
const fullUrl = file.path || file.fileUrl;
|
if (!fullUrl) {
|
uni.showToast({ title: "文件路径不存在", icon: "none" });
|
return;
|
}
|
|
if (file.fileName && file.fileName.match(/\.(jpg|jpeg|png|gif|bmp|webp)$/i)) {
|
uni.previewImage({
|
urls: [fullUrl],
|
current: 0,
|
});
|
} else if (file.fileName && file.fileName.match(/\.pdf$/i)) {
|
uni.downloadFile({
|
url: fullUrl,
|
success: (res) => {
|
uni.openDocument({
|
filePath: res.tempFilePath,
|
fileType: "pdf",
|
showMenu: true,
|
});
|
},
|
fail: (err) => {
|
console.error("打开文档失败:", err);
|
uni.showToast({ title: "打开文件失败", icon: "none" });
|
},
|
});
|
} else {
|
uni.showToast({ title: "暂不支持此文件类型预览", icon: "none" });
|
}
|
};
|
|
// 返回
|
const goBack = () => {
|
uni.navigateBack();
|
};
|
|
// 编辑
|
const handleEdit = () => {
|
isEdit.value = true;
|
};
|
|
// 取消编辑
|
const cancelEdit = () => {
|
if (transportId.value) {
|
// 重新加载数据
|
isEdit.value = false;
|
loadTransportData(transportId.value);
|
} else {
|
// 新增模式，直接返回
|
uni.navigateBack();
|
}
|
};
|
|
// 保存
|
const handleSave = async () => {
|
if (!validateForm()) return;
|
|
saving.value = true;
|
|
try {
|
const submitData = {
|
...transportData.value,
|
};
|
|
let res;
|
if (transportId.value) {
|
// 修改
|
res = await uni.$uapi.post("/project/transport/edit", submitData);
|
} else {
|
// 新增
|
submitData.createBy = "移动端用户";
|
res = await uni.$uapi.post("/project/transport/add", submitData);
|
}
|
|
if (res.code === 200) {
|
uni.showToast({
|
title: transportId.value ? "修改成功" : "新增成功",
|
icon: "success",
|
});
|
|
if (transportId.value) {
|
// 重新加载数据
|
isEdit.value = false;
|
await loadTransportData(transportId.value);
|
} else {
|
// 新增成功后返回列表
|
setTimeout(() => {
|
uni.navigateBack();
|
}, 1500);
|
}
|
} else {
|
throw new Error(res.msg || "操作失败");
|
}
|
} catch (error) {
|
console.error("保存失败:", error);
|
uni.showToast({
|
title: error.message || (transportId.value ? "修改失败" : "新增失败"),
|
icon: "none",
|
});
|
} finally {
|
saving.value = false;
|
}
|
};
|
|
// 表单验证
|
const validateForm = () => {
|
if (!transportData.value.transportStartPlace) {
|
uni.showToast({ title: "请输入出发地点", icon: "none" });
|
return false;
|
}
|
|
if (!transportData.value.transportStartTime) {
|
uni.showToast({ title: "请选择出发时间", icon: "none" });
|
return false;
|
}
|
|
if (!transportData.value.contactPerson) {
|
uni.showToast({ title: "请输入负责协调员", icon: "none" });
|
return false;
|
}
|
|
return true;
|
};
|
|
// 开始转运
|
const handleStartTransport = () => {
|
uni.showModal({
|
title: "开始转运",
|
content: "确定要开始转运吗？",
|
success: async (res) => {
|
if (res.confirm) {
|
await updateTransportStatus(2, "开始转运");
|
}
|
},
|
});
|
};
|
|
// 完成转运
|
const handleCompleteTransport = () => {
|
uni.showModal({
|
title: "完成转运",
|
content: "确定要完成转运吗？",
|
success: async (res) => {
|
if (res.confirm) {
|
await updateTransportStatus(3, "完成转运");
|
}
|
},
|
});
|
};
|
|
// 更新转运状态
|
const updateTransportStatus = async (newStatus, actionName) => {
|
try {
|
const updateData = {
|
id: transportId.value,
|
transitStatus: newStatus,
|
};
|
|
const res = await uni.$uapi.post("/system/transport/edit", updateData);
|
|
if (res.code === 200) {
|
uni.showToast({ title: `${actionName}成功`, icon: "success" });
|
await loadTransportData(transportId.value);
|
} else {
|
throw new Error(res.msg || `${actionName}失败`);
|
}
|
} catch (error) {
|
console.error(`${actionName}失败:`, error);
|
uni.showToast({ title: `${actionName}失败`, icon: "none" });
|
}
|
};
|
|
// 删除转运单
|
const handleDelete = () => {
|
uni.showModal({
|
title: "确认删除",
|
content: `确定要删除转运单 ${transportData.value.reportId} 吗？`,
|
success: async (res) => {
|
if (res.confirm) {
|
try {
|
const result = await uni.$uapi.delete(
|
`/system/transport/${transportId.value}`,
|
);
|
if (result.code === 200) {
|
uni.showToast({ title: "删除成功", icon: "success" });
|
setTimeout(() => {
|
uni.navigateBack();
|
}, 1500);
|
} else {
|
uni.showToast({ title: result.msg || "删除失败", icon: "none" });
|
}
|
} catch (error) {
|
console.error("删除失败:", error);
|
uni.showToast({ title: "删除失败", icon: "none" });
|
}
|
}
|
},
|
});
|
};
|
</script>
|
|
<style lang="scss" scoped>
|
.transport-edit-container {
|
min-height: 100vh;
|
background: linear-gradient(135deg, #f8fdff 0%, #e8f7f6 100%);
|
padding-bottom: 120rpx; /* 为操作栏留出空间 */
|
}
|
|
.form-scroll {
|
height: 100vh;
|
}
|
|
.form-content {
|
padding: 30rpx;
|
}
|
|
.form-section {
|
background: #fff;
|
border-radius: 20rpx;
|
padding: 30rpx;
|
margin-bottom: 30rpx;
|
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
|
|
.section-header {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-bottom: 30rpx;
|
padding-bottom: 20rpx;
|
border-bottom: 2rpx solid #f0f0f0;
|
}
|
|
.section-icon {
|
font-size: 32rpx;
|
margin-right: 16rpx;
|
}
|
|
.section-title {
|
font-size: 32rpx;
|
font-weight: 600;
|
color: #1d1d1f;
|
flex: 1;
|
}
|
|
.status-tag {
|
padding: 6rpx 16rpx;
|
border-radius: 8rpx;
|
font-size: 24rpx;
|
font-weight: 500;
|
|
&.pending {
|
background: rgba(240, 173, 78, 0.1);
|
color: #f0ad4e;
|
}
|
|
&.transporting {
|
background: rgba(0, 122, 255, 0.1);
|
color: #007aff;
|
}
|
|
&.completed {
|
background: rgba(76, 217, 100, 0.1);
|
color: #4cd964;
|
}
|
|
&.cancelled {
|
background: rgba(220, 223, 230, 0.1);
|
color: #dcdfe6;
|
}
|
|
&.draft {
|
background: rgba(144, 147, 153, 0.1);
|
color: #909399;
|
}
|
}
|
}
|
|
.case-info {
|
.info-row {
|
display: flex;
|
margin-bottom: 16rpx;
|
|
&:last-child {
|
margin-bottom: 0;
|
}
|
|
.info-label {
|
font-size: 28rpx;
|
color: #606266;
|
min-width: 140rpx;
|
margin-right: 10rpx;
|
}
|
|
.info-value {
|
font-size: 28rpx;
|
color: #303133;
|
flex: 1;
|
font-weight: 500;
|
}
|
}
|
}
|
|
.form-grid {
|
display: flex;
|
flex-direction: column;
|
gap: 24rpx;
|
}
|
|
.form-item {
|
display: flex;
|
flex-direction: column;
|
|
&.full-width {
|
grid-column: 1 / -1;
|
}
|
|
.item-label {
|
font-size: 28rpx;
|
color: #1d1d1f;
|
font-weight: 500;
|
margin-bottom: 12rpx;
|
|
&.required::after {
|
content: "*";
|
color: #f56c6c;
|
margin-left: 4rpx;
|
}
|
}
|
|
.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;
|
|
text {
|
font-size: 28rpx;
|
color: #303133;
|
}
|
}
|
}
|
|
// 自定义u-input样式
|
:deep(.u-input) {
|
border: 2rpx solid #e5e5e7 !important;
|
border-radius: 12rpx !important;
|
padding: 20rpx 24rpx !important;
|
background: #fff !important;
|
}
|
|
:deep(.u-textarea) {
|
border: 2rpx solid #e5e5e7 !important;
|
border-radius: 12rpx !important;
|
padding: 20rpx 24rpx !important;
|
background: #fff !important;
|
min-height: 150rpx;
|
}
|
|
// 附件列表
|
.attachment-list {
|
.attachment-item {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
padding: 20rpx 0;
|
border-bottom: 1rpx solid #f0f0f0;
|
|
&:last-child {
|
border-bottom: none;
|
}
|
|
&:active {
|
background: #f5f5f5;
|
}
|
|
.file-info {
|
display: flex;
|
align-items: center;
|
flex: 1;
|
|
.file-icon {
|
margin-right: 16rpx;
|
}
|
|
.file-details {
|
display: flex;
|
flex-direction: column;
|
flex: 1;
|
|
.file-name {
|
font-size: 28rpx;
|
color: #303133;
|
margin-bottom: 4rpx;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
max-width: 500rpx;
|
}
|
|
.file-time {
|
font-size: 24rpx;
|
color: #909399;
|
}
|
}
|
}
|
}
|
}
|
|
.action-buttons {
|
display: flex;
|
gap: 20rpx;
|
margin-top: 40rpx;
|
background: #fff;
|
padding: 20rpx 0;
|
position: fixed;
|
bottom: 0;
|
left: 0;
|
right: 0;
|
padding: 20rpx 30rpx;
|
padding-bottom: calc(20rpx + env(safe-area-inset-bottom));
|
box-shadow: 0 -2rpx 20rpx rgba(0, 0, 0, 0.08);
|
z-index: 100;
|
}
|
|
.btn {
|
flex: 1;
|
height: 80rpx;
|
border-radius: 20rpx;
|
font-size: 28rpx;
|
font-weight: 600;
|
border: none;
|
transition: all 0.3s ease;
|
|
&.secondary {
|
background: #f5f5f7;
|
color: #1d1d1f;
|
|
&:active {
|
background: #e5e5e7;
|
}
|
}
|
|
&.primary {
|
background: linear-gradient(90deg, #0071e3 0%, #2997ff 100%);
|
color: #fff;
|
|
&:active {
|
transform: scale(0.98);
|
}
|
}
|
|
&.warning {
|
background: linear-gradient(90deg, #f0ad4e 0%, #f8b62d 100%);
|
color: #fff;
|
|
&:active {
|
transform: scale(0.98);
|
}
|
}
|
|
&.success {
|
background: linear-gradient(90deg, #34c759 0%, #4cd964 100%);
|
color: #fff;
|
|
&:disabled {
|
background: #c0c4cc;
|
opacity: 0.6;
|
}
|
|
&:active:not(:disabled) {
|
transform: scale(0.98);
|
}
|
}
|
|
&.error {
|
background: linear-gradient(90deg, #ff3b30 0%, #ff5a5a 100%);
|
color: #fff;
|
|
&:active {
|
transform: scale(0.98);
|
}
|
}
|
}
|
</style>
|
