elink-star
/
epmet-oper-gov
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

还有党建声音也改了

dev-天地图
dai 3 years ago
parent
1332ca92a0
commit
0c4eadcbf4
1 changed files with 234 additions and 191 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 425
      src/views/modules/cpts/base/cpts/edit.vue

425
src/views/modules/cpts/base/cpts/edit.vue
View File

@ -1,205 +1,235 @@
<template> <template>
<div> <div>
<div class="dialog-h-content scroll-h"> <div class="dialog-h-content scroll-h">
<el-form v-if="iniLoaded" <el-form
ref="ref_form" v-if="iniLoaded"
:model="fmData" ref="ref_form"
:inline="true" :model="fmData"
:disabled="formType === 'watch'" :inline="true"
class="m-fm" :disabled="formType === 'watch'"
:class="{ 'z-div': editParamsDiv, 'z-watch': formType === 'watch' }"> class="m-fm"
:class="{ 'z-div': editParamsDiv, 'z-watch': formType === 'watch' }"
>
<div class="list"> <div class="list">
<el-form-item v-for="item in editParams" <el-form-item
class="item" v-for="item in editParams"
label-width="140px" class="item"
style="display: block" label-width="140px"
:key="'edit' + item.keyName" style="display: block"
:label="item.field" :key="'edit' + item.keyName"
:prop="item.keyName" :label="item.field"
:rules="item.rules || []"> :prop="item.keyName"
:rules="item.rules || []"
>
<template v-if="item.type == 'switch'"> <template v-if="item.type == 'switch'">
<el-switch v-model="fmData[item.keyName]" <el-switch
size="small" v-model="fmData[item.keyName]"
:active-text="item.activeText || ''" size="small"
:inactive-text="item.inactiveText || ''" :active-text="item.activeText || ''"
:active-value="item.activeValue || true" :inactive-text="item.inactiveText || ''"
:inactive-value="item.inactiveValue || false"> :active-value="item.activeValue || true"
:inactive-value="item.inactiveValue || false"
>
</el-switch> </el-switch>
</template> </template>
<template v-if="item.type == 'input'"> <template v-if="item.type == 'input'">
<el-input v-if=" <el-input
v-if="
formType == 'add' || (formType == 'edit' && !item.editDisable) formType == 'add' || (formType == 'edit' && !item.editDisable)
" "
v-model="fmData[item.keyName]" v-model="fmData[item.keyName]"
class="item-input" class="item-input"
size="small" size="small"
clearable clearable
show-word-limit show-word-limit
:maxlength="item.maxlength || ''" :maxlength="item.maxlength || ''"
:placeholder="item.placeholder || '请输入'"> :placeholder="item.placeholder || '请输入'"
>
</el-input> </el-input>
<div class="item-show" <div class="item-show" v-else>
v-else>
{{ fmData[item.keyName] || "--" }} {{ fmData[item.keyName] || "--" }}
<span v-if="item.attach">{{item.attach}}</span> <span v-if="item.attach">{{ item.attach }}</span>
</div> </div>
</template> </template>
<template v-if="item.type == 'textarea'"> <template v-if="item.type == 'textarea'">
<el-input v-if=" <el-input
v-if="
formType == 'add' || (formType == 'edit' && !item.editDisable) formType == 'add' || (formType == 'edit' && !item.editDisable)
" "
v-model="fmData[item.keyName]" v-model="fmData[item.keyName]"
type="textarea" type="textarea"
class="item-input" class="item-input"
size="small" size="small"
clearable clearable
show-word-limit show-word-limit
:rows="3" :rows="3"
:maxlength="item.maxlength || ''" :maxlength="item.maxlength || ''"
:placeholder="item.placeholder || '请输入'"> :placeholder="item.placeholder || '请输入'"
>
</el-input> </el-input>
<div class="item-show" <div class="item-show" v-else>
v-else>
{{ fmData[item.keyName] || "--" }} {{ fmData[item.keyName] || "--" }}
</div> </div>
</template> </template>
<template v-if="item.type == 'date'"> <template v-if="item.type == 'date'">
<el-date-picker v-if=" <el-date-picker
v-if="
formType == 'add' || (formType == 'edit' && !item.editDisable) formType == 'add' || (formType == 'edit' && !item.editDisable)
" "
v-model="fmData[item.keyName]" v-model="fmData[item.keyName]"
:picker-options="item.pickerOptions" :picker-options="item.pickerOptions"
class="item-input" class="item-input"
size="small" size="small"
clearable clearable
show-word-limit show-word-limit
:value-format="item.format || 'yyyy-MM-dd'" :value-format="item.format || 'yyyy-MM-dd'"
:placeholder="item.placeholder || '请输入'"> :placeholder="item.placeholder || '请输入'"
>
</el-date-picker> </el-date-picker>
<div class="item-show" <div class="item-show" v-else>
v-else>
{{ fmData[item.keyName] || "--" }} {{ fmData[item.keyName] || "--" }}
</div> </div>
</template> </template>
<template v-if="item.type == 'number'"> <template v-if="item.type == 'number'">
<el-input-number v-if=" <el-input-number
v-if="
formType == 'add' || (formType == 'edit' && !item.editDisable) formType == 'add' || (formType == 'edit' && !item.editDisable)
" "
v-model="fmData[item.keyName]" v-model="fmData[item.keyName]"
class="item-number" class="item-number"
size="small" size="small"
clearable clearable
:precision="item.precision || 0" :precision="item.precision || 0"
:step="item.step || 1" :step="item.step || 1"
:min="item.min || 0" :min="item.min || 0"
:max="item.max || 999999999999" :max="item.max || 999999999999"
:placeholder="item.placeholder || '请输入'"> :placeholder="item.placeholder || '请输入'"
>
</el-input-number> </el-input-number>
<span class="item-show" <span class="item-show" v-else>
v-else>
{{ fmData[item.keyName] || "--" }} {{ fmData[item.keyName] || "--" }}
</span> </span>
<span v-if="item.unitName">（{{ item.unitName }}）</span> <span v-if="item.unitName">（{{ item.unitName }}）</span>
</template> </template>
<template v-else-if="item.type == 'select'"> <template v-else-if="item.type == 'select'">
<el-select v-model="fmData[item.keyName]" <el-select
:placeholder="item.placeholder || '请选择'" v-model="fmData[item.keyName]"
size="small" :placeholder="item.placeholder || '请选择'"
clearable size="small"
class="item-select" clearable
:multiple="item.multiple || false" class="item-select"
:filterable="item.filterable || false" :multiple="item.multiple || false"
:allowCreate="item.allowCreate || false" :filterable="item.filterable || false"
:collapse-tags="item.collapseTags || false" :allowCreate="item.allowCreate || false"
default-first-option :collapse-tags="item.collapseTags || false"
@change="(e) => handleChangeSelect(e, item)"> default-first-option
@change="(e) => handleChangeSelect(e, item)"
>
<template v-if="item.optionType == 'group'"> <template v-if="item.optionType == 'group'">
<el-option-group v-for="group in item.optionList" <el-option-group
:key="group.label" v-for="group in item.optionList"
:label="group.label"> :key="group.label"
<el-option v-for="subItem in group.optionList" :label="group.label"
:key="subItem.value" >
:label="subItem.label" <el-option
:value="subItem.value"> v-for="subItem in group.optionList"
:key="subItem.value"
:label="subItem.label"
:value="subItem.value"
>
</el-option> </el-option>
</el-option-group> </el-option-group>
</template> </template>
<template v-else> <template v-else>
<el-option v-for="(subItem, subIndex) in item.optionList" <el-option
:key="subItem.value + subIndex" v-for="(subItem, subIndex) in item.optionList"
:label="subItem.label" :key="subItem.value + subIndex"
:value="subItem.value"> :label="subItem.label"
:value="subItem.value"
>
</el-option> </el-option>
</template> </template>
</el-select> </el-select>
</template> </template>
<template v-else-if="item.type == 'rich-text'"> <template v-else-if="item.type == 'rich-text'">
<div v-if=" <div
v-if="
formType == 'add' || (formType == 'edit' && !item.editDisable) formType == 'add' || (formType == 'edit' && !item.editDisable)
" "
class="item-rich-text"> class="item-rich-text"
<Tinymce :ref="'richText' + item.keyName" >
v-model="fmData[item.keyName]" <Tinymce
:customerId="customerId" :ref="'richText' + item.keyName"
:placeholder="item.placeholder || '请输入'" v-model="fmData[item.keyName]"
:height="500" /> :customerId="customerId"
:placeholder="item.placeholder || '请输入'"
:height="500"
/>
</div> </div>
<div v-else <div
class="item-rich-text z-show" v-else
@click="handleClickHtmlNode"> class="item-rich-text z-show"
@click="handleClickHtmlNode"
>
<div v-html="fmData[item.keyName]"></div> <div v-html="fmData[item.keyName]"></div>
</div> </div>
</template> </template>
<template v-else-if="item.type == 'cascader'"> <template v-else-if="item.type == 'cascader'">
<el-cascader v-model="fmData[item.keyName]" <el-cascader
:placeholder="item.placeholder || '请选择'" v-model="fmData[item.keyName]"
:options="item.optionList" :placeholder="item.placeholder || '请选择'"
:props="item.optionProps || {}" :options="item.optionList"
:show-all-levels="false" :props="item.optionProps || {}"
:collapse-tags="item.collapseTags || false" :show-all-levels="false"
size="small" :collapse-tags="item.collapseTags || false"
clearable size="small"
class="item-select" clearable
@change="(e) => handleChangeCascader(e, item)"> class="item-select"
@change="(e) => handleChangeCascader(e, item)"
>
</el-cascader> </el-cascader>
</template> </template>
<template v-else-if="item.type == 'upload'"> <template v-else-if="item.type == 'upload'">
<el-upload :headers="$getElUploadHeaders()" <el-upload
v-if=" :headers="$getElUploadHeaders()"
v-if="
formType == 'add' || (formType == 'edit' && !item.editDisable) formType == 'add' || (formType == 'edit' && !item.editDisable)
" "
ref="upload" ref="upload"
class="avatar-uploader" class="avatar-uploader"
:class="{ 'z-full': fmData[item.keyName].length >= item.limit }" :class="{ 'z-full': fmData[item.keyName].length >= item.limit }"
:action="item.uploadUrl || uploadUrl" :action="item.uploadUrl || uploadUrl"
:data="{ customerId: customerId }" :data="{ customerId: customerId }"
:show-file-list="true" :show-file-list="true"
:list-type="item.listType || 'picture'" :list-type="item.listType || 'picture'"
:limit="item.limit || 100" :limit="item.limit || 100"
:file-list="fmData[item.keyName]" :file-list="fmData[item.keyName]"
:on-success="(res, file) => handleImgSuccess(res, file, item)" :on-success="(res, file) => handleImgSuccess(res, file, item)"
:on-error="(res, file) => handleImgError(res, file, item)" :on-error="(res, file) => handleImgError(res, file, item)"
:on-remove="(res) => handleImgRemove(res, item)" :on-remove="(res) => handleImgRemove(res, item)"
:on-exceed="(res) => handleImgExceed(res, item)" :on-exceed="(res) => handleImgExceed(res, item)"
:before-upload="(file) => beforeImgUpload(file, item)"> :before-upload="(file) => beforeImgUpload(file, item)"
>
<a><i class="el-icon-plus"></i> 点击上传</a> <a><i class="el-icon-plus"></i> 点击上传</a>
</el-upload> </el-upload>
<el-image v-else-if="fmData[item.keyName].length > 0" <el-image
style="width: 100px; height: 100px" v-else-if="fmData[item.keyName].length > 0"
:src="fmData[item.keyName][0].url" style="width: 100px; height: 100px"
fit="cover" :src="fmData[item.keyName][0].url"
:preview-src-list="fmData[item.keyName].map((item) => item.url)"></el-image> fit="cover"
:preview-src-list="fmData[item.keyName].map((item) => item.url)"
></el-image>
<span v-else>--</span> <span v-else>--</span>
</template> </template>
@ -239,16 +269,20 @@
<div id="app_base" class="div_map"></div> <div id="app_base" class="div_map"></div>
<div style="margin-top: 10px" v-show="false"> <div style="margin-top: 10px" v-show="false">
<span>经度</span> <span>经度</span>
<el-input class="address-item-input2" <el-input
maxlength="50" class="address-item-input2"
placeholder="请输入经度" maxlength="50"
v-model="fmData[item.supKeys[0]]"> placeholder="请输入经度"
v-model="fmData[item.supKeys[0]]"
>
</el-input> </el-input>
<span style="margin-left: 20px">纬度</span> <span style="margin-left: 20px">纬度</span>
<el-input class="address-item-input2" <el-input
maxlength="50" class="address-item-input2"
placeholder="请输入纬度" maxlength="50"
v-model="fmData[item.supKeys[1]]"> placeholder="请输入纬度"
v-model="fmData[item.supKeys[1]]"
>
</el-input> </el-input>
</div> </div>
</div> </div>
@ -275,44 +309,52 @@
</div> </div>
</el-form> </el-form>
<div class="div_btn resi-btns" <div class="div_btn resi-btns" v-if="!formBtnFixed">
v-if="!formBtnFixed"> <el-button size="small" @click="handleCancle">{{
<el-button size="small"
@click="handleCancle">{{
editConfig.cancelBtnName || "取消" editConfig.cancelBtnName || "取消"
}}</el-button> }}</el-button>
<el-button v-if="formType != 'watch'" <el-button
type="primary" v-if="formType != 'watch'"
size="small" type="primary"
:disabled="btnDisable" size="small"
@click="handleComfirm">{{ editConfig.confirmBtnName || "确定" }}</el-button> :disabled="btnDisable"
<slot name="operateSup" @click="handleComfirm"
v-bind:id="formId" >{{ editConfig.confirmBtnName || "确定" }}</el-button
v-bind:info="fmData" >
v-bind:formType="formType"></slot> <slot
name="operateSup"
v-bind:id="formId"
v-bind:info="fmData"
v-bind:formType="formType"
></slot>
</div> </div>
<slot name="bottomSup" <slot
v-bind:id="formId" name="bottomSup"
v-bind:info="fmData" v-bind:id="formId"
v-bind:formType="formType"></slot> v-bind:info="fmData"
v-bind:formType="formType"
></slot>
</div> </div>
<div class="div_btn resi-btns" <div class="div_btn resi-btns" v-if="formBtnFixed">
v-if="formBtnFixed"> <el-button size="small" @click="handleCancle">{{
<el-button size="small"
@click="handleCancle">{{
editConfig.cancelBtnName || "取消" editConfig.cancelBtnName || "取消"
}}</el-button> }}</el-button>
<el-button v-if="formType != 'watch'" <el-button
type="primary" v-if="formType != 'watch'"
size="small" type="primary"
:disabled="btnDisable" size="small"
@click="handleComfirm">{{ editConfig.confirmBtnName || "确定" }}</el-button> :disabled="btnDisable"
<slot name="operateSup" @click="handleComfirm"
v-bind:id="formId" >{{ editConfig.confirmBtnName || "确定" }}</el-button
v-bind:info="fmData" >
v-bind:formType="formType"></slot> <slot
name="operateSup"
v-bind:id="formId"
v-bind:info="fmData"
v-bind:formType="formType"
></slot>
</div> </div>
</div> </div>
</template> </template>
@ -385,7 +427,7 @@ export default {
}, },
}, },
data () { data() {
return { return {
iniLoaded: false, iniLoaded: false,
loading: false, loading: false,
@ -407,19 +449,19 @@ export default {
computed: {}, computed: {},
watch: { watch: {
editParams: { editParams: {
handler () { handler() {
this.computeFmData(); this.computeFmData();
}, },
deep: true, deep: true,
}, },
}, },
async mounted () { async mounted() {
this.initForm(); this.initForm();
}, },
methods: { methods: {
async initForm () { async initForm() {
this.iniFmData(); this.iniFmData();
if (this.formId && this.formType != "add") { if (this.formId && this.formType != "add") {
@ -427,11 +469,11 @@ export default {
} }
}, },
computeFmData () { computeFmData() {
console.log(this.fmData); console.log(this.fmData);
}, },
iniFmData () { iniFmData() {
const { editParams, fmData, editParamsDiv } = this; const { editParams, fmData, editParamsDiv } = this;
editParams.forEach((item, index) => { editParams.forEach((item, index) => {
if (typeof item.value == "function") { if (typeof item.value == "function") {
@ -503,7 +545,7 @@ export default {
this.iniLoaded = true; this.iniLoaded = true;
}, },
handleClickHtmlNode (e) { handleClickHtmlNode(e) {
//在判断事件目标节点的时候，考虑到兼容性应该统一转换成大写或小写进行判断 //在判断事件目标节点的时候，考虑到兼容性应该统一转换成大写或小写进行判断
if (e.target.localName.toLowerCase() === "a") { if (e.target.localName.toLowerCase() === "a") {
// 通过判端目标节点以后，就能在这里对其进行操作啦。 // 通过判端目标节点以后，就能在这里对其进行操作啦。
@ -512,7 +554,7 @@ export default {
} }
}, },
async getFmOptions (index, url, params, cookFn) { async getFmOptions(index, url, params, cookFn) {
const { data, code, msg } = await requestPost(url, { const { data, code, msg } = await requestPost(url, {
...params, ...params,
}); });
@ -525,13 +567,13 @@ export default {
} }
}, },
handleChangeCascader (vals, item) { handleChangeCascader(vals, item) {
this.fmData[item["keyName"]] = vals; this.fmData[item["keyName"]] = vals;
if (typeof item.handleChangeFn == "function") { if (typeof item.handleChangeFn == "function") {
item.handleChangeFn(vals, item, this); item.handleChangeFn(vals, item, this);
} }
}, },
handleChangeSelect (vals, item) { handleChangeSelect(vals, item) {
console.log(vals, item); console.log(vals, item);
this.fmData[item["keyName"]] = vals; this.fmData[item["keyName"]] = vals;
if (typeof item.handleChangeFn == "function") { if (typeof item.handleChangeFn == "function") {
@ -539,14 +581,14 @@ export default {
} }
}, },
beforeImgUpload (file, item) { beforeImgUpload(file, item) {
if (typeof item.beforeImgUpload == "function") { if (typeof item.beforeImgUpload == "function") {
if (!item.beforeImgUpload(file, item, this)) return false; if (!item.beforeImgUpload(file, item, this)) return false;
} }
return true; return true;
}, },
handleImgRemove (file, item) { handleImgRemove(file, item) {
console.log("handleImgRemove", file); console.log("handleImgRemove", file);
let url = file.response ? file.response.data.url : file.url; let url = file.response ? file.response.data.url : file.url;
if (url) { if (url) {
@ -568,7 +610,7 @@ export default {
} }
}, },
handleImgExceed (res, item) { handleImgExceed(res, item) {
console.log(res); console.log(res);
// this.$message({ // this.$message({
// type: "warning", // type: "warning",
@ -576,7 +618,7 @@ export default {
// }); // });
}, },
handleImgSuccess (res, file, item) { handleImgSuccess(res, file, item) {
console.log("handleImgSuccess", res); console.log("handleImgSuccess", res);
if (res.code === 0 && res.msg === "success") { if (res.code === 0 && res.msg === "success") {
let { fmData } = this; let { fmData } = this;
@ -612,12 +654,12 @@ export default {
} }
}, },
handleImgError (res, file, item) { handleImgError(res, file, item) {
console.log(res); console.log(res);
}, },
// 地图初始化函数，本例取名为init，开发者可根据实际情况定义 // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
initMap (item) { initMap(item) {
let { latitude, longitude } = this.$store.state.user; let { latitude, longitude } = this.$store.state.user;
map = new daiMap( map = new daiMap(
@ -756,12 +798,12 @@ export default {
} }
}, },
watchImg (src) { watchImg(src) {
window.open(src); window.open(src);
}, },
// 过滤文本 // 过滤文本
dormatHtml (content) { dormatHtml(content) {
if ( if (
content.startsWith( content.startsWith(
"<!DOCTYPE html>\n<html>\n<head>\n</head>\n<body>\n" "<!DOCTYPE html>\n<html>\n<head>\n</head>\n<body>\n"
@ -773,7 +815,7 @@ export default {
return content; return content;
}, },
cookBeforeSubmit (data) { cookBeforeSubmit(data) {
Object.keys(data).forEach((k) => { Object.keys(data).forEach((k) => {
if (typeof data[k] == "string") { if (typeof data[k] == "string") {
data[k] = this.dormatHtml(data[k]); data[k] = this.dormatHtml(data[k]);
@ -782,7 +824,7 @@ export default {
return data; return data;
}, },
async handleComfirm () { async handleComfirm() {
this.btnDisable = true; this.btnDisable = true;
setTimeout(() => { setTimeout(() => {
this.btnDisable = false; this.btnDisable = false;
@ -814,7 +856,7 @@ export default {
}); });
}, },
async submit () { async submit() {
const { editConfig, fmData, formType, editFixedParams } = this; const { editConfig, fmData, formType, editFixedParams } = this;
if ( if (
typeof editConfig.beforeSubmit == "function" && typeof editConfig.beforeSubmit == "function" &&
@ -854,7 +896,7 @@ export default {
} }
}, },
handleCancle () { handleCancle() {
this.$emit("close"); this.$emit("close");
}, },
}, },
@ -927,13 +969,14 @@ export default {
.item { .item {
min-width: 45%; min-width: 45%;
.item-rich-text { /deep/ .item-rich-text {
width: 817px; width: 817px;
max-height: 500px; max-height: 500px;
overflow: auto; overflow: auto;
img { img {
max-width: 100%; max-width: 100%;
height: auto;
} }
&.z-show { &.z-show {
box-sizing: border-box; box-sizing: border-box;

Write Preview
Loading…
Cancel
Save