|
@@ -177,13 +177,13 @@
|
|
|
:content="getAllDeviceNamesForDisplay"
|
|
:content="getAllDeviceNamesForDisplay"
|
|
|
placement="top"
|
|
placement="top"
|
|
|
>
|
|
>
|
|
|
- <span style="margin-left: 10px;">
|
|
|
|
|
- {{ formatDevicesForDisplay }}
|
|
|
|
|
- </span>
|
|
|
|
|
|
|
+ <span class="device-display-container">
|
|
|
|
|
+ {{ formatDevicesForDisplay }}
|
|
|
|
|
+ </span>
|
|
|
</el-tooltip>
|
|
</el-tooltip>
|
|
|
- <span v-else style="margin-left: 10px; color: #909399;">
|
|
|
|
|
- 未选择设备
|
|
|
|
|
- </span>
|
|
|
|
|
|
|
+ <span v-else class="no-device">
|
|
|
|
|
+ 未选择设备
|
|
|
|
|
+ </span>
|
|
|
</template>
|
|
</template>
|
|
|
|
|
|
|
|
<!-- 只读模式:只显示设备信息 -->
|
|
<!-- 只读模式:只显示设备信息 -->
|
|
@@ -193,9 +193,9 @@
|
|
|
:content="getAllDeviceNamesForDisplay"
|
|
:content="getAllDeviceNamesForDisplay"
|
|
|
placement="top"
|
|
placement="top"
|
|
|
>
|
|
>
|
|
|
- <span class="device-display-readonly">
|
|
|
|
|
- {{ formatDevicesForDisplay }}
|
|
|
|
|
- </span>
|
|
|
|
|
|
|
+ <span class="device-display-container">
|
|
|
|
|
+ {{ formatDevicesForDisplay }}
|
|
|
|
|
+ </span>
|
|
|
</el-tooltip>
|
|
</el-tooltip>
|
|
|
<span v-else class="no-device">-</span>
|
|
<span v-else class="no-device">-</span>
|
|
|
</template>
|
|
</template>
|
|
@@ -342,25 +342,27 @@
|
|
|
/>
|
|
/>
|
|
|
|
|
|
|
|
<!-- 已上传附件列表显示 -->
|
|
<!-- 已上传附件列表显示 -->
|
|
|
- <div v-if="formData.attachments && formData.attachments.length > 0" class="attachment-list">
|
|
|
|
|
- <div
|
|
|
|
|
- v-for="(attachment, index) in formData.attachments"
|
|
|
|
|
- :key="attachment.id || index"
|
|
|
|
|
- class="attachment-item"
|
|
|
|
|
- >
|
|
|
|
|
- <!-- 为附件名称添加点击事件,传递整个附件对象 -->
|
|
|
|
|
- <a class="attachment-name" @click="inContent(attachment)" style="cursor: pointer; color: #409eff; text-decoration: underline;">
|
|
|
|
|
- {{ attachment.filename }}
|
|
|
|
|
- </a>
|
|
|
|
|
- <el-button
|
|
|
|
|
- v-if="!isReadonlyMode"
|
|
|
|
|
- type="danger"
|
|
|
|
|
- link
|
|
|
|
|
- size="small"
|
|
|
|
|
- @click="removeAttachment(index)"
|
|
|
|
|
|
|
+ <div v-if="formData.attachments && formData.attachments.length > 0" class="attachment-container">
|
|
|
|
|
+ <div class="attachment-list">
|
|
|
|
|
+ <div
|
|
|
|
|
+ v-for="(attachment, index) in formData.attachments"
|
|
|
|
|
+ :key="attachment.id || index"
|
|
|
|
|
+ class="attachment-item"
|
|
|
>
|
|
>
|
|
|
- 删除
|
|
|
|
|
- </el-button>
|
|
|
|
|
|
|
+ <!-- 为附件名称添加点击事件,传递整个附件对象 -->
|
|
|
|
|
+ <a class="attachment-name" @click="inContent(attachment)">
|
|
|
|
|
+ {{ attachment.filename }}
|
|
|
|
|
+ </a>
|
|
|
|
|
+ <el-button
|
|
|
|
|
+ v-if="!isReadonlyMode"
|
|
|
|
|
+ type="danger"
|
|
|
|
|
+ link
|
|
|
|
|
+ size="small"
|
|
|
|
|
+ @click="removeAttachment(index)"
|
|
|
|
|
+ >
|
|
|
|
|
+ 删除
|
|
|
|
|
+ </el-button>
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
@@ -733,9 +735,9 @@ const formatDevicesForDisplay = computed(() => {
|
|
|
if (deviceNames.length === 0) return '无设备'
|
|
if (deviceNames.length === 0) return '无设备'
|
|
|
|
|
|
|
|
// 如果设备数量超过2个,显示前两个加省略号
|
|
// 如果设备数量超过2个,显示前两个加省略号
|
|
|
- if (deviceNames.length > 2) {
|
|
|
|
|
|
|
+ /* if (deviceNames.length > 2) {
|
|
|
return `${deviceNames[0]}, ${deviceNames[1]}...`
|
|
return `${deviceNames[0]}, ${deviceNames[1]}...`
|
|
|
- }
|
|
|
|
|
|
|
+ } */
|
|
|
|
|
|
|
|
return deviceNames.join(', ')
|
|
return deviceNames.join(', ')
|
|
|
})
|
|
})
|
|
@@ -1442,11 +1444,13 @@ const handleApprove = async (action: 'pass' | 'reject') => {
|
|
|
|
|
|
|
|
/* 附件列表样式 */
|
|
/* 附件列表样式 */
|
|
|
.attachment-list {
|
|
.attachment-list {
|
|
|
- margin-top: 10px;
|
|
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ margin-top: 5px;
|
|
|
border: 1px solid #e0e0e0;
|
|
border: 1px solid #e0e0e0;
|
|
|
border-radius: 4px;
|
|
border-radius: 4px;
|
|
|
padding: 10px;
|
|
padding: 10px;
|
|
|
background-color: #fafafa;
|
|
background-color: #fafafa;
|
|
|
|
|
+ box-sizing: border-box;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.attachment-item {
|
|
.attachment-item {
|
|
@@ -1464,13 +1468,14 @@ const handleApprove = async (action: 'pass' | 'reject') => {
|
|
|
.attachment-name {
|
|
.attachment-name {
|
|
|
flex: 1;
|
|
flex: 1;
|
|
|
color: #606266;
|
|
color: #606266;
|
|
|
- font-size: 14px;
|
|
|
|
|
|
|
+ font-size: 11px;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.no-attachment {
|
|
.no-attachment {
|
|
|
color: #909399;
|
|
color: #909399;
|
|
|
font-style: italic;
|
|
font-style: italic;
|
|
|
- margin-top: 10px;
|
|
|
|
|
|
|
+ margin-top: 5px;
|
|
|
|
|
+ padding: 10px;
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
/* 附件名称链接样式 */
|
|
/* 附件名称链接样式 */
|
|
@@ -1487,7 +1492,7 @@ const handleApprove = async (action: 'pass' | 'reject') => {
|
|
|
/* 只读模式下的设备显示样式 */
|
|
/* 只读模式下的设备显示样式 */
|
|
|
.device-display-readonly {
|
|
.device-display-readonly {
|
|
|
color: #606266;
|
|
color: #606266;
|
|
|
- font-size: 14px;
|
|
|
|
|
|
|
+ font-size: 11px;
|
|
|
line-height: 1.5;
|
|
line-height: 1.5;
|
|
|
background-color: #f5f7fa;
|
|
background-color: #f5f7fa;
|
|
|
padding: 8px 12px;
|
|
padding: 8px 12px;
|
|
@@ -1498,6 +1503,7 @@ const handleApprove = async (action: 'pass' | 'reject') => {
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
.no-device {
|
|
.no-device {
|
|
|
|
|
+ margin-left: 10px;
|
|
|
color: #909399;
|
|
color: #909399;
|
|
|
font-style: italic;
|
|
font-style: italic;
|
|
|
}
|
|
}
|
|
@@ -1537,4 +1543,36 @@ const handleApprove = async (action: 'pass' | 'reject') => {
|
|
|
:deep(.el-transfer-panel__list) {
|
|
:deep(.el-transfer-panel__list) {
|
|
|
width: 100% !important;
|
|
width: 100% !important;
|
|
|
}
|
|
}
|
|
|
|
|
+
|
|
|
|
|
+.device-display-container {
|
|
|
|
|
+ /* 与其他文本域保持相同的宽度和样式 */
|
|
|
|
|
+ display: inline-block;
|
|
|
|
|
+ width: 100%; /* 减去按钮宽度 */
|
|
|
|
|
+ min-height: 32px;
|
|
|
|
|
+ line-height: 32px;
|
|
|
|
|
+ padding: 0 12px;
|
|
|
|
|
+ margin-left: 0px;
|
|
|
|
|
+ border-radius: 4px;
|
|
|
|
|
+ border: 1px solid #e4e7ed;
|
|
|
|
|
+ background-color: #fff;
|
|
|
|
|
+ font-size: 11px;
|
|
|
|
|
+ /* 文本溢出处理 */
|
|
|
|
|
+ white-space: nowrap;
|
|
|
|
|
+ overflow: hidden;
|
|
|
|
|
+ text-overflow: ellipsis;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+/* 只读模式下的设备显示样式 */
|
|
|
|
|
+:deep(.is-disabled) .device-display-container {
|
|
|
|
|
+ background-color: #f5f7fa;
|
|
|
|
|
+ color: #606266;
|
|
|
|
|
+ cursor: not-allowed;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+/* 附件容器样式调整 */
|
|
|
|
|
+.attachment-container {
|
|
|
|
|
+ /* 与其他文本域保持相同的宽度和边距 */
|
|
|
|
|
+ width: 100%;
|
|
|
|
|
+ margin-top: 10px;
|
|
|
|
|
+}
|
|
|
</style>
|
|
</style>
|