|
|
|
@ -4,15 +4,15 @@ |
|
|
|
<div class="method-details-page"> |
|
|
|
<div class="flex justify-between items-center"> |
|
|
|
<span v-if="editTitle"> |
|
|
|
<el-input class="input" v-model="title"></el-input> |
|
|
|
<el-input class="input" v-model="itemName"></el-input> |
|
|
|
<i |
|
|
|
class="el-icon-check cursor-pointer ml-4 font-16" |
|
|
|
style="color: #409eff" |
|
|
|
@click="editTitle = !editTitle" |
|
|
|
@click="handleSaveTitle" |
|
|
|
></i> |
|
|
|
</span> |
|
|
|
<span v-else |
|
|
|
>{{ title }} |
|
|
|
>{{ itemName }} |
|
|
|
<i |
|
|
|
class="el-icon-edit cursor-pointer ml-4 font-16" |
|
|
|
style="color: #409eff" |
|
|
|
@ -38,20 +38,20 @@ |
|
|
|
<el-col :span="3"> |
|
|
|
<div class="item-row-content">检查项目</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="11"> |
|
|
|
<el-col :span="9"> |
|
|
|
<div class="item-row-content">问题描述</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="6"> |
|
|
|
<el-col :span="8"> |
|
|
|
<div class="item-row-content item-row-content2"> |
|
|
|
<div class="title-1">问题等级</div> |
|
|
|
<div class="flex w-full title-2"> |
|
|
|
<div class="flex-1 text-center items-center pt-4 pb-4"> |
|
|
|
<div class="w-33 justify-center flex items-center pt-4 pb-4"> |
|
|
|
一般 |
|
|
|
</div> |
|
|
|
<div class="flex-1 text-center items-center pt-4 pb-4"> |
|
|
|
<div class="w-33 justify-center flex items-center pt-4 pb-4"> |
|
|
|
较重 |
|
|
|
</div> |
|
|
|
<div class="flex-1 text-center items-center pt-4 pb-4"> |
|
|
|
<div class="flex-1 justify-center flex items-center pt-4 pb-4"> |
|
|
|
严重 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -61,38 +61,67 @@ |
|
|
|
<div class="item-row-content">操作</div> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
<el-row class="item-row" v-for="(item, index) in list" :key="item"> |
|
|
|
<el-row |
|
|
|
class="item-row color-333" |
|
|
|
v-for="(item, index) in questList" |
|
|
|
:key="index" |
|
|
|
> |
|
|
|
<el-col :span="2"> |
|
|
|
<div class="item-row-content">2</div> |
|
|
|
<div class="item-row-content">{{ index + 1 }}</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="3"> |
|
|
|
<div class="item-row-content">12122</div> |
|
|
|
<div class="item-row-content">{{ item.projectName }}</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="11"> |
|
|
|
<el-col :span="9"> |
|
|
|
<div class="item-row-content"> |
|
|
|
<div>这是内容</div> |
|
|
|
<el-input v-if="item.edit" v-model="item.content"></el-input> |
|
|
|
<div v-else>{{ item.content }}</div> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="6"> |
|
|
|
<el-col :span="8"> |
|
|
|
<div class="item-row-content item-row-content2"> |
|
|
|
<div class="flex w-full title-2 h-full"> |
|
|
|
<div class="flex-1 text-center items-center pt-4 pb-4"> |
|
|
|
一般 |
|
|
|
<div class="w-33 text-center flex items-center p-10"> |
|
|
|
<el-input |
|
|
|
v-if="item.edit" |
|
|
|
v-model="item.sameGrade" |
|
|
|
></el-input> |
|
|
|
<div v-else class="word-break">{{ item.sameGrade }}</div> |
|
|
|
</div> |
|
|
|
<div class="flex-1 text-center items-center pt-4 pb-4"> |
|
|
|
较重 |
|
|
|
<div class="w-33 text-center flex items-center p-10"> |
|
|
|
<el-input |
|
|
|
v-if="item.edit" |
|
|
|
v-model="item.heavyGrade" |
|
|
|
></el-input> |
|
|
|
<div v-else class="word-break">{{ item.heavyGrade }}</div> |
|
|
|
</div> |
|
|
|
<div class="flex-1 text-center items-center pt-4 pb-4"> |
|
|
|
严重 |
|
|
|
<div class="flex-1 text-center flex items-center p-10"> |
|
|
|
<el-input |
|
|
|
v-if="item.edit" |
|
|
|
v-model="item.seriousGrade" |
|
|
|
></el-input> |
|
|
|
<div v-else class="word-break">{{ item.seriousGrade }}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
<el-col :span="2"> |
|
|
|
<div class="item-row-content"> |
|
|
|
<el-button type="text" v-if="index == 0">添加</el-button> |
|
|
|
<el-button type="text" v-else>修改</el-button> |
|
|
|
<el-button type="text">删除</el-button> |
|
|
|
<el-button |
|
|
|
type="text" |
|
|
|
v-if="index == questList.length - 1" |
|
|
|
@click="handleAddNewItem" |
|
|
|
>添加</el-button |
|
|
|
> |
|
|
|
<el-button type="text" v-if="!item.edit" @click="item.edit = true" |
|
|
|
>修改</el-button |
|
|
|
> |
|
|
|
<el-button type="text" v-else @click="handleSaveItem(item)" |
|
|
|
>保存</el-button |
|
|
|
> |
|
|
|
<el-button type="text" v-if="questList.length > 1" |
|
|
|
>删除</el-button |
|
|
|
> |
|
|
|
</div> |
|
|
|
</el-col> |
|
|
|
</el-row> |
|
|
|
@ -101,27 +130,109 @@ |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
<script> |
|
|
|
import { |
|
|
|
getSuperviseWayItemDetailsData, |
|
|
|
getSuperviseWayItemDetailsListData, |
|
|
|
addSuperviseWayItemDetailsItemData, |
|
|
|
updateSuperviseWayItemDetailsItemData, |
|
|
|
updateSuperviseWayItemData, |
|
|
|
} from "@/api/sluice"; |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
itemName: "", |
|
|
|
editTitle: false, |
|
|
|
title: "标题", |
|
|
|
searchVal: "", |
|
|
|
list: [ |
|
|
|
{ |
|
|
|
pro: "项目A", |
|
|
|
questions: ["问题描述111"], |
|
|
|
questionLevel: { |
|
|
|
1: "实例1", |
|
|
|
2: "实例2 ", |
|
|
|
3: "实例3", |
|
|
|
}, |
|
|
|
}, |
|
|
|
], |
|
|
|
questList: [], |
|
|
|
}; |
|
|
|
}, |
|
|
|
created() {}, |
|
|
|
methods: {}, |
|
|
|
created() { |
|
|
|
this.initData(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
initData() { |
|
|
|
getSuperviseWayItemDetailsData(this.$route.query.id).then((res) => { |
|
|
|
this.itemName = res?.data?.name; |
|
|
|
getSuperviseWayItemDetailsListData({ |
|
|
|
projectId: this.$route.query.id, |
|
|
|
}).then((res) => { |
|
|
|
this.questList = res.data.map((v) => { |
|
|
|
return { |
|
|
|
...v, |
|
|
|
edit: false, |
|
|
|
}; |
|
|
|
}); |
|
|
|
if (this.questList.length <= 0) { |
|
|
|
console.log("????"); |
|
|
|
this.questList.push({ |
|
|
|
projectName: this.itemName, |
|
|
|
content: "", |
|
|
|
sameGrade: "", |
|
|
|
heavyGrade: "", |
|
|
|
seriousGrade: "", |
|
|
|
edit: true, |
|
|
|
}); |
|
|
|
} |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
handleAddNewItem() { |
|
|
|
this.questList.push({ |
|
|
|
projectName: this.itemName, |
|
|
|
content: "", |
|
|
|
sameGrade: "", |
|
|
|
heavyGrade: "", |
|
|
|
seriousGrade: "", |
|
|
|
edit: true, |
|
|
|
}); |
|
|
|
}, |
|
|
|
handleSaveItem(item) { |
|
|
|
if (!item.content) { |
|
|
|
this.$message.warning("请填写问题描述"); |
|
|
|
return; |
|
|
|
} |
|
|
|
if (item.id) { |
|
|
|
updateSuperviseWayItemDetailsItemData({ |
|
|
|
...item, |
|
|
|
projectName: this.itemName, |
|
|
|
projectId: this.$route.query.id, |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
item.edit = false; |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
this.$message.error("修改失败"); |
|
|
|
}); |
|
|
|
} else { |
|
|
|
addSuperviseWayItemDetailsItemData({ |
|
|
|
...item, |
|
|
|
projectName: this.itemName, |
|
|
|
projectId: this.$route.query.id, |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
if (res.data) { |
|
|
|
item.id = res.data.id; |
|
|
|
} |
|
|
|
item.edit = false; |
|
|
|
}) |
|
|
|
.catch(() => { |
|
|
|
this.$message.error("保存失败"); |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
handleSaveTitle() { |
|
|
|
updateSuperviseWayItemData({ |
|
|
|
id: this.$route.query.id, |
|
|
|
name: this.itemName, |
|
|
|
}).then((res) => { |
|
|
|
this.$message.success("修改成功"); |
|
|
|
this.editTitle = !this.editTitle; |
|
|
|
this.questList.forEach((item) => { |
|
|
|
item.projectName = this.itemName; |
|
|
|
}); |
|
|
|
}); |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
<style scoped lang="scss"> |
|
|
|
@ -156,6 +267,9 @@ export default { |
|
|
|
padding: 10px; |
|
|
|
border: 1px solid #ccc; |
|
|
|
height: 100%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
flex-wrap: wrap; |
|
|
|
} |
|
|
|
.item-row-content2 { |
|
|
|
padding: 0; |
|
|
|
@ -166,10 +280,10 @@ export default { |
|
|
|
width: 100%; |
|
|
|
padding: 4px; |
|
|
|
text-align: center; |
|
|
|
border-bottom: 1px solid #ccc; |
|
|
|
border-bottom: 2px solid #ccc; |
|
|
|
} |
|
|
|
.title-2 { |
|
|
|
border-top: 1px solid #ccc; |
|
|
|
// border-top: 1px solid #ccc; |
|
|
|
& > *:nth-of-type(2) { |
|
|
|
border-left: 2px solid #ccc; |
|
|
|
border-right: 2px solid #ccc; |
|
|
|
@ -182,5 +296,12 @@ export default { |
|
|
|
.input { |
|
|
|
width: 200px; |
|
|
|
} |
|
|
|
.w-33 { |
|
|
|
width: 33%; |
|
|
|
} |
|
|
|
|
|
|
|
.color-333 { |
|
|
|
color: #333; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |
|
|
|
|
panyuyi
1 year ago