Commit d5907155ea5bc7f242fd6a45a635a059cd575945
1 parent
19895dc8
文件资料
Showing
5 changed files
with
412 additions
and
135 deletions
trash-ui/src/components/2cEditor/index.vue
0 → 100644
| 1 | +<template> | ||
| 2 | + <div> | ||
| 3 | + <el-upload | ||
| 4 | + :action="uploadUrl" | ||
| 5 | + :before-upload="handleBeforeUpload" | ||
| 6 | + :on-success="handleUploadSuccess" | ||
| 7 | + :on-error="handleUploadError" | ||
| 8 | + name="file" | ||
| 9 | + :show-file-list="false" | ||
| 10 | + :headers="headers" | ||
| 11 | + style="display: none" | ||
| 12 | + ref="upload" | ||
| 13 | + v-if="this.type == 'url'" | ||
| 14 | + > | ||
| 15 | + </el-upload> | ||
| 16 | + <div class="editor" ref="editor" :style="styles"></div> | ||
| 17 | + </div> | ||
| 18 | +</template> | ||
| 19 | + | ||
| 20 | +<script> | ||
| 21 | +import Quill from "quill"; | ||
| 22 | +import "quill/dist/quill.core.css"; | ||
| 23 | +import "quill/dist/quill.snow.css"; | ||
| 24 | +import "quill/dist/quill.bubble.css"; | ||
| 25 | +import { getToken } from "@/utils/auth"; | ||
| 26 | + | ||
| 27 | +export default { | ||
| 28 | + name: "Editor", | ||
| 29 | + props: { | ||
| 30 | + /* 编辑器的内容 */ | ||
| 31 | + value: { | ||
| 32 | + type: String, | ||
| 33 | + default: "", | ||
| 34 | + }, | ||
| 35 | + /* 高度 */ | ||
| 36 | + height: { | ||
| 37 | + type: Number, | ||
| 38 | + default: null, | ||
| 39 | + }, | ||
| 40 | + /* 最小高度 */ | ||
| 41 | + minHeight: { | ||
| 42 | + type: Number, | ||
| 43 | + default: null, | ||
| 44 | + }, | ||
| 45 | + /* 只读 */ | ||
| 46 | + readOnly: { | ||
| 47 | + type: Boolean, | ||
| 48 | + default: false, | ||
| 49 | + }, | ||
| 50 | + /* 上传文件大小限制(MB) */ | ||
| 51 | + fileSize: { | ||
| 52 | + type: Number, | ||
| 53 | + default: 5, | ||
| 54 | + }, | ||
| 55 | + /* 类型(base64格式、url格式) */ | ||
| 56 | + type: { | ||
| 57 | + type: String, | ||
| 58 | + default: "url", | ||
| 59 | + } | ||
| 60 | + }, | ||
| 61 | + data() { | ||
| 62 | + return { | ||
| 63 | + uploadUrl: process.env.VUE_APP_BASE_API + "/common/upload", // 上传的图片服务器地址 | ||
| 64 | + headers: { | ||
| 65 | + Authorization: "Bearer " + getToken() | ||
| 66 | + }, | ||
| 67 | + Quill: null, | ||
| 68 | + currentValue: "", | ||
| 69 | + options: { | ||
| 70 | + theme: "snow", | ||
| 71 | + bounds: document.body, | ||
| 72 | + debug: "warn", | ||
| 73 | + modules: { | ||
| 74 | + // 工具栏配置 | ||
| 75 | + toolbar: [ | ||
| 76 | + ["bold", "italic", "underline", "strike"], // 加粗 斜体 下划线 删除线 | ||
| 77 | + ["blockquote", "code-block"], // 引用 代码块 | ||
| 78 | + [{list: "ordered"}, {list: "bullet"}], // 有序、无序列表 | ||
| 79 | + [{indent: "-1"}, {indent: "+1"}], // 缩进 | ||
| 80 | + [{size: ["small", false, "large", "huge"]}], // 字体大小 | ||
| 81 | + [{header: [1, 2, 3, 4, 5, 6, false]}], // 标题 | ||
| 82 | + [{color: []}, {background: []}], // 字体颜色、字体背景颜色 | ||
| 83 | + [{align: []}], // 对齐方式 | ||
| 84 | + ["clean"], // 清除文本格式 | ||
| 85 | + ["link", "image"] // 链接、图片、视频 | ||
| 86 | + ], | ||
| 87 | + }, | ||
| 88 | + placeholder: "请输入内容", | ||
| 89 | + readOnly: this.readOnly, | ||
| 90 | + }, | ||
| 91 | + }; | ||
| 92 | + }, | ||
| 93 | + computed: { | ||
| 94 | + styles() { | ||
| 95 | + let style = {}; | ||
| 96 | + if (this.minHeight) { | ||
| 97 | + style.minHeight = `${this.minHeight}px`; | ||
| 98 | + } | ||
| 99 | + if (this.height) { | ||
| 100 | + style.height = `${this.height}px`; | ||
| 101 | + } | ||
| 102 | + return style; | ||
| 103 | + }, | ||
| 104 | + }, | ||
| 105 | + watch: { | ||
| 106 | + value: { | ||
| 107 | + handler(val) { | ||
| 108 | + if (val !== this.currentValue) { | ||
| 109 | + this.currentValue = val === null ? "" : val; | ||
| 110 | + if (this.Quill) { | ||
| 111 | + this.Quill.pasteHTML(this.currentValue); | ||
| 112 | + } | ||
| 113 | + } | ||
| 114 | + }, | ||
| 115 | + immediate: true, | ||
| 116 | + }, | ||
| 117 | + }, | ||
| 118 | + mounted() { | ||
| 119 | + this.init(); | ||
| 120 | + }, | ||
| 121 | + beforeDestroy() { | ||
| 122 | + this.Quill = null; | ||
| 123 | + }, | ||
| 124 | + methods: { | ||
| 125 | + init() { | ||
| 126 | + const editor = this.$refs.editor; | ||
| 127 | + this.Quill = new Quill(editor, this.options); | ||
| 128 | + // 如果设置了上传地址则自定义图片上传事件 | ||
| 129 | + if (this.type == 'url') { | ||
| 130 | + let toolbar = this.Quill.getModule("toolbar"); | ||
| 131 | + toolbar.addHandler("image", (value) => { | ||
| 132 | + if (value) { | ||
| 133 | + this.$refs.upload.$children[0].$refs.input.click(); | ||
| 134 | + } else { | ||
| 135 | + this.quill.format("image", false); | ||
| 136 | + } | ||
| 137 | + }); | ||
| 138 | + } | ||
| 139 | + this.Quill.pasteHTML(this.currentValue); | ||
| 140 | + this.Quill.on("text-change", (delta, oldDelta, source) => { | ||
| 141 | + const html = this.$refs.editor.children[0].innerHTML; | ||
| 142 | + const text = this.Quill.getText(); | ||
| 143 | + const quill = this.Quill; | ||
| 144 | + this.currentValue = html; | ||
| 145 | + this.$emit("input", html); | ||
| 146 | + this.$emit("on-change", {html, text, quill}); | ||
| 147 | + }); | ||
| 148 | + this.Quill.on("text-change", (delta, oldDelta, source) => { | ||
| 149 | + this.$emit("on-text-change", delta, oldDelta, source); | ||
| 150 | + }); | ||
| 151 | + this.Quill.on("selection-change", (range, oldRange, source) => { | ||
| 152 | + this.$emit("on-selection-change", range, oldRange, source); | ||
| 153 | + }); | ||
| 154 | + this.Quill.on("editor-change", (eventName, ...args) => { | ||
| 155 | + this.$emit("on-editor-change", eventName, ...args); | ||
| 156 | + }); | ||
| 157 | + }, | ||
| 158 | + // 上传前校检格式和大小 | ||
| 159 | + handleBeforeUpload(file) { | ||
| 160 | + const type = ["image/jpeg", "image/jpg", "image/png", "image/svg"]; | ||
| 161 | + const isJPG = type.includes(file.type); | ||
| 162 | + // 检验文件格式 | ||
| 163 | + if (!isJPG) { | ||
| 164 | + this.$message.error(`图片格式错误!`); | ||
| 165 | + return false; | ||
| 166 | + } | ||
| 167 | + // 校检文件大小 | ||
| 168 | + if (this.fileSize) { | ||
| 169 | + const isLt = file.size / 1024 / 1024 < this.fileSize; | ||
| 170 | + if (!isLt) { | ||
| 171 | + this.$message.error(`上传文件大小不能超过 ${this.fileSize} MB!`); | ||
| 172 | + return false; | ||
| 173 | + } | ||
| 174 | + } | ||
| 175 | + return true; | ||
| 176 | + }, | ||
| 177 | + handleUploadSuccess(res, file) { | ||
| 178 | + // 如果上传成功 | ||
| 179 | + if (res.code == 200) { | ||
| 180 | + // 获取富文本组件实例 | ||
| 181 | + let quill = this.Quill; | ||
| 182 | + // 获取光标所在位置 | ||
| 183 | + let length = quill.getSelection().index; | ||
| 184 | + // 插入图片 res.url为服务器返回的图片地址 | ||
| 185 | + quill.insertEmbed(length, "image", process.env.VUE_APP_BASE_API + res.fileName); | ||
| 186 | + // 调整光标到最后 | ||
| 187 | + quill.setSelection(length + 1); | ||
| 188 | + } else { | ||
| 189 | + this.$message.error("图片插入失败"); | ||
| 190 | + } | ||
| 191 | + }, | ||
| 192 | + handleUploadError() { | ||
| 193 | + this.$message.error("图片插入失败"); | ||
| 194 | + }, | ||
| 195 | + }, | ||
| 196 | +}; | ||
| 197 | +</script> | ||
| 198 | + | ||
| 199 | +<style> | ||
| 200 | +.editor, .ql-toolbar { | ||
| 201 | + white-space: pre-wrap !important; | ||
| 202 | + line-height: normal !important; | ||
| 203 | +} | ||
| 204 | + | ||
| 205 | +.quill-img { | ||
| 206 | + display: none; | ||
| 207 | +} | ||
| 208 | + | ||
| 209 | +.ql-snow .ql-tooltip[data-mode="link"]::before { | ||
| 210 | + content: "请输入链接地址:"; | ||
| 211 | +} | ||
| 212 | + | ||
| 213 | +.ql-snow .ql-tooltip.ql-editing a.ql-action::after { | ||
| 214 | + border-right: 0px; | ||
| 215 | + content: "保存"; | ||
| 216 | + padding-right: 0px; | ||
| 217 | +} | ||
| 218 | + | ||
| 219 | +.ql-snow .ql-tooltip[data-mode="video"]::before { | ||
| 220 | + content: "请输入视频地址:"; | ||
| 221 | +} | ||
| 222 | + | ||
| 223 | +.ql-snow .ql-picker.ql-size .ql-picker-label::before, | ||
| 224 | +.ql-snow .ql-picker.ql-size .ql-picker-item::before { | ||
| 225 | + content: "14px"; | ||
| 226 | +} | ||
| 227 | + | ||
| 228 | +.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before, | ||
| 229 | +.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before { | ||
| 230 | + content: "10px"; | ||
| 231 | +} | ||
| 232 | + | ||
| 233 | +.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before, | ||
| 234 | +.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before { | ||
| 235 | + content: "18px"; | ||
| 236 | +} | ||
| 237 | + | ||
| 238 | +.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before, | ||
| 239 | +.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before { | ||
| 240 | + content: "32px"; | ||
| 241 | +} | ||
| 242 | + | ||
| 243 | +.ql-snow .ql-picker.ql-header .ql-picker-label::before, | ||
| 244 | +.ql-snow .ql-picker.ql-header .ql-picker-item::before { | ||
| 245 | + content: "文本"; | ||
| 246 | +} | ||
| 247 | + | ||
| 248 | +.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before, | ||
| 249 | +.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before { | ||
| 250 | + content: "标题1"; | ||
| 251 | +} | ||
| 252 | + | ||
| 253 | +.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before, | ||
| 254 | +.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before { | ||
| 255 | + content: "标题2"; | ||
| 256 | +} | ||
| 257 | + | ||
| 258 | +.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before, | ||
| 259 | +.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before { | ||
| 260 | + content: "标题3"; | ||
| 261 | +} | ||
| 262 | + | ||
| 263 | +.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before, | ||
| 264 | +.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before { | ||
| 265 | + content: "标题4"; | ||
| 266 | +} | ||
| 267 | + | ||
| 268 | +.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before, | ||
| 269 | +.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before { | ||
| 270 | + content: "标题5"; | ||
| 271 | +} | ||
| 272 | + | ||
| 273 | +.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before, | ||
| 274 | +.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before { | ||
| 275 | + content: "标题6"; | ||
| 276 | +} | ||
| 277 | + | ||
| 278 | +.ql-snow .ql-picker.ql-font .ql-picker-label::before, | ||
| 279 | +.ql-snow .ql-picker.ql-font .ql-picker-item::before { | ||
| 280 | + content: "标准字体"; | ||
| 281 | +} | ||
| 282 | + | ||
| 283 | +.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before, | ||
| 284 | +.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before { | ||
| 285 | + content: "衬线字体"; | ||
| 286 | +} | ||
| 287 | + | ||
| 288 | +.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before, | ||
| 289 | +.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before { | ||
| 290 | + content: "等宽字体"; | ||
| 291 | +} | ||
| 292 | +</style> |
trash-ui/src/router/index.js
| @@ -187,6 +187,13 @@ export const constantRoutes = [ | @@ -187,6 +187,13 @@ export const constantRoutes = [ | ||
| 187 | hidden: true, | 187 | hidden: true, |
| 188 | meta: { title: '修改驾驶员' } | 188 | meta: { title: '修改驾驶员' } |
| 189 | }, | 189 | }, |
| 190 | + { | ||
| 191 | + path: '/documentData/info', | ||
| 192 | + component: (resolve) => require(['@/views/other/documentData/info'], resolve), | ||
| 193 | + name: '查看详情', | ||
| 194 | + hidden: true, | ||
| 195 | + meta: { title: '查看详情' } | ||
| 196 | + }, | ||
| 190 | ] | 197 | ] |
| 191 | }, | 198 | }, |
| 192 | { | 199 | { |
| @@ -205,12 +212,12 @@ export const constantRoutes = [ | @@ -205,12 +212,12 @@ export const constantRoutes = [ | ||
| 205 | component: (resolve) => require(['@/views/business/track'], resolve), | 212 | component: (resolve) => require(['@/views/business/track'], resolve), |
| 206 | name: '跟踪监督', | 213 | name: '跟踪监督', |
| 207 | meta: { title: '跟踪监督' } | 214 | meta: { title: '跟踪监督' } |
| 208 | - }, | ||
| 209 | - { | ||
| 210 | - path: 'trackTable', | ||
| 211 | - component: (resolve) => require(['@/views/business/track/trackTable'], resolve), | ||
| 212 | - name: '纪检报表', | ||
| 213 | - meta: { title: '纪检报表' } | 215 | + }, |
| 216 | + { | ||
| 217 | + path: 'trackTable', | ||
| 218 | + component: (resolve) => require(['@/views/business/track/trackTable'], resolve), | ||
| 219 | + name: '纪检报表', | ||
| 220 | + meta: { title: '纪检报表' } | ||
| 214 | }, | 221 | }, |
| 215 | { | 222 | { |
| 216 | path: 'supervision/threestep', | 223 | path: 'supervision/threestep', |
trash-ui/src/views/other/documentData/index.vue
| @@ -64,8 +64,11 @@ | @@ -64,8 +64,11 @@ | ||
| 64 | 64 | ||
| 65 | <el-table v-loading="loading" :data="documentDataList" @selection-change="handleSelectionChange"> | 65 | <el-table v-loading="loading" :data="documentDataList" @selection-change="handleSelectionChange"> |
| 66 | <el-table-column type="selection" width="55" align="center"/> | 66 | <el-table-column type="selection" width="55" align="center"/> |
| 67 | - <el-table-column label="附件" align="center" prop="id"/> | ||
| 68 | - <el-table-column label="标题" align="center" prop="title"/> | 67 | + <el-table-column label="标题" align="center" prop="title"> |
| 68 | + <template slot-scope="scope"> | ||
| 69 | + <a href="javascript:;" style="color:#0000EE;" @click="toInfo(scope.row)">{{scope.row.title}}</a> | ||
| 70 | + </template> | ||
| 71 | + </el-table-column> | ||
| 69 | <el-table-column label="时间" align="center" prop="createTime"> | 72 | <el-table-column label="时间" align="center" prop="createTime"> |
| 70 | <template slot-scope="scope"> | 73 | <template slot-scope="scope"> |
| 71 | <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d} {h}:{i}:{s}") }}</span> | 74 | <span>{{ parseTime(scope.row.createTime, "{y}-{m}-{d} {h}:{i}:{s}") }}</span> |
| @@ -102,7 +105,7 @@ | @@ -102,7 +105,7 @@ | ||
| 102 | /> | 105 | /> |
| 103 | 106 | ||
| 104 | <!-- 添加或修改文件资料对话框 --> | 107 | <!-- 添加或修改文件资料对话框 --> |
| 105 | - <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body> | 108 | + <el-dialog :title="title" :visible.sync="open" width="1200px" append-to-body> |
| 106 | <el-form ref="form" :model="form" :rules="rules" label-width="80px"> | 109 | <el-form ref="form" :model="form" :rules="rules" label-width="80px"> |
| 107 | <el-form-item label="标题" prop="title"> | 110 | <el-form-item label="标题" prop="title"> |
| 108 | <el-input v-model="form.title" placeholder="请输入标题"/> | 111 | <el-input v-model="form.title" placeholder="请输入标题"/> |
| @@ -122,49 +125,7 @@ | @@ -122,49 +125,7 @@ | ||
| 122 | </el-form-item> | 125 | </el-form-item> |
| 123 | </el-col> | 126 | </el-col> |
| 124 | </el-row> | 127 | </el-row> |
| 125 | - <el-form-item label="附件预览"> | ||
| 126 | - <el-image v-for="item in fileEntityList" | ||
| 127 | - v-if="!/\.(pjp|pdf|doc|docx|xls|xlsx)$/.test(item.name)" | ||
| 128 | - style="width: 150px; height: 100px; margin: 5px;" | ||
| 129 | - :src="createUrl(item)" | ||
| 130 | - :preview-src-list="[createUrl(item)]" | ||
| 131 | - :z-index="999"> | ||
| 132 | - </el-image> | ||
| 133 | - </el-form-item> | ||
| 134 | - <el-form-item prop="fileEntityList" label="附件"> | ||
| 135 | - <el-upload | ||
| 136 | - ref="upload" | ||
| 137 | - action="" | ||
| 138 | - accept=".jpg,.jpeg,.png,.gif,.jfif,.pjpeg,.pjp,.pdf,.doc,.docx,.xls,.xlsx" | ||
| 139 | - :on-change="fileChange" | ||
| 140 | - :auto-upload="false" | ||
| 141 | - :show-file-list="false" | ||
| 142 | - multiple | ||
| 143 | - :file-list="fileEntityList"> | ||
| 144 | - <el-button size="small" type="primary" icon="el-icon-upload">上传附件</el-button> | ||
| 145 | - </el-upload> | ||
| 146 | - </el-form-item> | ||
| 147 | - <el-table :data="fileEntityList"> | ||
| 148 | - <el-table-column property="name" label="附件名称" header-align="center" align="center"></el-table-column> | ||
| 149 | - <el-table-column label="操作" class-name="small-padding fixed-width" header-align="center" align="center"> | ||
| 150 | - <template slot-scope="scope"> | ||
| 151 | - <el-button | ||
| 152 | - size="small" type="success" | ||
| 153 | - icon="el-icon-download" | ||
| 154 | - @click="tempDownload(scope.row)" | ||
| 155 | - v-hasPermi="['other:documentData:edit']" | ||
| 156 | - round>下载 | ||
| 157 | - </el-button> | ||
| 158 | - <el-button | ||
| 159 | - size="small" type="danger" | ||
| 160 | - icon="el-icon-delete" | ||
| 161 | - @click="handleDeleteFile(scope.$index)" | ||
| 162 | - v-hasPermi="['other:documentData:remove']" | ||
| 163 | - round>删除 | ||
| 164 | - </el-button> | ||
| 165 | - </template> | ||
| 166 | - </el-table-column> | ||
| 167 | - </el-table> | 128 | + |
| 168 | </el-form> | 129 | </el-form> |
| 169 | <div slot="footer" class="dialog-footer"> | 130 | <div slot="footer" class="dialog-footer"> |
| 170 | <el-button type="primary" @click="submitForm">确 定</el-button> | 131 | <el-button type="primary" @click="submitForm">确 定</el-button> |
| @@ -183,7 +144,7 @@ import { | @@ -183,7 +144,7 @@ import { | ||
| 183 | listDocumentData, | 144 | listDocumentData, |
| 184 | updateDocumentData | 145 | updateDocumentData |
| 185 | } from "@/api/other/documentData"; | 146 | } from "@/api/other/documentData"; |
| 186 | -import Editor from '@/components/ZcEditor'; | 147 | +import Editor from '@/components/2cEditor'; |
| 187 | import {parseTime} from "../../../utils/trash"; | 148 | import {parseTime} from "../../../utils/trash"; |
| 188 | 149 | ||
| 189 | export default { | 150 | export default { |
| @@ -240,6 +201,10 @@ export default { | @@ -240,6 +201,10 @@ export default { | ||
| 240 | this.getList(); | 201 | this.getList(); |
| 241 | }, | 202 | }, |
| 242 | methods: { | 203 | methods: { |
| 204 | + toInfo(row){ | ||
| 205 | + //打开当日报修页签 | ||
| 206 | + this.$tab.openPage("查看详情","/documentData/info",{"documentData":row}) | ||
| 207 | + }, | ||
| 243 | /** 查询文件资料列表 */ | 208 | /** 查询文件资料列表 */ |
| 244 | getList() { | 209 | getList() { |
| 245 | this.loading = true; | 210 | this.loading = true; |
| @@ -320,18 +285,6 @@ export default { | @@ -320,18 +285,6 @@ export default { | ||
| 320 | let form = this.form; | 285 | let form = this.form; |
| 321 | //去掉params属性 | 286 | //去掉params属性 |
| 322 | delete form.params; | 287 | delete form.params; |
| 323 | - //先清空原有的附件 | ||
| 324 | - form.files = null; | ||
| 325 | - | ||
| 326 | - | ||
| 327 | - this.fileEntityList.forEach(item => { | ||
| 328 | - if (item.raw != null) { | ||
| 329 | - formData.append('fileList', item.raw) | ||
| 330 | - } else { | ||
| 331 | - //将原有的附件拼接到form中 | ||
| 332 | - form.files = form.files !== null ? form.files + ";" + item.url : item.url; | ||
| 333 | - } | ||
| 334 | - }) | ||
| 335 | 288 | ||
| 336 | for (let key in form) { | 289 | for (let key in form) { |
| 337 | formData.append(key, form[key] == null ? "" : form[key]) | 290 | formData.append(key, form[key] == null ? "" : form[key]) |
| @@ -380,75 +333,6 @@ export default { | @@ -380,75 +333,6 @@ export default { | ||
| 380 | this.download(response.msg); | 333 | this.download(response.msg); |
| 381 | }) | 334 | }) |
| 382 | }, | 335 | }, |
| 383 | - /** | ||
| 384 | - * 文件改变时,限制文件上传格式和大小 | ||
| 385 | - * 文件格式只能为docx/doc/pdf/png/jpeg/png/jpg | ||
| 386 | - * 大小不超过20M | ||
| 387 | - * */ | ||
| 388 | - fileChange(file, fileList) { | ||
| 389 | - let count = 0; | ||
| 390 | - for (let i = 0; i < fileList.length; i++) { | ||
| 391 | - // console.log(fileList.length) | ||
| 392 | - // console.log(this.fileEntityList[i].name+"111"+file.name) | ||
| 393 | - if (fileList[i].name == file.name) { | ||
| 394 | - count++; | ||
| 395 | - if (count == 2) { | ||
| 396 | - this.$message({ | ||
| 397 | - message: '已存在此文件!', | ||
| 398 | - type: 'warning' | ||
| 399 | - }); | ||
| 400 | - for (let j = fileList.length; j > 0; j--) { | ||
| 401 | - //如果存在此文件,去除新选择的重复文件 | ||
| 402 | - if (fileList[j - 1].name == file.name) { | ||
| 403 | - fileList.splice(j - 1, 1); | ||
| 404 | - i--; | ||
| 405 | - return false; | ||
| 406 | - } | ||
| 407 | - } | ||
| 408 | - } | ||
| 409 | - } | ||
| 410 | - } | ||
| 411 | - let fileType = file.name.substring(file.name.lastIndexOf('.') + 1).toLowerCase(); | ||
| 412 | - //格式符合后判断大小 | ||
| 413 | - if ("jpg,jpeg,png,gif,jfif,pjpeg,pjp,pdf,doc,docx,xls,xlsx".indexOf(fileType) != -1) { | ||
| 414 | - let max5M = file.size / 1024 / 1024 < 100; | ||
| 415 | - if (!max5M) { | ||
| 416 | - this.$message({ | ||
| 417 | - message: '上传文件大小不得超过100M!', | ||
| 418 | - type: 'warning' | ||
| 419 | - }); | ||
| 420 | - fileList = fileList.splice(fileList.length - 1, 1); | ||
| 421 | - } else { | ||
| 422 | - //符合条件后进行添加 | ||
| 423 | - this.fileEntityList = fileList | ||
| 424 | - } | ||
| 425 | - } else { | ||
| 426 | - this.$message({ | ||
| 427 | - message: '上传文件只能是 jpg,jpeg,png,gif,jfif,pjpeg,pjp,pdf,doc,docx,xls,xlsx格式!', | ||
| 428 | - type: 'warning' | ||
| 429 | - }); | ||
| 430 | - fileList = fileList.splice(fileList.length - 1, 1); | ||
| 431 | - } | ||
| 432 | - }, | ||
| 433 | - // 删除文件 | ||
| 434 | - handleDeleteFile(index) { | ||
| 435 | - this.fileEntityList.splice(index, 1); | ||
| 436 | - }, | ||
| 437 | - /** 文件下载 */ | ||
| 438 | - tempDownload(row) { | ||
| 439 | - let name = row.name; | ||
| 440 | - let url = ""; | ||
| 441 | - if (row.raw != null) { | ||
| 442 | - url = URL.createObjectURL(row.raw); | ||
| 443 | - } else { | ||
| 444 | - url = process.env.VUE_APP_BASE_API + row.url; | ||
| 445 | - } | ||
| 446 | - const a = document.createElement('a') | ||
| 447 | - a.setAttribute('download', name) | ||
| 448 | - a.setAttribute('target', '_blank') | ||
| 449 | - a.setAttribute('href', url); | ||
| 450 | - a.click() | ||
| 451 | - }, | ||
| 452 | createUrl(file) { | 336 | createUrl(file) { |
| 453 | if (file.raw != null) { | 337 | if (file.raw != null) { |
| 454 | return URL.createObjectURL(file.raw); | 338 | return URL.createObjectURL(file.raw); |
trash-ui/src/views/other/documentData/info.vue
0 → 100644
| 1 | +<template> | ||
| 2 | + <div class="app-container"> | ||
| 3 | + <el-row> | ||
| 4 | + <el-col :offset="3" :span="18"> | ||
| 5 | + <h1 class="info_title">{{ info.title }}</h1> | ||
| 6 | + </el-col> | ||
| 7 | + </el-row> | ||
| 8 | + <el-row> | ||
| 9 | + <el-col :offset="3" :span="18"> | ||
| 10 | + <div class="info_author"> | ||
| 11 | + <span>作者:</span><span>{{ info.createBy }}</span> | ||
| 12 | + <span>发表时间:</span><span>{{ info.createTime }}</span> | ||
| 13 | + </div> | ||
| 14 | + </el-col> | ||
| 15 | + </el-row> | ||
| 16 | + <el-row> | ||
| 17 | + <el-col> | ||
| 18 | + <div class="info_content" v-html="info.content"></div> | ||
| 19 | + </el-col> | ||
| 20 | + </el-row> | ||
| 21 | + </div> | ||
| 22 | +</template> | ||
| 23 | + | ||
| 24 | +<script> | ||
| 25 | +import { | ||
| 26 | + addDocumentData, | ||
| 27 | + delDocumentData, | ||
| 28 | + exportDocumentData, | ||
| 29 | + getDocumentData, | ||
| 30 | + listDocumentData, | ||
| 31 | + updateDocumentData | ||
| 32 | +} from "@/api/other/documentData"; | ||
| 33 | +import Editor from '@/components/ZcEditor'; | ||
| 34 | +import {parseTime} from "../../../utils/trash"; | ||
| 35 | + | ||
| 36 | +export default { | ||
| 37 | + name: "DocumentData", | ||
| 38 | + components: {Editor}, | ||
| 39 | + data() { | ||
| 40 | + return { | ||
| 41 | + // 遮罩层 | ||
| 42 | + loading: true, | ||
| 43 | + info: { | ||
| 44 | + title:null, | ||
| 45 | + createBy:null, | ||
| 46 | + createTime:null, | ||
| 47 | + content:null | ||
| 48 | + }, | ||
| 49 | + }; | ||
| 50 | + }, | ||
| 51 | + created() { | ||
| 52 | + this.initData(); | ||
| 53 | + }, | ||
| 54 | + watch:{ | ||
| 55 | + '$route.query.documentData':'initData' | ||
| 56 | + }, | ||
| 57 | + methods: { | ||
| 58 | + initData(){ | ||
| 59 | + if(this.$route.query.documentData){ | ||
| 60 | + this.info = this.$route.query.documentData; | ||
| 61 | + } | ||
| 62 | + | ||
| 63 | + } | ||
| 64 | + } | ||
| 65 | +}; | ||
| 66 | +</script> | ||
| 67 | +<style lang="scss" scoped> | ||
| 68 | +.info_title{ | ||
| 69 | + display: flex; | ||
| 70 | + justify-content: center; | ||
| 71 | + align-items: center; | ||
| 72 | + height: 100%; | ||
| 73 | +} | ||
| 74 | +.info_author{ | ||
| 75 | + display: flex; | ||
| 76 | + justify-content: center; | ||
| 77 | + align-items: center; | ||
| 78 | + height: 26px; | ||
| 79 | + font-size:14px; | ||
| 80 | + color: #616977; | ||
| 81 | + border-bottom: 1px solid #ddd; | ||
| 82 | + box-shadow: 0px 20px 20px -20px #5E5E5E; | ||
| 83 | +} | ||
| 84 | +.info_author span:nth-child(2){ | ||
| 85 | + margin-right: 20px; | ||
| 86 | +} | ||
| 87 | +.info_content{ | ||
| 88 | + display: flex; | ||
| 89 | + justify-content: center; | ||
| 90 | + align-items: center; | ||
| 91 | + height: 100%; | ||
| 92 | +} | ||
| 93 | +</style> |
trash-workFlow/src/main/resources/mapper/other/DocumentDataMapper.xml
| @@ -26,8 +26,9 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" | @@ -26,8 +26,9 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" | ||
| 26 | <if test="content != null and content != ''"> and content = #{content}</if> | 26 | <if test="content != null and content != ''"> and content = #{content}</if> |
| 27 | <if test="files != null and files != ''"> and files = #{files}</if> | 27 | <if test="files != null and files != ''"> and files = #{files}</if> |
| 28 | </where> | 28 | </where> |
| 29 | + order by create_time desc | ||
| 29 | </select> | 30 | </select> |
| 30 | - | 31 | + |
| 31 | <select id="selectDocumentDataById" parameterType="Long" resultMap="DocumentDataResult"> | 32 | <select id="selectDocumentDataById" parameterType="Long" resultMap="DocumentDataResult"> |
| 32 | <include refid="selectDocumentDataVo"/> | 33 | <include refid="selectDocumentDataVo"/> |
| 33 | where id = #{id} | 34 | where id = #{id} |