feat:文本预览

.env.development

@@ -11,15 +11,15 @@ ENV = 'development'
 # VITE_ADMIN_PROXY_PATH = http://123.157.250.162:8089/api/ # 测试线上
 # VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089/api/ # 测试线上-过期
 # VITE_ADMIN_PROXY_PATH = http://localhost:9999/
-VITE_ADMIN_PROXY_PATH = https://dzc-test-1.fy.takin.cc # 邓-本地
-# VITE_ADMIN_PROXY_PATH = https://stgl.pj.gov.cn/api # 正式环境线上
+# VITE_ADMIN_PROXY_PATH = https://dzc-test-1.fy.takin.cc # 邓-本地
+VITE_ADMIN_PROXY_PATH = https://www.pjzhhq.cn/api # 正式环境线上
 
 # 图片访问基础地址
 # VITE_IMAGE_BASE_PATH = http://123.157.250.162:8089/api/ # 测试线上
 # VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089/api/ # 测试线上-过期
 # VITE_IMAGE_BASE_PATH = http://localhost:9999
-VITE_IMAGE_BASE_PATH = https://dzc-test-1.fy.takin.cc # 邓-本地
-# VITE_IMAGE_BASE_PATH = https://stgl.pj.gov.cn/api/ # 正式环境线上
+# VITE_IMAGE_BASE_PATH = https://dzc-test-1.fy.takin.cc # 邓-本地
+VITE_IMAGE_BASE_PATH = https://www.pjzhhq.cn/api # 正式环境线上
 
 # 代码生成服务地址
 VITE_GEN_PROXY_PATH = http://192.168.110.156:5003

src/components/PreviewText/index.vue

@@ -0,0 +1,67 @@
+<template>
+	<div class="preview-text">
+		<el-button v-if="textContent" :style="textViewStyle" type="text" link @click="textViewVisible = true">
+			<span :style="textViewStyle" class="text-view">{{ textContent }}</span>
+		</el-button>
+		<span v-else>--</span>
+
+		<el-dialog v-model="textViewVisible" :title="title" width="min(720px, 90vw)" append-to-body>
+			<pre class="text-content" v-text="textContent"></pre>
+			<template #footer>
+				<el-button @click="textViewVisible = false">关闭</el-button>
+			</template>
+		</el-dialog>
+	</div>
+</template>
+
+<script lang="ts" setup name="preview-text">
+type Props = {
+	width?: number
+	text?: string
+	title?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+	width: 0,
+	text: "",
+	title: "文本详情",
+})
+
+const textViewVisible = ref(false)
+
+const textContent = computed(() => props.text || "")
+
+const textViewStyle = computed(() => ({
+	width: props.width ? `${props.width}px` : "160px",
+	maxWidth: "100%",
+}))
+</script>
+
+<style lang="scss" scoped>
+.preview-text {
+	max-width: 100%;
+}
+
+.text-view {
+	display: block;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	white-space: nowrap;
+}
+
+.text-content {
+	max-height: 60vh;
+	margin: 0;
+	padding: 16px;
+	overflow: auto;
+	color: var(--el-text-color-primary);
+	font-family: inherit;
+	font-size: 14px;
+	line-height: 1.6;
+	white-space: pre-wrap;
+	overflow-wrap: anywhere;
+	background-color: var(--el-fill-color-light);
+	border: 1px solid var(--el-border-color-lighter);
+	border-radius: 4px;
+}
+</style>

src/components/index.ts

@@ -15,6 +15,7 @@ import TagList from "/@/components/TagList/index.vue"
 import SvgIcon from "/@/components/SvgIcon/index.vue"
 import PreviewImage from "/@/components/PreviewImage/index.vue"
 import PreviewJson from "/@/components/PreviewJson/index.vue"
+import PreviewText from "/@/components/PreviewText/index.vue"
 import PreviewXml from "/@/components/PreviewXml/index.vue"
 import DraggableDepTree from "/@/components/DraggableDepTree/index.vue"
 
@@ -80,6 +81,7 @@ export default {
 		app.component("SvgIcon", SvgIcon)
 		app.component("PreviewImage", PreviewImage)
 		app.component("PreviewJson", PreviewJson)
+		app.component("PreviewText", PreviewText)
 		app.component("PreviewXml", PreviewXml)
 		app.component("DraggableDepTree", DraggableDepTree)
 		app.component("TreeMultipleSelect", TreeMultipleSelect)

src/views/hard/hard-door-flow/index.vue

@@ -43,7 +43,11 @@
 							<dict-tag :options="hard_door_flow" :value="row.flowStatus" />
 						</template>
 					</el-table-column>
-					<el-table-column prop="errorDesc" label="错误描述" width="120" />
+					<el-table-column prop="errorDesc" label="错误描述" width="120">
+						<template #default="{ row }">
+							<preview-text :text="row.errorDesc" :width="96" title="错误描述" />
+						</template>
+					</el-table-column>
 				</el-table-column>
 				<el-table-column label="购买用户">
 					<el-table-column prop="username" label="姓名" width="120" />