From d28223384922de5fb08c20516eb3f99981c8136a Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期五, 22 十一月 2024 17:37:34 +0800
Subject: [PATCH] 1. 修复上传问题或整改图片后，界面更新错误问题； 2. 优化问题整改界面展示效果； 3. 场景图片对话框添加查看状态下可以点击图片放大功能
---
src/components/FYImageSelectDialog.vue | 101 ++++++++--------
src/views/fysp/check/ProCheck.vue | 23 +--
src/views/fysp/check/components/CompSubTaskStatistic.vue | 2
src/components/ToolBar.vue | 4
src/views/fysp/check/components/CompProblemAddOrUpd.vue | 20 +-
src/components/core/BaseContentLayout.vue | 1
src/constants/menu.js | 10
src/views/fysp/check/components/ComChangeEdit.vue | 57 +++++---
src/views/fysp/check/components/CompProblemCard.vue | 109 +++++++++++++----
9 files changed, 197 insertions(+), 130 deletions(-)
diff --git a/src/components/FYImageSelectDialog.vue b/src/components/FYImageSelectDialog.vue
index e12c42f..04bc1b3 100644
--- a/src/components/FYImageSelectDialog.vue
+++ b/src/components/FYImageSelectDialog.vue
@@ -3,39 +3,42 @@
:model-value="dialogVisible"
@opened="handleOpen"
@closed="handleClose"
- width="66%"
+ top="5vh"
+ width="68%"
destroy-on-close
+ :close-on-press-escape="false"
>
- <div class="main">
- <el-row justify="end" v-if="!readonly">
- <el-text size="small" type="info" class="m-r-8"
- >鏈�澶氶�夋嫨{{ maxSelect }}寮犲浘鐗�</el-text
- >
- <el-button
- size="small"
- type="primary"
- @click="handleSubmit"
- :disabled="selectedImgUrlList.length == 0"
- >纭畾</el-button
- >
- <el-button size="small" type="primary" @click="handleCancel"
- >鍙栨秷</el-button
- >
- </el-row>
+ <!-- <div class="main"> -->
+ <el-row justify="end" v-if="!readonly">
+ <el-text size="small" type="info" class="m-r-8"
+ >鏈�澶氶�夋嫨{{ maxSelect }}寮犲浘鐗�</el-text
+ >
+ <el-button
+ size="small"
+ type="primary"
+ @click="handleSubmit"
+ :disabled="selectedImgUrlList.length == 0"
+ >纭畾</el-button
+ >
+ <el-button size="small" type="primary" @click="handleCancel"
+ >鍙栨秷</el-button
+ >
+ </el-row>
- <div class="center">
- <el-tabs v-if="typeList.length > 0" v-model="activeId" type="card">
- <el-tab-pane
- v-for="item in typeList"
- :key="item.typeId"
- :label="
- item.typeName + ' (' + typeImgMap.get(item.typeId).length + ')'
- "
- :name="item.typeId"
- >
- </el-tab-pane>
- </el-tabs>
- <el-scrollbar
+ <div class="center">
+ <el-tabs v-if="typeList.length > 0" v-model="activeId" type="card">
+ <el-tab-pane
+ v-for="item in typeList"
+ :key="item.typeId"
+ :label="
+ item.typeName + ' (' + typeImgMap.get(item.typeId).length + ')'
+ "
+ :name="item.typeId"
+ >
+ </el-tab-pane>
+ </el-tabs>
+ <el-scrollbar height="70vh">
+ <div
v-if="typeImgMap.get(activeId) && typeImgMap.get(activeId).length > 0"
class="imgs"
>
@@ -46,16 +49,19 @@
:class="[img.isSelect ? 'selected' : 'noActive', 'image']"
fit="cover"
:src="img.url"
+ :preview-src-list="readonly ? typeImgMap.get(activeId).map((v) => v.url) : []"
+ :initial-index="i"
@click="onSelect(img, i)"
@load="onOneImgLoadSuccess(img)"
@error="onOneImgLoadError(img)"
/>
- </el-scrollbar>
+ </div>
<el-row v-else justify="space-between">
<el-empty description="鏆傛棤璁板綍" />
</el-row>
- </div>
+ </el-scrollbar>
</div>
+ <!-- </div> -->
</el-dialog>
</template>
<script setup>
@@ -110,11 +116,11 @@
);
});
function onOneImgLoadError(img) {
- img.loading = false
+ img.loading = false;
loadedImgCount.value++;
}
function onOneImgLoadSuccess(img) {
- img.loading = false
+ img.loading = false;
loadedImgCount.value++;
}
watch(
@@ -166,12 +172,12 @@
// }
// });
// });
- emit('update:dialogVisible', true)
+ emit('update:dialogVisible', true);
}
function handleClose() {
- selectedImgUrlList.value.forEach(item => item.isSelect = false)
- selectedImgUrlList.value = []
- emit('update:dialogVisible', false)
+ selectedImgUrlList.value.forEach((item) => (item.isSelect = false));
+ selectedImgUrlList.value = [];
+ emit('update:dialogVisible', false);
}
function handleSubmit() {
emit('submit', selectedImgUrlList.value);
@@ -245,15 +251,13 @@
}
.main {
- margin: 0 auto; /* 浣跨埗鍏冪礌灞呬腑 */
- height: 72vh;
- width: 100%;
+ /* 浣跨埗鍏冪礌灞呬腑 */
+ /* margin: 0 auto; */
+ /* width: 100%; */
}
.imgs {
- height: 60vh;
width: 100%;
- min-height: 100px !important;
/* border-style:solid;
border-radius: 1px; */
/* height: 100%; */
@@ -267,16 +271,9 @@
.image {
margin: 5px;
- height: 210px;
- width: 200px;
+ height: 250px;
+ width: 240px;
border-radius: 4px;
-}
-
-.active {
- padding: 5px;
- width: 20%;
- height: 200px;
- border: 0.5rem outset rgb(52, 155, 4);
}
.selected {
diff --git a/src/components/ToolBar.vue b/src/components/ToolBar.vue
index be6a898..7f4452e 100644
--- a/src/components/ToolBar.vue
+++ b/src/components/ToolBar.vue
@@ -58,7 +58,9 @@
.layout {
/* background-color: beige; */
height: var(--height-toolbar);
- /* border-bottom: 1px solid var(--el-color-info-light-7); */
+ border-bottom: 1px solid var(--el-color-info-light-7);
+ box-shadow: 6px 4px 4px rgba(0, 0, 0, 0.12);
+ margin-bottom: 4px;
}
.cell-item {
diff --git a/src/components/core/BaseContentLayout.vue b/src/components/core/BaseContentLayout.vue
index e5f888c..3889435 100644
--- a/src/components/core/BaseContentLayout.vue
+++ b/src/components/core/BaseContentLayout.vue
@@ -53,6 +53,7 @@
/* background-color: aqua; */
/* overflow-y: auto; */
border-right: 1px solid var(--el-color-info-light-7);
+ /* box-shadow: -10px 0px 4px rgba(0, 0, 0, 0.12) inset; */
}
.el-header {
diff --git a/src/constants/menu.js b/src/constants/menu.js
index c5a1b56..39cafb0 100644
--- a/src/constants/menu.js
+++ b/src/constants/menu.js
@@ -177,11 +177,11 @@
];
const MENU_FYTZ = [
- {
- path: '/fytz/ledger',
- icon: 'Search',
- name: '鍙拌处瀹℃牳'
- },
+ // {
+ // path: '/fytz/ledger',
+ // icon: 'Search',
+ // name: '鍙拌处瀹℃牳'
+ // },
{
path: '/fytz/notice',
icon: 'Message',
diff --git a/src/views/fysp/check/ProCheck.vue b/src/views/fysp/check/ProCheck.vue
index 92e3617..411065c 100644
--- a/src/views/fysp/check/ProCheck.vue
+++ b/src/views/fysp/check/ProCheck.vue
@@ -271,8 +271,7 @@
this.mainLoading = false;
});
},
- onAddProCanceled() {
- },
+ onAddProCanceled() {},
// 闂鍗＄墖缁勪欢涓诲姩鍙戣捣鍒锋柊鐖剁粍浠舵暟鎹�
updateSubtask(refresh = false) {
this.curSubtask.data.proCheckedNum++;
@@ -285,8 +284,8 @@
// 鍒锋柊褰撳墠閫変腑瀛愪换鍔�
refreshCurrSubtask(refresh) {
this.sideLoading = false;
- // this.mainLoading = true;
setTimeout(() => {
+ this.mainLoading = true;
taskApi
.getProBySubtask(this.curSubtask.data.stGuid)
.then((res) => {
@@ -307,18 +306,18 @@
// this.curSubtask = s;
})
.finally(() => {
- // this.mainLoading = false;
+ this.mainLoading = false;
});
- }, 150);
+ }, 500);
},
// 闂瀹℃牳瀹屾垚鍚庯紝鏇存柊宸︿晶鍒楄〃瀵瑰簲瀛愪换鍔＄姸鎬�
- handleProblemCheck(){
- const status = ProCheckProxy.calProStatus(this.curProList)
- this.curSubtask.data.proNum = status.proNum
- this.curSubtask.data.proCheckedNum = status.proCheckedNum
- this.curSubtask.data.changeNum = status.changeNum
- this.curSubtask.data.changeCheckedNum = status.changeCheckedNum
- this.curSubtask.type = ProCheckProxy.getSubtaskType(this.curSubtask.data)
+ handleProblemCheck() {
+ const status = ProCheckProxy.calProStatus(this.curProList);
+ this.curSubtask.data.proNum = status.proNum;
+ this.curSubtask.data.proCheckedNum = status.proCheckedNum;
+ this.curSubtask.data.changeNum = status.changeNum;
+ this.curSubtask.data.changeCheckedNum = status.changeCheckedNum;
+ this.curSubtask.type = ProCheckProxy.getSubtaskType(this.curSubtask.data);
}
},
mounted() {}
diff --git a/src/views/fysp/check/components/ComChangeEdit.vue b/src/views/fysp/check/components/ComChangeEdit.vue
index 6660d76..9bf3d15 100644
--- a/src/views/fysp/check/components/ComChangeEdit.vue
+++ b/src/views/fysp/check/components/ComChangeEdit.vue
@@ -46,17 +46,19 @@
</el-col>
</el-row>
<div class="flex-div">
- <el-button type="primary" @click="onSubmit">淇濆瓨</el-button>
+ <el-button type="primary" @click="onSubmit" :loading="loading"
+ >淇濆瓨</el-button
+ >
<el-button @click="onCancel">鍙栨秷</el-button>
</div>
<el-image-viewer
- v-if="previewDialogVisible"
- :url-list="fileList.map((item) => item.url)"
- :initial-index="initialIndex"
- @close="previewDialogVisible = false"
- alt="棰勮"
- class="preview-pic"
- />
+ v-if="previewDialogVisible"
+ :url-list="fileList.map((item) => item.url)"
+ :initial-index="initialIndex"
+ @close="previewDialogVisible = false"
+ alt="棰勮"
+ class="preview-pic"
+ />
</template>
</CompGenericWrapper>
</template>
@@ -68,8 +70,7 @@
import { ElMessage } from 'element-plus';
export default {
emits: ['submit', 'cancel'],
- components: {
- },
+ components: {},
watch: {
oldChangeFileList: {
handler(nv, ov) {
@@ -117,7 +118,9 @@
deleteImg: [],
ledgerPicDialog: false,
- anyPhotoDialog: false
+ anyPhotoDialog: false,
+
+ loading: false
};
},
mounted() {},
@@ -161,13 +164,14 @@
this.oldFileList = useCloned(beforeEditImgList).cloned.value;
},
onCancel() {
- this.$emit("cancel")
- this.$emit('update:visible', false)
+ this.$emit('cancel');
+ this.$emit('update:visible', false);
},
onSubmit() {
if (!this.pictureValidate()) {
return;
}
+ this.loading = true;
// 鏁版嵁鍑嗗
let data = new FormData();
var picUrls = [];
@@ -190,28 +194,35 @@
}
});
- const that = this;
let deleteImgCopy = this.deleteImg;
if (this.changeType == 1) {
- fileUtil.getImageFiles(picUrls, function (files) {
+ fileUtil.getImageFiles(picUrls, (files) => {
data.append('deleteImg', deleteImgCopy);
- data.append('problemId', that.problemId);
+ data.append('problemId', this.problemId);
files.forEach((image) => {
data.append('images', image);
});
- problemApi.updateChange(data).then((res) => {});
+ problemApi
+ .updateChange(data)
+ .then((res) => {
+ this.$emit('submit', true);
+ })
+ .finally(() => (this.loading = false));
});
- that.$emit('submit', true);
} else {
- fileUtil.getImageFiles(picUrls, function (files) {
- data.append('problemId', that.problemId);
+ fileUtil.getImageFiles(picUrls, (files) => {
+ data.append('problemId', this.problemId);
files.forEach((image) => {
data.append('images', image);
});
- problemApi.changeProblem(data).then((res) => {});
- that.$emit('submit', true);
+ problemApi
+ .changeProblem(data)
+ .then((res) => {
+ this.$emit('submit', true);
+ })
+ .finally(() => (this.loading = false));
});
}
},
@@ -222,7 +233,7 @@
}
},
handlePictureCardPreview(uploadFile) {
- this.initialIndex = this.fileList.indexOf(uploadFile)
+ this.initialIndex = this.fileList.indexOf(uploadFile);
this.previewDialogVisible = true;
this.previewDialogImageUrl = uploadFile.url;
},
diff --git a/src/views/fysp/check/components/CompProblemAddOrUpd.vue b/src/views/fysp/check/components/CompProblemAddOrUpd.vue
index 2cf3bc9..0ba0cb8 100644
--- a/src/views/fysp/check/components/CompProblemAddOrUpd.vue
+++ b/src/views/fysp/check/components/CompProblemAddOrUpd.vue
@@ -167,9 +167,7 @@
<el-button type="primary" @click="onSubmit" v-show="!readonly"
>淇濆瓨</el-button
>
- <el-button @click="onCancel" v-show="!readonly"
- >鍙栨秷</el-button
- >
+ <el-button @click="onCancel" v-show="!readonly">鍙栨秷</el-button>
</el-form-item>
</el-form>
<ArbitraryPhoto
@@ -230,7 +228,7 @@
components: {
ArbitraryPhoto,
CompDevicePhoto,
- CompLedgerPhoto,
+ CompLedgerPhoto
},
props: {
readonly: {
@@ -586,8 +584,8 @@
return true;
},
onCancel() {
- this.$emit("cancel")
- this.$emit('update:visible', false)
+ this.$emit('cancel');
+ this.$emit('update:visible', false);
},
onSubmit() {
this.$refs.formRef.validate((valid) => {
@@ -629,9 +627,10 @@
files.forEach((image) => {
data.append('images', image);
});
- problemApi.updateProblem(data).then((res) => {});
+ problemApi.updateProblem(data).then((res) => {
+ this.$emit('submit', false);
+ });
});
- this.$emit('submit', false);
} else {
const deepCopySubTask = useCloned(this.subtask).cloned.value;
const that = this;
@@ -651,9 +650,10 @@
files.forEach((image) => {
data.append('images', image);
});
- problemApi.newProblem(data).then((res) => {});
+ problemApi.newProblem(data).then((res) => {
+ this.$emit('submit', true);
+ });
});
- this.$emit('submit', true);
}
}
});
diff --git a/src/views/fysp/check/components/CompProblemCard.vue b/src/views/fysp/check/components/CompProblemCard.vue
index aabc5b4..bdf33a6 100644
--- a/src/views/fysp/check/components/CompProblemCard.vue
+++ b/src/views/fysp/check/components/CompProblemCard.vue
@@ -1,13 +1,17 @@
<template>
- <el-card class="layout" shadow="hover">
- <el-steps
- :active="proStatus.index"
- finish-status="success"
- style=""
- align-center
- >
- <el-step v-for="(s, i) in getSteps" :key="i" :title="s" />
- </el-steps>
+ <el-card class="layout" shadow="never">
+ <!-- <el-row justify="space-between"> -->
+ <div >
+ <el-steps
+ :active="proStatus.index"
+ finish-status="success"
+ style=""
+ align-center
+ >
+ <el-step v-for="(s, i) in getSteps" :key="i" :title="s" />
+ </el-steps>
+ </div>
+ <!-- </el-row> -->
<el-descriptions :column="3" size="small">
<template #title>
@@ -85,11 +89,7 @@
</el-col>
<el-col :span="12">
<el-row justify="end" class="btn-group">
- <el-button
- type="danger"
- size="small"
- @click="deletePro"
- disabled
+ <el-button type="danger" size="small" @click="deletePro" disabled
>鍒犻櫎</el-button
>
<!-- <el-button
@@ -100,7 +100,7 @@
>鍒犻櫎</el-button
> -->
<!-- 瀹℃牳椹冲洖鎿嶄綔 -->
- <!-- <el-button
+ <el-button
v-if="
this.problem.extension3 == 'fail' ||
this.problem.extension3 == 'change_fail'
@@ -118,7 +118,7 @@
@click="rejectPro"
:disabled="!proStatus.checkable"
>瀹℃牳椹冲洖</el-button
- > -->
+ >
<el-button
v-if="
this.problem.extension3 == 'pass' ||
@@ -244,11 +244,11 @@
},
{
bef: '闂寰呮暣鏀�',
- aft: '闂宸叉暣鏀�'
+ aft: '鏁存敼宸蹭笂浼�'
},
{
bef: '鏁存敼寰呭鏍�',
- aft: '鏁存敼宸插鏍�'
+ aft: '闂宸叉暣鏀�'
}
]
};
@@ -301,8 +301,7 @@
this.$emit('submit', isOk);
this.proAddOrUpdDialogVisible = false;
},
- onChangeCanceled() {
- },
+ onChangeCanceled() {},
onChangeSubmited(isOk) {
this.$emit('submit', isOk);
this.changeDialogVisible = false;
@@ -350,7 +349,7 @@
.checkProblem({ pId: pro.guid, action: action })
.then((res) => {
if (res.success) {
- pro.extension3 = status
+ pro.extension3 = status;
this.$emit('check');
}
});
@@ -372,7 +371,7 @@
.checkProblem({ pId: pro.guid, action: action })
.then((res) => {
if (res.success) {
- pro.extension3 = status
+ pro.extension3 = status;
this.$emit('check');
}
});
@@ -415,14 +414,14 @@
<style scoped>
.layout {
background-color: transparent;
- margin-top: 20px;
+ margin-bottom: 20px;
/* border: none; */
- border-color: rgba(0, 0, 0, 0.308);
+ /* border-color: rgba(0, 0, 0, 0.308); */
}
.image {
- width: 200px;
- height: 210px;
+ width: 240px;
+ height: 250px;
border-radius: 4px;
}
@@ -457,3 +456,61 @@
background-color: var(--el-color-success-light-3);
}
</style>
+
+<!-- 姝ラ鏉¤嚜瀹氫箟鏍峰紡 -->
+<style scoped>
+:deep(.el-steps--simple){
+ background: #fffbf731;
+}
+
+:deep(.is-wait .el-step__icon){
+ height: 17px;
+ width: 17px;
+ margin-top: 3px;
+}
+
+:deep(.is-wait .is-text .el-step__icon-inner) {
+ font-size: var(--el-font-size-small);
+}
+
+:deep(.is-success .el-step__icon){
+ height: 17px;
+ width: 17px;
+ margin-top: 3px;
+}
+
+:deep(.is-success .is-text .el-step__icon-inner) {
+ font-size: var(--el-font-size-small);
+}
+
+:deep(.el-step__head.is-process) {
+ border-color: var(--el-color-danger);
+ color: var(--el-color-danger)
+}
+
+:deep(.el-step__head.is-wait) {
+ border-color: var(--el-text-color-placeholder);
+ color: var(--el-text-color-placeholder)
+}
+
+:deep(.el-step__head.is-success) {
+ border-color: var(--el-color-success-light-3);
+ color: var(--el-color-success-light-3)
+}
+
+:deep(.el-step__title.is-process) {
+ color: var(--el-color-danger);
+ font-weight: bolder;
+ font-size: var(--el-font-size-large);
+}
+
+:deep(.el-step__title.is-wait) {
+ color: var(--el-text-color-placeholder);
+ font-size: var(--el-font-size-small);
+}
+
+:deep(.el-step__title.is-success) {
+ color: var(--el-color-success-light-3);
+ font-size: var(--el-font-size-small);
+}
+</style>
diff --git a/src/views/fysp/check/components/CompSubTaskStatistic.vue b/src/views/fysp/check/components/CompSubTaskStatistic.vue
index 652cf44..375ae5c 100644
--- a/src/views/fysp/check/components/CompSubTaskStatistic.vue
+++ b/src/views/fysp/check/components/CompSubTaskStatistic.vue
@@ -16,7 +16,7 @@
<el-descriptions-item
label="鏁存敼鐜�"
label-class-name="problem-label"
- :class-name="summary.changePer < 0.6 ? 'danger-content' : 'secondary-content'"
+ :class-name="summary.changePer < 1 ? 'danger-content' : 'secondary-content'"
>{{ formatPercent(summary.changePer) }}</el-descriptions-item
>
</el-descriptions>
--
Gitblit v1.9.3