4521af90 by 任超
2 parents 71050940 0edf2a93
<template>
<dialogBox title="新增系统通知" @submitForm="submitForm" saveButton="保存" :isFullscreen="false" width="60%"
@closeDialog="closeDialog" v-model="value">
<dialogBox
title="新增系统通知"
@submitForm="submitForm"
saveButton="保存"
:isFullscreen="false"
width="60%"
@closeDialog="closeDialog"
v-model="value"
>
<el-form ref="ruleForm" :model="ruleForm" label-width="100px" :rules="rules">
<el-row>
<el-col :span="12">
......@@ -21,14 +28,14 @@
<el-form-item label="通知内容:" prop="noticeContent">
<quill-editor
v-model="ruleForm.noticeContent"
class="editor ql-editor"
ref="myQuillEditor"
:options="editorOption"
@blur="onEditorBlur($event)"
@focus="onEditorFocus($event)"
@change="onEditorChange($event)"
@ready="onEditorReady($event)"
>
</quill-editor>
></quill-editor>
<!-- <el-input v-model="ruleForm.noticeContent" type="textarea" :rows="16"></el-input> -->
</el-form-item>
</el-col>
......@@ -36,8 +43,14 @@
<el-row>
<el-col :span="8">
<el-form-item label="附件:" prop="noticeFileUrl">
<el-upload action="" multiple :auto-upload="false" :limit="1"
:on-change="handleChange" :before-upload="beforeUpload">
<el-upload
action
multiple
:auto-upload="false"
:limit="1"
:on-change="handleChange"
:before-upload="beforeUpload"
>
<el-button icon="el-icon-upload" type="primary">上传</el-button>
<div slot="tip" class="el-upload__tip">文件大小不超过20MB</div>
</el-upload>
......@@ -45,10 +58,16 @@
</el-col>
</el-row>
<div v-show="false">
<el-upload action="" multiple :auto-upload="false"
:on-change="RichTexthandleChange" :before-upload="beforeUpload" class="richUpload">
<el-button icon="el-icon-upload" type="primary">上传</el-button>
<div slot="tip" class="el-upload__tip">文件大小不超过20MB</div>
<el-upload
action
multiple
:auto-upload="false"
:on-change="RichTexthandleChange"
:before-upload="beforeUpload"
class="richUpload"
>
<el-button icon="el-icon-upload" type="primary">上传</el-button>
<div slot="tip" class="el-upload__tip">文件大小不超过20MB</div>
</el-upload>
</div>
</el-form>
......@@ -56,35 +75,35 @@
</template>
<script>
import { addSysNotice } from "@/api/notice.js"
import { upload } from "@/api/system.js"
import { addSysNotice } from "@/api/notice.js";
import { upload } from "@/api/system.js";
import { quillEditor } from "vue-quill-editor";
export default {
props: {
value: { type: Boolean, default: false },
value: { type: Boolean, default: false }
},
components: { quillEditor },
data () {
data() {
return {
ruleForm: {
noticeTitle: '',
noticeContent: '',
noticeFileUrl: '',
noticeSource: '',
noticeType: '1'
noticeTitle: "",
noticeContent: "",
noticeFileUrl: "",
noticeSource: "",
noticeType: "1"
},
rules: {
noticeTitle: [
{ required: true, message: '请输入通知标题', trigger: 'blur' }
{ required: true, message: "请输入通知标题", trigger: "blur" }
],
noticeContent: [
{ required: true, message: '请输入通知内容', trigger: 'blur' }
{ required: true, message: "请输入通知内容", trigger: "blur" }
],
noticeSource: [
{ required: true, message: '请输入通知来源', trigger: 'blur' }
{ required: true, message: "请输入通知来源", trigger: "blur" }
]
},
// 富文本编辑器配置
// 富文本编辑器配置
editorOption: {
theme: "snow", // or 'bubble'
modules: {
......@@ -97,66 +116,76 @@ export default {
[{ script: "sub" }, { script: "super" }], // 上标/下标
[{ indent: "-1" }, { indent: "+1" }], // 缩进
[{ direction: "rtl" }], // 文本方向
[{ size: ['small', false, 'large', 'huge'] }], // 字体大小
[{ size: ["small", false, "large", "huge"] }], // 字体大小
[{ header: [1, 2, 3, 4, 5, 6] }], // 标题
[{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色
// [{ font: ['songti'] }], // 字体种类
[{ align: [] }], // 对齐方式
["clean"], // 清除文本格式
["image", "video"], // 链接、图片、视频
["image", "video"] // 链接、图片、视频
],
handlers: {
image: function(value) {
if (value) {
// 用upload的点击事件代替文本编辑器的图片上传事件
document.querySelector('.richUpload input').click();
} else {
this.quill.format('image', false);
}
handlers: {
image: function(value) {
if (value) {
// 用upload的点击事件代替文本编辑器的图片上传事件
document.querySelector(".richUpload input").click();
} else {
this.quill.format("image", false);
}
}
}
}
},
placeholder: "请输入正文",
},
}
placeholder: "请输入正文"
}
};
},
mounted() {
// 自定义粘贴图片功能
let quill = this.$refs.myQuillEditor.quill;
quill.root.addEventListener("paste",evt => {
console.log(1111);
if (evt.clipboardData && evt.clipboardData.files &&evt.clipboardData.files.length) {
console.log(2222);
evt.preventDefault();
[].forEach.call(evt.clipboardData.files, file => {
console.log(33333);
if (!file.type.match(/^image\/(gif|jpe?g|a?png|bmp)/i)) {
return;
}
console.log(4444);
this.RichTexthandleChange(File);
});
}
},
false
);
watch: {
value(val) {
if (val) {
let that = this
this.$nextTick(() => {
let quill = this.$refs.myQuillEditor.quill;
this.$forceUpdate();
quill.root.addEventListener(
"paste",
evt => {
if (
evt.clipboardData &&
evt.clipboardData.files &&
evt.clipboardData.files.length
) {
evt.preventDefault();
[].forEach.call(evt.clipboardData.files, file => {
if (!file.type.match(/^image\/(gif|jpe?g|a?png|bmp)/i)) {
return;
}
that.clipboardPictureChange(file);
});
}
},
false
);
});
}
}
},
mounted() {},
methods: {
submitForm () {
submitForm() {
let that = this;
that.$refs.ruleForm.validate(valid => {
if (valid) {
addSysNotice(this.ruleForm).then(res => {
if (res.code == 200) {
this.$message.success('保存成功')
this.$message.success("保存成功");
this.$emit("input", false);
this.resetRuleForm();
this.$parent.queryClick();
} else {
this.$message.error(res.message)
this.$message.error(res.message);
}
})
});
} else {
// console.log('error submit!!');
return false;
......@@ -164,31 +193,38 @@ export default {
});
},
//关闭窗口
closeDialog () {
closeDialog() {
this.$emit("input", false);
this.resetRuleForm();
},
//
resetRuleForm () {
this.$refs['ruleForm'].resetFields();
this.ruleForm.noticeType = '1'
resetRuleForm() {
this.$refs["ruleForm"].resetFields();
this.ruleForm.noticeType = "1";
},
beforeUpload (file) {
return true
beforeUpload(file) {
return true;
},
//附件上传事件
async handleChange (file) {
async handleChange(file) {
var formdata = new FormData();
formdata.append("file", file.raw);
upload(formdata).then(res => {
this.ruleForm.noticeFileUrl = res.message
})
this.ruleForm.noticeFileUrl = res.message;
});
},
//富文本图片上传事件
async RichTexthandleChange (file) {
RichTexthandleChange(file) {
this.uploadPicture(file.raw)
},
//图片粘贴事件
clipboardPictureChange(file) {
this.uploadPicture(file)
},
uploadPicture(file){
let that = this;
var formdata = new FormData();
formdata.append("file", file.raw);
formdata.append("file", file);
upload(formdata).then(res => {
//editor对象
const quill = that.$refs.myQuillEditor.quill;
......@@ -196,11 +232,11 @@ export default {
// 获取光标所在位置
const length = quill.selection.savedRange.index;
// 插入图片
quill.insertEmbed(length, 'image', res.message);
quill.insertEmbed(length, "image", res.message);
// 调整光标到最后
quill.setSelection(length + 1);
//that.quillUpdateImg = false;
})
});
},
onSubmit() {
//console.log("submit!");
......@@ -221,9 +257,9 @@ export default {
onEditorChange({ quill, html, text }) {
//console.log("editor change!", quill, html, text);
//this.content = html;
},
}
}
}
};
</script>
<style scoped lang="scss">
// .ql-editor{
......@@ -232,5 +268,5 @@ export default {
/deep/.ql-editor {
padding: 0px;
height: 500px;
}
}
</style>
\ No newline at end of file
......
......@@ -38,6 +38,9 @@ export function getForm(tabName, djywbm) {
case "diyaqSlxx":
form = require("@/views/ywbl/diyaq/slxx.vue");
break;
case "diyaqSlxx200":
form = require("@/views/ywbl/diyaq/slxx200.vue");
break;
case "clxx":
form = require("@/views/workflow/components/clxx.vue");
break;
......
<template>
<!-- 受理信息 -->
<div class="slxx">
<el-form
:model="ruleForm"
:rules="rules"
ref="ruleForm"
:label-position="flag ? 'top' : ''"
:inline="flag"
label-width="140px"
>
<div class="slxx_con">
<div class="slxx_title title-block">
受理信息200
<div class="triangle"></div>
</div>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="业务号:">
<el-input disabled v-model="ruleForm.slywxx.ywh"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="受理人员:">
<el-input disabled v-model="ruleForm.slywxx.slry"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="受理时间:">
<el-input disabled v-model="ruleForm.slywxx.slsj"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="权利类型:"
prop="qllx"
>
<el-input disabled v-model="ruleForm.slywxx.qllxmc"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="登记类型:"
prop="djlx"
>
<el-input disabled v-model="ruleForm.slywxx.djlxmc"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="登记情形:"
prop="djqx"
>
<el-input disabled v-model="ruleForm.slywxx.djqxmc"></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="slxx_title title-block">
抵押不动产情况
<div class="triangle"></div>
</div>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="权利人:">
<el-input disabled v-model="ruleForm.qlxxold.qlrmc"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="证件号:">
<el-input disabled v-model="ruleForm.qlxxold.qlrzjhm"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="证件种类:">
<el-input disabled v-model="ruleForm.qlxxold.qlrzjzl"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="不动产权证号:"
>
<el-input disabled v-model="ruleForm.slywxx.ybdcqzsh"></el-input>
</el-form-item>
</el-col>
<el-col :span="16">
<el-form-item :class="flag ? 'marginBot0' : ''" label="坐落:">
<el-input disabled v-model="ruleForm.qlxxold.zl"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="用途:">
<el-input disabled v-model="ruleForm.qlxxold.ytmc"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="不动产单元号:"
>
<el-input disabled v-model="ruleForm.qlxxold.bdcdyh"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="面积:">
<el-input disabled v-model="ruleForm.qlxxold.mj"></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="slxx_title title-block">
抵押信息
<div class="triangle"></div>
</div>
<el-row :gutter="10">
<el-col :span="8">
<el-form-item :class="flag ? 'marginBot0' : ''" label="抵押方式:">
<!-- <el-input disabled v-model="ruleForm.slywxx.djqxmc"></el-input> -->
<el-radio-group disabled v-model="ruleForm.diyaq.dyfs">
<el-radio label="1">一般抵押</el-radio>
<el-radio label="2">最高额抵押</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="16">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="是否存在禁止或者限制转让抵押不动产的约定:"
label-width="350px"
>
<el-radio-group v-model="ruleForm.diyaq.sfczjzhxz">
<el-radio label="1">启用</el-radio>
<el-radio label="0">禁用</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="10">
<el-col :span="8" v-show="ruleForm.diyaq.dyfs==1">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="被担保主债权数额:"
>
<el-input v-model="ruleForm.diyaq.bdbzzqse"></el-input>
</el-form-item>
</el-col>
<el-col :span="8" v-show="ruleForm.diyaq.dyfs==2">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="最高债权额:"
>
<el-input v-model="ruleForm.diyaq.zgzqse"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="债务履行起始时间:"
>
<el-date-picker v-model="ruleForm.diyaq.zwlxqssj" type="date">
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="债务履行结束时间:"
>
<el-date-picker v-model="ruleForm.diyaq.zwlxjssj" type="date">
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item :class="flag ? 'marginBot0' : ''" label="担保范围:">
<el-input v-model="ruleForm.diyaq.dbfw"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item :class="flag ? 'marginBot0' : ''" label="最高债权确定事实和数额:" label-width="200px">
<el-input v-model="ruleForm.diyaq.zgzqqdss"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row >
<el-col>
<el-form-item :class="flag ? 'marginBot0' : ''" label="附记:" prop="fj">
<el-input type="textarea" v-model="ruleForm.diyaq.fj" :disabled="$route.query.viewtype==1"></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="slxx_title title-block">
抵押权人信息
<div class="triangle"></div>
</div>
<el-row :gutter="10">
<el-col :span="14">
<el-form-item :class="flag ? 'marginBot0' : ''" label="共有方式:">
<el-radio-group
:disabled="$route.query.viewtype == 1"
v-model="ruleForm.slywxx.gyfs"
>
<el-radio label="0">单独所有</el-radio>
<el-radio label="1">共同共有</el-radio>
<el-radio label="2">按份所有</el-radio>
<el-radio label="3">其它共有</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="5" v-show="ruleForm.gyfs == '2'">
<el-form-item
:class="flag ? 'marginBot0' : ''"
label="是否分别持证:"
>
<el-radio-group v-model="ruleForm.slywxx.sffbcz">
<el-radio label="1"></el-radio>
<el-radio label="0"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="5" v-show="ruleForm.gyfs == '2'">
<el-form-item :class="flag ? 'marginBot0' : ''" label="持证人:">
<el-select v-model="ruleForm.czr" placeholder="持证人">
<el-option
v-for="item in czrOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<InformationTable
:tableData="ruleForm.qlrList"
@upDateQlrxxList="upDateQlrxxList"
:viewtype="$route.query.viewtype"
:gyfs="ruleForm.slywxx.gyfs"
/>
<div class="slxx_title title-block">
抵押人信息
<div class="triangle"></div>
</div>
<InformationTable
:tableData="ruleForm.ywrList"
@upDateQlrxxList="upDateYwrxxList"
:viewtype="$route.query.viewtype"
/>
<div class="slxx_title title-block">
登记原因
<div class="triangle"></div>
</div>
<el-row :gutter="10">
<el-col>
<el-form-item :class="flag ? 'marginBot0' : ''" label="登记原因:" prop="djyy">
<el-input class="textArea" type="textarea" :disabled="$route.query.viewtype==1" v-model="ruleForm.diyaq.djyy">
</el-input>
</el-form-item>
</el-col>
</el-row>
</div>
<el-row class="btn" v-if="!$route.query.viewtype">
<el-form-item :class="flag ? 'marginBot0' : ''">
<el-button type="primary" @click="onSubmitClick()">保存</el-button>
</el-form-item>
</el-row>
</el-form>
</div>
</template>
<script>
import InformationTable from "@/views/workflow/components/InformationTable";
import { Init, saveData } from "@/api/diyaqFlow.js";
import { mapGetters } from "vuex";
export default {
async created() {
this.propsParam = this.$attrs;
var formdata = new FormData();
formdata.append("bsmSldy", this.propsParam.bsmSldy);
formdata.append("bsmSlsq", this.$route.query.bsmSlsq);
formdata.append("djlx", this.propsParam.djlx);
Init(formdata).then((res) => {
if (res.code === 200 && res.result) {
this.ruleForm = res.result;
}
});
},
components: { InformationTable },
computed: {
...mapGetters(["dictData", "flag"]),
},
data() {
return {
disabled: true,
czrOptions: [],
ruleForm: {
slywxx: {},
qlxxold: {},
diyaq: {},
gyfs: "",
},
//传递参数
propsParam: {},
rules: {},
};
},
methods: {
// list(bsmSldy) {
// Init({
// bsmSldy: bsmSldy.split(","),
// }).then((res) => {
// if (res.code === 200 && res.result) {
// this.ruleForm = {
// ...res.result,
// ...res.result.zdjbxxdatas,
// ...res.result.qlxxdatas,
// ...res.result.jsydsyqdatas,
// };
// }
// });
// },
onSubmitClick() {
saveData(this.ruleForm).then((res) => {
if (res.code === 200) {
this.$message({
showClose: true,
message: "保存成功!",
type: "success",
});
} else {
this.$message({
showClose: true,
message: res.message,
type: "error",
});
}
});
},
// 更新权利人信息
upDateQlrxxList(val) {
this.ruleForm.qlrList = _.cloneDeep(val);
},
// 更新义务人信息
upDateYwrxxList(val) {
this.ruleForm.ywrList = _.cloneDeep(val);
},
},
};
</script>
<style scoped lang='scss'>
@import "~@/styles/public.scss";
@import "~@/styles/slxx/slxx.scss";
</style>
......@@ -166,6 +166,7 @@ export default {
});
},
handleSelectionChange(val) {
debugger;
val.forEach((item, index) => {
item.bsmSsql = item.bsmQlxx;
item.ybdcqzsh = item.bdcqzh;
......
......@@ -157,6 +157,7 @@ export default {
message: "发起申请成功",
type: "success",
});
debugger;
if (!this.isJump) {
this.jump(res.result, this.djywbm);
} else {
......@@ -168,6 +169,7 @@ export default {
});
},
handleSelectionChange(val) {
debugger;
val.forEach((item, index) => {
item.bsmSsql = item.bsmQlxx;
item.ybdcqzsh = item.bdcqzh;
......