You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
347 lines
8.8 KiB
347 lines
8.8 KiB
<template>
|
|
<el-dialog :visible.sync="dialogVisible" width="800px" :before-close="handleCancle" top="5vh">
|
|
<span slot="title">
|
|
<span v-if="pageType == 'add'">发布</span>
|
|
<span v-if="pageType == 'edit'">修改</span>
|
|
<span v-if="pageType == 'view'">查看</span>
|
|
</span>
|
|
<div>
|
|
<div class="dialog-h-content2 ">
|
|
<el-form :inline="true" :model="formData" ref="form" :rules="dataRule" v-if="pageType != 'view'">
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-form-item label="发布渠道" prop="publishDitch">
|
|
<el-select v-model="formData.publishDitch" placeholder="请选择" clearable>
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="发布范围" prop="orgId">
|
|
<el-cascader
|
|
class="customer_cascader"
|
|
ref="myCascader"
|
|
v-model="formData.orgId"
|
|
:options="orgOptions"
|
|
filterable
|
|
clearable
|
|
:props="orgOptionProps"
|
|
:show-all-levels="false"
|
|
@change="handleChangeAgency"
|
|
></el-cascader>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="发布内容" prop="content">
|
|
<el-input
|
|
v-model="formData.content"
|
|
type="textarea"
|
|
:autosize="{ minRows: 6, maxRows: 20 }"
|
|
maxlength="500"
|
|
style="width:570px;"
|
|
clearable
|
|
show-word-limit
|
|
placeholder="请输入"
|
|
></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
<el-form :inline="false" :model="formData" ref="form" label-width="140px" v-if="pageType == 'view'">
|
|
<el-row>
|
|
<el-col :span="24">
|
|
<el-form-item label="发布渠道" prop="publishDitch"><span v-if="formData.publishDitch == 0">专属钉钉</span></el-form-item>
|
|
</el-col>
|
|
|
|
<el-col :span="24">
|
|
<el-form-item label="发布范围" prop="publishRangeName">
|
|
<div style="max-height: 100px; overflow-y: auto;">{{ formData.publishRangeName }}</div>
|
|
</el-form-item>
|
|
</el-col>
|
|
|
|
<el-col :span="24">
|
|
<el-form-item label="发布内容" prop="content">
|
|
<div style="max-height: 150px; overflow-y: auto;">{{ formData.content }}</div>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="24">
|
|
<el-form-item label="发布时间" prop="content">{{ formData.publishTime }}</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
</el-form>
|
|
|
|
<div class="div_btn" v-if="pageType != 'view'" style="text-align: center;">
|
|
<el-button size="small" @click="handleCancle">取 消</el-button>
|
|
<!-- <el-button size="small" @click="resetData" v-if="pageType != 'view'">重置</el-button> -->
|
|
<el-button size="small" type="primary" @click="handleComfirm">保 存</el-button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<span slot="footer" class="dialog-footer" v-if="pageType == 'view'">
|
|
<el-button @click="handleCancle">关 闭</el-button>
|
|
<!-- <el-button type="primary" @click="handleComfirm">确 定</el-button> -->
|
|
</span>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script>
|
|
import { isMobile } from '@/utils/validate';
|
|
import { mapGetters } from 'vuex';
|
|
import { Loading } from 'element-ui'; // 引入Loading服务
|
|
import { requestPost, requestGet } from '@/js/dai/request';
|
|
import daiMap from '@/utils/dai-map';
|
|
import nextTick from 'dai-js/tools/nextTick';
|
|
|
|
let loading; // 加载动画
|
|
let map;
|
|
var search;
|
|
var markers;
|
|
var infoWindowList;
|
|
var geocoder; // 新建一个正逆地址解析类
|
|
|
|
export default {
|
|
props: {
|
|
dialogVisible: {
|
|
type: Boolean,
|
|
default: ''
|
|
},
|
|
// defaultData: {
|
|
// type: Object,
|
|
// default: null
|
|
// },
|
|
pageType: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
detailId: {
|
|
type: String,
|
|
default: ''
|
|
}
|
|
// detailData: {
|
|
// type: Object,
|
|
// default: null
|
|
// },
|
|
// disabled: {
|
|
// type: Boolean,
|
|
// default: false
|
|
// }
|
|
},
|
|
|
|
data() {
|
|
return {
|
|
options: [
|
|
{
|
|
value: 0,
|
|
label: '专属app'
|
|
}
|
|
],
|
|
btnDisable: false,
|
|
user: '',
|
|
agencyId: '',
|
|
orgOptions: [], //组织
|
|
orgOptionProps: {
|
|
//组织
|
|
multiple: true,
|
|
value: 'agencyId',
|
|
label: 'agencyName',
|
|
children: 'subAgencyList',
|
|
emitPath: false,
|
|
checkStrictly: false
|
|
},
|
|
formData: {
|
|
publishDitch: '',
|
|
publishRange: '',
|
|
content: ''
|
|
},
|
|
dataRule: {
|
|
publishDitch: [{ required: true, message: '发布渠道不能为空', trigger: 'bulr' }],
|
|
orgId: [{ required: true, message: '发布范围不能为空', trigger: 'bulr' }],
|
|
content: [{ required: true, message: '内容不能为空', trigger: 'bulr' }]
|
|
},
|
|
//地图
|
|
loading: false,
|
|
|
|
searchValue: '',
|
|
searchOptions: [],
|
|
ids: []
|
|
};
|
|
},
|
|
watch: {},
|
|
components: {},
|
|
created() {},
|
|
async mounted() {
|
|
this.user = this.$store.state.user;
|
|
this.agencyId = this.user.agencyId;
|
|
this.startLoading();
|
|
|
|
if (this.pageType != 'add') {
|
|
this.getDetail();
|
|
} else {
|
|
this.getOrgTreeList();
|
|
}
|
|
await this.endLoading();
|
|
this.endLoading();
|
|
},
|
|
|
|
methods: {
|
|
getOrgTreeList() {
|
|
const { user } = this.$store.state;
|
|
this.$http
|
|
.post('/gov/org/customeragency/agencygridtree', {})
|
|
.then(({ data: res }) => {
|
|
if (res.code !== 0) {
|
|
return this.$message.error(res.msg);
|
|
} else {
|
|
console.log('获取组织树成功', res.data);
|
|
// let { agencyList, subAgencyList } = res.data;
|
|
// const _arr = [{ ...agencyList, subAgencyList: [...subAgencyList] }];
|
|
// this.orgOptions = this.deepTree(_arr);
|
|
this.orgOptions = [];
|
|
this.orgOptions.push(res.data);
|
|
}
|
|
})
|
|
.catch(() => {
|
|
return this.$message.error('网络错误');
|
|
});
|
|
},
|
|
handleChangeAgency(val) {
|
|
let obj = this.$refs['myCascader'].getCheckedNodes().map(item => {
|
|
return item.data;
|
|
});
|
|
this.ids = [];
|
|
this.digui(obj);
|
|
this.ids = new Set(this.ids);
|
|
let arr = [...this.ids];
|
|
this.formData.rangeList = obj
|
|
.map(item => {
|
|
if (arr.indexOf(item.agencyId) == -1) {
|
|
return { orgType: item.level === 'grid' ? 'grid' : 'agency', orgId: item.agencyId };
|
|
}
|
|
})
|
|
.filter(ite => typeof ite !== 'undefined');
|
|
console.log(this.formData.rangeList);
|
|
},
|
|
digui(node) {
|
|
node.forEach(item => {
|
|
if (item.subAgencyList) {
|
|
item.subAgencyList.forEach(item2 => {
|
|
this.ids.push(item2.agencyId);
|
|
});
|
|
}
|
|
});
|
|
},
|
|
async getDetail() {
|
|
const url = `/message/organization/message/detail/${this.detailId}`;
|
|
const { data, code, msg } = await requestPost(url);
|
|
if (code === 0) {
|
|
this.formData = { ...data };
|
|
} else {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
|
|
handleComfirm() {
|
|
this.save();
|
|
},
|
|
|
|
async save() {
|
|
// this.formData.agencyId = this.agencyId;
|
|
// this.formData.rangeList=[{
|
|
// orgId:this.formData.orgId,
|
|
// orgType:this.formData.orgType
|
|
// }]
|
|
|
|
var url = '';
|
|
var params = {};
|
|
url = '/message/organization/message/publish';
|
|
params = { ...this.formData };
|
|
const { data, code, msg } = await requestPost(url, params);
|
|
if (code === 0) {
|
|
this.$message.success('操作成功');
|
|
|
|
this.handleCancle();
|
|
// // this.resetData();
|
|
// this.$emit('handleComfirm');
|
|
} else if (code >= 8000) {
|
|
this.$message.error(msg);
|
|
}
|
|
},
|
|
handleCancle() {
|
|
// this.resetData();
|
|
this.$emit('handleClose');
|
|
},
|
|
resetData() {
|
|
this.$refs.form.resetFields();
|
|
},
|
|
// 开启加载动画
|
|
startLoading() {
|
|
loading = Loading.service({
|
|
lock: true, // 是否锁定
|
|
text: '正在加载……', // 加载中需要显示的文字
|
|
background: 'rgba(0,0,0,.7)' // 背景颜色
|
|
});
|
|
},
|
|
// 结束加载动画
|
|
endLoading() {
|
|
// clearTimeout(timer);
|
|
if (loading) {
|
|
loading.close();
|
|
}
|
|
} // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import '@/assets/scss/modules/management/form-main.scss';
|
|
@import '@/assets/scss/modules/management/form.scss';
|
|
// @import '@/assets/scss/modules/visual/a_customize.scss';
|
|
.div_map {
|
|
width: 350px;
|
|
}
|
|
/deep/.el-dialog__header {
|
|
padding: 25px 20px 10px 25px;
|
|
font-size: 18px;
|
|
font-family: PingFang SC;
|
|
font-weight: normal;
|
|
color: #333;
|
|
}
|
|
/deep/.el-dialog__body {
|
|
padding: 30px 0px 30px 40px;
|
|
}
|
|
/deep/.el-dialog__footer {
|
|
text-align: center;
|
|
}
|
|
/deep/.el-form {
|
|
.el-form-item {
|
|
position: relative;
|
|
margin-bottom: 22px;
|
|
.el-form-item__label {
|
|
font-size: 14px;
|
|
padding-left: 15px;
|
|
text-align: left;
|
|
// &::before {
|
|
// position: absolute;
|
|
// left: 0;
|
|
// top: 12px;
|
|
// content: '';
|
|
// display: block;
|
|
// width: 7px;
|
|
// height: 7px;
|
|
// background: #0c81fe;
|
|
// border-radius: 3px;
|
|
// }
|
|
}
|
|
.el-form-item__content {
|
|
font-size: 14px;
|
|
}
|
|
}
|
|
}
|
|
/deep/.dialog-h-content2 {
|
|
// max-height: calc(83vh - 90px);
|
|
box-sizing: border-box;
|
|
padding: 0 30px;
|
|
overflow: auto;
|
|
}
|
|
</style>
|
|
|