|
@@ -5,7 +5,8 @@
|
|
*/
|
|
*/
|
|
<template>
|
|
<template>
|
|
<div class='editModel'>
|
|
<div class='editModel'>
|
|
- <a-modal v-model='visible' :title='title' @ok='handleOk' ok-text='保存' cancel-text='取消' :maskClosable='false' :width='648'>
|
|
|
|
|
|
+ <a-modal v-model='visible' :title='title' :closable='false' :maskClosable='false' :width='648' :footer='null'>
|
|
|
|
+ <div class='edit-x' @click='handlCancel'>X</div>
|
|
<div class='edit_container' style='width:600px;height:156px'>
|
|
<div class='edit_container' style='width:600px;height:156px'>
|
|
<quill-editor
|
|
<quill-editor
|
|
v-model='remarksTexts'
|
|
v-model='remarksTexts'
|
|
@@ -17,6 +18,10 @@
|
|
></quill-editor>
|
|
></quill-editor>
|
|
<p class='p1'>{{valLen||remarksText.length}}/200</p>
|
|
<p class='p1'>{{valLen||remarksText.length}}/200</p>
|
|
</div>
|
|
</div>
|
|
|
|
+ <div class='edit-foot'>
|
|
|
|
+ <span @click='handlCancel'>取消</span>
|
|
|
|
+ <span @click='handleOk'>保存</span>
|
|
|
|
+ </div>
|
|
</a-modal>
|
|
</a-modal>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
@@ -44,6 +49,28 @@ export default {
|
|
...mapGetters(['remarksText'])
|
|
...mapGetters(['remarksText'])
|
|
},
|
|
},
|
|
methods: {
|
|
methods: {
|
|
|
|
+ // 点击取消
|
|
|
|
+ handlCancel() {
|
|
|
|
+ if (this.remarksTexts != this.remarksText) {
|
|
|
|
+ this.$confirm('是否保存编辑后的备注?', '提示', {
|
|
|
|
+ confirmButtonText: '保存',
|
|
|
|
+ cancelButtonText: '取消',
|
|
|
|
+ type: 'warning'
|
|
|
|
+ })
|
|
|
|
+ .then(() => {
|
|
|
|
+ this.handleOk()
|
|
|
|
+ })
|
|
|
|
+ .catch(() => {
|
|
|
|
+ this.$message({
|
|
|
|
+ type: 'info',
|
|
|
|
+ message: '已取消保存'
|
|
|
|
+ })
|
|
|
|
+ this.visible = false
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ this.visible = false
|
|
|
|
+ }
|
|
|
|
+ },
|
|
// val为传过来的备注
|
|
// val为传过来的备注
|
|
showModal() {
|
|
showModal() {
|
|
this.visible = true
|
|
this.visible = true
|
|
@@ -109,6 +136,17 @@ export default {
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|
|
<style lang="less" scoped>
|
|
<style lang="less" scoped>
|
|
|
|
+.editModel {
|
|
|
|
+}
|
|
|
|
+.edit-x {
|
|
|
|
+ position: absolute;
|
|
|
|
+ width: 9px;
|
|
|
|
+ height: 10px;
|
|
|
|
+ color: #000000;
|
|
|
|
+ right: 20px;
|
|
|
|
+ top: 20px;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+}
|
|
.edit_container {
|
|
.edit_container {
|
|
margin: 10px 0 0;
|
|
margin: 10px 0 0;
|
|
.p1 {
|
|
.p1 {
|
|
@@ -118,6 +156,35 @@ export default {
|
|
margin-bottom: 0;
|
|
margin-bottom: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
+.edit-foot {
|
|
|
|
+ height: 30px;
|
|
|
|
+ width: 100%;
|
|
|
|
+ margin-top: 20px;
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: flex-end;
|
|
|
|
+ padding-top: 10px;
|
|
|
|
+ span {
|
|
|
|
+ height: 32px;
|
|
|
|
+ line-height: 32px;
|
|
|
|
+ border-radius: 2px;
|
|
|
|
+ width: 65px;
|
|
|
|
+ text-align: center;
|
|
|
|
+ font-size: 14px;
|
|
|
|
+ font-family: PingFangSC-Regular, PingFang SC;
|
|
|
|
+ font-weight: 400;
|
|
|
|
+ cursor: pointer;
|
|
|
|
+ }
|
|
|
|
+ span:nth-of-type(1) {
|
|
|
|
+ background: rgba(255, 255, 255, 1);
|
|
|
|
+ border: 1px solid rgba(0, 0, 0, 0.15);
|
|
|
|
+ margin-right: 8px;
|
|
|
|
+ color: rgba(0, 0, 0, 0.65);
|
|
|
|
+ }
|
|
|
|
+ span:nth-of-type(2) {
|
|
|
|
+ color: rgba(255, 255, 255, 1);
|
|
|
|
+ background: linear-gradient(180deg, rgba(54, 156, 247, 1) 0%, rgba(2, 91, 170, 1) 100%);
|
|
|
|
+ }
|
|
|
|
+}
|
|
.quill-editor {
|
|
.quill-editor {
|
|
height: 130px;
|
|
height: 130px;
|
|
}
|
|
}
|