From 829f5116884f98643ffc5b2a548a600d40c0cedb Mon Sep 17 00:00:00 2001
From: zhanghua <314079846@qq.com>
Date: 星期一, 14 四月 2025 23:09:32 +0800
Subject: [PATCH] 处理图片显示问题
---
src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue | 299 +++++++++++++++++++++++++++++------------------------------
1 files changed, 146 insertions(+), 153 deletions(-)
diff --git a/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue b/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue
index 6bd30a2..5c7570b 100644
--- a/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue
+++ b/src/views/operate/disposal/casepool/dispatch/updateUser/uploadResult/components/book/index.vue
@@ -2,130 +2,136 @@
<div class="book">
<div class="book-title">鏂囩涔︾被</div>
<div class="book-form">
- <el-form ref="bookForm" label-width="120px" :model="book" :rules="bookRules" autoComplete="on">
+ <el-form
+ ref="bookForm"
+ label-width="120px"
+ :model="book"
+ :rules="bookRules"
+ autoComplete="on"
+ >
<div class="book-item">
<!-- 鏂囦功绉嶇被 -->
<el-form-item label="鏂囦功绉嶇被:" prop="writType">
- <el-select v-model="book.writType" placeholder="璇疯緭鍏ユ枃涔︾绫�">
- <el-option v-for="item in kindList" :key="item.id" :label="item.name"
- :value="item.id">
+ <el-select
+ v-model="book.writType"
+ placeholder="璇疯緭鍏ユ枃涔︾绫�"
+ >
+ <el-option
+ v-for="item in kindList"
+ :key="item.id"
+ :label="item.name"
+ :value="item.id"
+ >
</el-option>
</el-select>
</el-form-item>
<!-- 鏂囦功缂栧彿 -->
<el-form-item label="鏂囦功缂栧彿:" prop="writCode">
- <el-input v-model="book.writCode" placeholder="璇疯緭鍏ユ枃涔︾紪鍙�"></el-input>
+ <el-input
+ v-model="book.writCode"
+ placeholder="璇疯緭鍏ユ枃涔︾紪鍙�"
+ ></el-input>
</el-form-item>
</div>
<!-- 杩濇硶绫诲瀷 -->
- <el-form-item label="杩濇硶绫诲瀷:" prop="illegalType" >
- <el-input v-model="basecase" ></el-input>
+ <el-form-item label="杩濇硶绫诲瀷:" prop="illegalType">
+ <el-input v-model="basecase"></el-input>
</el-form-item>
<!-- 鏂囦功鍙戞斁鏃堕棿 -->
<el-form-item label="鏂囦功鍙戞斁鏃堕棿:" prop="sendTime">
- <el-date-picker v-model="book.sendTime" type="datetime" placeholder="璇烽�夋嫨骞存湀鏃�">
+ <el-date-picker
+ v-model="book.sendTime"
+ type="datetime"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ placeholder="璇烽�夋嫨骞存湀鏃�"
+ >
</el-date-picker>
</el-form-item>
<!-- 鏂囦功闄愬畾鏃堕棿 -->
<el-form-item label="鏂囦功闄愬畾鏃堕棿" prop="limitTime">
- <el-date-picker v-model="book.limitTime" type="datetime" placeholder="璇烽�夋嫨骞存湀鏃�">
+ <el-date-picker
+ v-model="book.limitTime"
+ type="datetime"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ placeholder="璇烽�夋嫨骞存湀鏃�"
+ >
</el-date-picker>
</el-form-item>
<!-- 鏂囦功鍙戞斁鍐呭 -->
<el-form-item label="鏂囦功鍙戞斁鍐呭:" prop="sendContent">
- <el-input v-model="book.sendContent" placeholder="璇疯緭鍏ユ枃涔﹀彂鏀惧唴瀹�"></el-input>
+ <el-input
+ v-model="book.sendContent"
+ placeholder="璇疯緭鍏ユ枃涔﹀彂鏀惧唴瀹�"
+ ></el-input>
</el-form-item>
<!-- 瀹為檯鏁存敼鏃堕棿 -->
<el-form-item label="瀹為檯鏁存敼鏃堕棿:" prop="rectifyTime">
- <el-date-picker v-model="book.rectifyTime" type="datetime" placeholder="璇烽�夋嫨骞存湀鏃�">
+ <el-date-picker
+ v-model="book.rectifyTime"
+ type="datetime"
+ value-format="yyyy-MM-dd HH:mm:ss"
+ placeholder="璇烽�夋嫨骞存湀鏃�"
+ >
</el-date-picker>
</el-form-item>
<!-- 鏁存敼鎯呭喌 -->
<el-form-item label="鏁存敼鎯呭喌:" prop="rectifySituation">
- <el-input v-model="book.rectifySituation" placeholder="璇疯緭鍏ユ暣鏀规儏鍐�"></el-input>
+ <el-input
+ v-model="book.rectifySituation"
+ placeholder="璇疯緭鍏ユ暣鏀规儏鍐�"
+ ></el-input>
</el-form-item>
<!-- 澶囨敞 -->
<el-form-item label="澶囨敞:" prop="remark">
- <el-input v-model="book.remark" placeholder="璇疯緭鍏ュ娉�"></el-input>
+ <el-input
+ v-model="book.remark"
+ placeholder="璇疯緭鍏ュ娉�"
+ ></el-input>
</el-form-item>
<!-- 鏂囦功鐓х墖涓婁紶 -->
<el-form-item label="鏂囦功鐓х墖涓婁紶:" prop="writPic">
<div class="upImg">
- <!-- <div class="img-list" v-if="book.writPic.length!==0">
- <div class="img" v-for="(item,index) in book.writPic" :key="index">
- <img :src="item" alt="">
- <i class="el-icon-close myicon" @click="handleRemove(index,1)"></i>
- </div>
- </div>
- <div class="upload" v-if="book.writPic.length<4">
- <el-upload :file-list="fileList" class="upload-demo"
- action="/sccg/file/medias" multiple :show-file-list="false"
- :limit="4" :on-success="handleSuccess1" :headers="getToken()">
- <i class="el-icon-plus"></i>
- </el-upload>
- </div> -->
- <MyUpload @setPictureUrl="writPic" @delPictureUrl="delWritPic"></MyUpload>
- <div class="tip">{{book.writPic.length}} / 4</div>
+ <MyUpload
+ @setPictureUrl="writPic"
+ @delPictureUrl="delWritPic"
+ :picture-list="book.writPic"
+ ></MyUpload>
+ <div class="tip">{{ book.writPic.length }} / 4</div>
</div>
</el-form-item>
<!-- 鏁存敼鍓嶇収鐗� -->
<el-form-item label="鏁存敼鍓嶇収鐗�:" prop="originalPic">
- <div class="upImg">
- <!-- <div class="img-list" v-if="book.originalPic.length!==0">
- <div class="img" v-for="(item,index) in book.originalPic" :key="index">
- <img :src="item" alt="">
- <i class="el-icon-close myicon" @click="handleRemove(index,2)"></i>
- </div>
- </div>
- <div class="upload" v-if="book.originalPic.length<4">
- <el-upload :file-list="fileList" class="upload-demo"
- action="/sccg/file/medias" multiple :show-file-list="false"
- :limit="4" :on-success="handleSuccess2" :headers="getToken()">
- <i class="el-icon-plus"></i>
- </el-upload>
- </div> -->
- <MyUpload @setPictureUrl="originalPic" @delPictureUrl="delOriginalPic"></MyUpload>
- <div class="tip">{{book.originalPic.length}} / 4</div>
+ <div class="upImg">
+ <MyUpload
+ @setPictureUrl="originalPic"
+ @delPictureUrl="delOriginalPic"
+ :picture-list="book.originalPic"
+ ></MyUpload>
+ <div class="tip">{{ book.originalPic.length }} / 4</div>
</div>
</el-form-item>
<!-- 鏁存敼鍚庣収鐗� -->
<el-form-item label="鏁存敼鍚庣収鐗�:" prop="rectifiedPic">
<div class="upImg">
- <!-- <div class="img-list" v-if="book.rectifiedPic.length!==0">
- <div class="img" v-for="(item,index) in book.rectifiedPic" :key="index">
- <img :src="item" alt="">
- <i class="el-icon-close myicon" @click="handleRemove(index,3)"></i>
- </div>
- </div> -->
- <!-- <div class="upload" v-if="book.rectifiedPic.length<4">
- <el-upload :file-list="fileList" class="upload-demo"
- action="/sccg/file/medias" multiple :show-file-list="false"
- :limit="4" :on-success="handleSuccess3" :headers="getToken()">
- <i class="el-icon-plus"></i>
- </el-upload>
- </div> -->
- <MyUpload @setPictureUrl="rectifiedPic" @delPictureUrl="delRectifiedPic"></MyUpload>
- <div class="tip">{{book.rectifiedPic.length}} / 4</div>
+ <MyUpload
+ @setPictureUrl="rectifiedPic"
+ @delPictureUrl="delRectifiedPic"
+ :picture-list="book.rectifiedPic"
+ ></MyUpload>
+ <div class="tip">
+ {{ book.rectifiedPic.length }} / 4
+ </div>
</div>
</el-form-item>
<!-- 鍏朵粬鐓х墖 -->
<el-form-item label="鍏朵粬:" prop="otherPic">
<div class="upImg">
- <!-- <div class="img-list" v-if="book.otherPic.length!==0"> -->
- <!-- <div class="img" v-for="(item,index) in book.otherPic" :key="index">
- <img :src="item" alt="">
- <i class="el-icon-close myicon" @click="handleRemove(index,4)"></i>
- </div>
- </div>
- <div class="upload" v-if="book.otherPic.length<4">
- <el-upload :file-list="fileList" class="upload-demo"
- action="/sccg/file/medias" multiple :show-file-list="false"
- :limit="4" :on-success="handleSuccess4" :headers="getToken()">
- <i class="el-icon-plus"></i>
- </el-upload>
- </div> -->
- <MyUpload @setPictureUrl="otherPic" @delPictureUrl="delOtherPic"></MyUpload>
- <div class="tip">{{book.otherPic.length}} / 4</div>
+ <MyUpload
+ @setPictureUrl="otherPic"
+ @delPictureUrl="delOtherPic"
+ :picture-list="book.otherPic"
+ ></MyUpload>
+ <div class="tip">{{ book.otherPic.length }} / 4</div>
</div>
</el-form-item>
</el-form>
@@ -133,8 +139,9 @@
</div>
</template>
<script>
-import {getCodeList} from '@/utils/helper'
+import { deepClone, getCodeList } from '@/utils/helper'
import MyUpload from "@/components/myUpload"
+import { FILE_ORIGINAL_PATH } from "@/utils";
export default {
components: {
MyUpload
@@ -204,21 +211,21 @@
}
}
const checkRectPic = (rule, value, callback) => {
- if (value.length!==0) {
+ if (value.length !== 0) {
callback();
} else {
callback(new Error('鏁存敼鍚庣収鐗囦笉鑳戒负绌�'));
}
}
const checkWritPic = (rule, value, callback) => {
- if (value.length!==0) {
+ if (value.length !== 0) {
callback();
} else {
callback(new Error('鏂囦功鐓х墖涓嶈兘涓虹┖'));
}
}
const checkOrgPic = (rule, value, callback) => {
- if (value.length !==0) {
+ if (value.length !== 0) {
callback();
} else {
callback(new Error('鏁存敼鍓嶇収鐗囦笉鑳戒负绌�'));
@@ -242,11 +249,6 @@
trigger: 'blur', validator: checkId
}
],
- // illegalType: [
- // {
- // trigger: 'blur', validator: checkVio
- // }
- // ],
sendTime: [
{
trigger: 'blur', validator: checkGiveTime
@@ -302,50 +304,42 @@
value: 2,
},
],
- basecase:""
+ basecase: ""
}
},
created() {
- const {getBookType} = this
- getBookType();
- const {mycode}=this;
- console.log(121,mycode)
- this.getEventInfo(mycode)
+ this.getBookType();
+ this.basecase = this.illegalType;
+ if (this.writ) {
+ this.book = deepClone(this.writ);
+ this.book.originalPic = this.writ.originalPic.split(',');
+ this.book.writPic = this.writ.writPic.split(',');
+ this.book.otherPic = this.writ.otherPic.split(',');
+ this.book.rectifiedPic = this.writ.rectifiedPic.split(',');
+ }
},
- props: ['caseId', 'closeDialog','mycode'],
+ props: ['caseId', 'closeDialog', 'mycode', 'writ', 'illegalType'],
methods: {
- // 鑾峰彇妗堜欢淇℃伅
- async getEventInfo(mycode) {
- await this.$axios({
- method: 'get',
- url: `sccg/base_case/baseCaseDetail/${mycode}`
- })
- .then(res => {
- this.basecase = res.data.baseCase.illegalBuilding.categoryText;
- this.book.illegalType=res.data.baseCase.illegalBuilding.categoryId;
- })
- },
-
handleSuccess1(res, file, filelist) {
- const baseUrl = 'http://140.143.152.226:8410/';
+ const baseUrl = '';
if (this.book.writPic.length < 4) {
this.book.writPic.push(baseUrl + res.data.url1)
}
},
handleSuccess2(res, file, filelist) {
- const baseUrl = 'http://140.143.152.226:8410/';
+ const baseUrl = '';
if (this.book.originalPic.length < 4) {
this.book.originalPic.push(baseUrl + res.data.url1)
}
},
handleSuccess3(res, file, filelist) {
- const baseUrl = 'http://140.143.152.226:8410/';
+ const baseUrl = '';
if (this.book.rectifiedPic.length < 4) {
this.book.rectifiedPic.push(baseUrl + res.data.url1)
}
},
handleSuccess4(res, file, filelist) {
- const baseUrl = 'http://140.143.152.226:8410/';
+ const baseUrl = '';
if (this.book.otherPic.length < 4) {
this.book.otherPic.push(baseUrl + res.data.url1)
}
@@ -357,66 +351,65 @@
return { Authorization: tokenHead + token }
}
},
-
- // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧�
- writPic({ url }) {
- const baseUrl = 'http://140.143.152.226:8410/';
+
+ // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧�
+ writPic({ url }) {
+ const baseUrl = '';
if (this.book.originalPic.length < 4) {
- this.book.writPic.push(baseUrl + url)
+
+ this.book.writPic.push(FILE_ORIGINAL_PATH + url)
}
- console.log(url);
},
//鍒犻櫎鍥剧墖
- delWritPic({url}){
- const baseUrl = 'http://140.143.152.226:8410/';
- console.log(url);
- this.book.writPic.splice(this.book.writPic.indexOf(baseUrl + url),1);
+ delWritPic({ url }) {
+ const baseUrl = '';
+ this.book.writPic.splice(this.book.writPic.indexOf(baseUrl + url), 1);
},
- // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧�
- otherPic({ url }) {
- const baseUrl = 'http://140.143.152.226:8410/';
+ // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧�
+ otherPic({ url }) {
+ const baseUrl = '';
if (this.book.otherPic.length < 4) {
- this.book.otherPic.push(baseUrl + url)
+
+ this.book.otherPic.push(FILE_ORIGINAL_PATH + url)
}
- console.log(url);
},
//鍒犻櫎鍥剧墖
- delOtherPic({url}){
- const baseUrl = 'http://140.143.152.226:8410/';
- this.book.otherPic.splice(this.book.otherPic.indexOf(baseUrl + url),1);
+ delOtherPic({ url }) {
+ const baseUrl = '';
+ this.book.otherPic.splice(this.book.otherPic.indexOf(baseUrl + url), 1);
},
-
- // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧�
- rectifiedPic({ url }) {
- const baseUrl = 'http://140.143.152.226:8410/';
+
+ // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧�
+ rectifiedPic({ url }) {
+ const baseUrl = '';
if (this.book.otherPic.length < 4) {
- this.book.rectifiedPic.push(baseUrl + url)
+
+ this.book.rectifiedPic.push(FILE_ORIGINAL_PATH + url)
}
- console.log(url);
},
//鍒犻櫎鍥剧墖
- delRectifiedPic({url}){
- const baseUrl = 'http://140.143.152.226:8410/';
- this.book.rectifiedPic.splice(this.book.rectifiedPic.indexOf(baseUrl + url),1);
+ delRectifiedPic({ url }) {
+ const baseUrl = '';
+ this.book.rectifiedPic.splice(this.book.rectifiedPic.indexOf(baseUrl + url), 1);
},
- // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧�
- originalPic({ url }) {
- const baseUrl = 'http://140.143.152.226:8410/';
+ // 璁剧疆涓婁紶鎴愬姛涔嬪悗鐨勫浘鐗囧湴鍧�
+ originalPic({ url }) {
+ const baseUrl = '';
if (this.book.otherPic.length < 4) {
- this.book.originalPic.push(baseUrl + url)
+
+ this.book.originalPic.push(FILE_ORIGINAL_PATH + url)
}
- console.log(url);
},
//鍒犻櫎鍥剧墖
- delOriginalPic({url}){
- const baseUrl = 'http://140.143.152.226:8410/';
- this.book.originalPic.splice(this.book.originalPic.indexOf(baseUrl + url),1);
+ delOriginalPic({ url }) {
+ const baseUrl = '';
+ this.book.originalPic.splice(this.book.originalPic.indexOf(baseUrl + url), 1);
},
// 鑾峰彇鏂囦功绉嶇被
- async getBookType(){
- let arr
+ async getBookType() {
+ let arr
arr = await getCodeList('15');
this.kindList = arr;
}
@@ -510,16 +503,16 @@
}
}
-::v-deep .el-textarea__inner {
- background-color: #09152f;
- border: 1px solid #17324c;
-}
+// ::v-deep .el-textarea__inner {
+// // background-color: #09152f;
+// border: 1px solid #17324c;
+// }
-::v-deep .el-input__count {
- background-color: #09152f;
-}
+// ::v-deep .el-input__count {
+// // background-color: #09152f;
+// }
-::v-deep .el-form-item__label {
- color: #4b9bb7;
-}
+// ::v-deep .el-form-item__label {
+// color: #4b9bb7;
+// }
</style>
\ No newline at end of file
--
Gitblit v1.8.0