response.git - Gitblit

			@@ -1,172 +1,696 @@
			<template>
			<div class="inner">
			<a-alert message="管理员身份无法进行信息编辑操作" banner closable v-if="userInfo.role.id === 1" type="error"
			style="margin-bottom: 12px" />
			<h2>预警信息发布</h2>
			<div class="left">
			<a-input placeholder="请输入标题" style="height: 50px; font-size: 20px;" />
			<br /><br />
			<a-radio-group v-model="value" @change="onChange">
			<a-radio :value="1">
			蓝色
			</a-radio>
			<a-radio :value="2">
			黄色
			</a-radio>
			<a-radio :value="3">
			橙色
			</a-radio>
			<a-radio :value="4">
			红色
			</a-radio>
			</a-radio-group>
			<br /><br />
			<a-radio-group default-value="a" button-style="solid">
			<a-radio-button value="a">
			常规
			</a-radio-button>
			<a-radio-button value="b">
			紧临
			</a-radio-button>
			</a-radio-group>
			<div class="ftright">
			平级接收人选择：
			<a-select mode="multiple" placeholder="选择平级接收单位" :value="selectedItems" style="width: 180px"
			@change="handle">
			<a-select-option v-for="item in filteredOptions" :key="item" :value="item">
			{{ item }}
			</a-select-option>
			</a-select>

			<a-form-model ref="ruleForm" :model="form" :rules="rules" :wrapper-col="wrapperCol">
			<div class="left">
			<a-form-model-item prop="title">
			<a-input v-model="form.title" placeholder="请输入标题" style="height: 50px; font-size: 20px;" />
			</a-form-model-item>
			<!-- <a-row>-->
			<!-- <a-col :span="12" style="display: flex;align-items: center">-->
			<!-- <span style="display: block;margin-bottom: 24px">相关灾种</span>-->

			<!-- </a-col>-->
			<!-- <a-col :span="12" style="display: flex;align-items: center;justify-content: right">-->
			<!-- <span style="display: block;margin-bottom: 24px">预警级别：</span>-->

			<!-- </a-col>-->
			<!-- </a-row>-->

			<a-row>
			<a-col :span="12">
			<a-form-model-item prop="emergType">
			<a-radio-group v-model="form.emergType" button-style="solid">
			<a-radio-button :value="2">
			常规
			</a-radio-button>
			<a-radio-button :value="1">
			紧临
			</a-radio-button>
			</a-radio-group>
			</a-form-model-item>
			</a-col>
			<a-col :span="12" style="display: flex;align-items: center;justify-content: right">
			<a-form-model-item prop="disasterType" style="margin-right: 20px">
			<a-select placeholder="请选择相关灾种" v-model="form.disasterType" style="width: 240px" allowClear
			@change="handleRisk">
			<a-select-option v-for="item in riskOptions" :key="item.value" :value="item.value">
			{{ item.name }}
			</a-select-option>
			</a-select>
			</a-form-model-item>
			<a-form-model-item prop="warningLevel">
			<a-select placeholder="请选择预警级别" v-model="form.warningLevel" style="width: 240px" allowClear
			@change="handleLevel">
			<a-select-option v-for="item in levelOptions" :key="item.value" :value="item.value">
			{{ item.name }}
			</a-select-option>
			</a-select>
			</a-form-model-item>
			</a-col>
			</a-row>
			<a-form-model-item prop="content">
			<a-textarea v-model="form.content" placeholder="请输入短信通知内容部分"
			:auto-size="{ minRows: 3, maxRows: 5 }" />
			</a-form-model-item>
			<a-row v-if="userInfo.unittype == 1">
			<a-col :span="24" style="display: flex;align-items: center">
			<b style="margin-bottom: 24px">直览附件URL：</b>
			<a-form-model-item prop="directViewUrl" style="width: 50%">
			<a-textarea v-model="form.directViewUrl" placeholder="请输入url信息" :auto-size="{ minRows: 1, maxRows: 3 }"/>
			</a-form-model-item>
			</a-col>
			</a-row>
			<a-row>
			<a-col :span="12">
			<a-upload :action="uploadUrl" :file-list="fileList" @change="fileChange" :headers="header"
			accept=".doc, .docx, .word, .pdf, .zip, .xlsx, .rar, .jpg, .jpeg, .png"
			:data="{module: 'naturalDisasterPath'}" :remove="(file)=>{removeFile(file)}">
			<a-button> <a-icon type="upload" />上传附件</a-button>
			</a-upload>
			</a-col>
			<a-col :span="12" style="display: flex;align-items: center;justify-content: right">
			<b style="margin-bottom: 24px">超时设置：</b>
			<a-form-model-item prop="timeout">
			<a-input v-model="form.timeout" style="width:200px;" placeholder="输入时间" suffix="分钟" />
			</a-form-model-item>
			</a-col>
			</a-row>
			<!-- <span><b>发布单位：</b>{{form.publishingUnit}}</span>-->
			<!-- <br /><br />-->
			<!-- 子单位-->
			<a-row :gutter="24">
			<a-col :span="12">
			<div style="display:flex;justify-content: space-between;align-items: center;">
			<b>选择接收单位：</b>
			<a-checkbox :checked="checkAll" @change="checkChange">
			全选
			</a-checkbox>
			</div>
			<a-form-model-item prop="receiver" style="margin-bottom: 6px">
			<a-tree-select show-search :maxTagCount="3" tree-checkable treeCheckStrictly
			style="width: 100%" v-model="form.receiver"
			:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }" placeholder="选择工作通知接收单位"
			allow-clear multiple @change="depChanges" @search="onSearch" @select="onSelect"
			:tree-data="areaUsers" :replaceFields="replaceFields">
			</a-tree-select>
			</a-form-model-item>
			<!-- 这个不要了，领导自动看到本单位发出去的信息，在app端体现。 -->
			<!-- <a-checkbox :checked="withLeaders" @change="isAddLeaders" style="margin-bottom: 24px">
			同时发信息给本级领导
			</a-checkbox> -->
			</a-col>
			<a-col :span="12">
			<div style="display:flex;justify-content: space-between;align-items: center;">
			<b>平级接收人选择：</b>
			<a-checkbox :checked="checkSlAll" @change="checkSlChange">
			全选
			</a-checkbox>
			</div>
			<a-form-model-item prop="recipient">
			<!-- <a-select mode="multiple" placeholder="选择平级接收单位" v-model="form.recipient" @change="handle"-->
			<!-- :maxTagCount="3">-->
			<!-- <a-select-option v-for="item in filteredOptions" :key="item.id" :value="item.id">-->
			<!-- {{ item.recipientName }}({{item.company}} {{item.phone}})-->
			<!-- </a-select-option>-->
			<!-- </a-select>-->
			<a-tree-select
			v-model="form.recipient"
			style="width: 100%"
			:maxTagCount="3"
			:tree-data="treeData"
			tree-checkable
			placeholder="选择平级接收单位"
			:show-checked-strategy="SHOW_PARENT"
			search-placeholder="Please select"
			@change="handle"
			@focus="getPj()"
			/>
			</a-form-model-item>
			</a-col>
			</a-row>
			<a-row :gutter="24" style="display: flex;align-items: center">
			<a-col :span="12">
			<b style="margin-bottom: 6px">选择审批领导：</b>
			<a-form-model-item prop="reviewId">
			<a-select show-search v-model="form.reviewId" placeholder="请选择审批领导" style="width: 300px">
			<a-select-option v-for="(item,index) in leaders" :value="item.id"
			:key="index">{{item.realName}}</a-select-option>
			</a-select>
			</a-form-model-item>
			</a-col>
			<a-col :span="12" style="text-align: right">
			<a-button type="primary" style="width: 250px;" @click="confirmSend()" v-preventReClick="2000"
			:disabled="userInfo.role.id==1?true:false">
			确认并提交审核
			</a-button>
			</a-col>
			</a-row>
			</div>

			<br /><br />
			<a-textarea v-model="message" placeholder="请输入短信通知内容部分" :auto-size="{ minRows: 3, maxRows: 5 }" />
			<br /><br />
			<a-button>上传附件</a-button> <div style="float: right;width:50%;text-align: right;">超时设置： <a-input style="width:100px;" placeholder="输入时间" /> 分钟</div>
			<br /><br />
			<span><b>发布单位：</b>{{department}}</span>
			<br/><br/>
			<!-- 子单位-->
			<div style="margin-bottom: 10px">选择接收单位：</div>
			<a-tree-select
			show-search
			tree-checkable
			treeCheckStrictly
			style="width: 100%"
			v-model="svalue"
			:dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
			placeholder="选择工作通知接收单位"
			allow-clear
			multiple
			tree-default-expand-all
			@change="onChanges"
			@search="onSearch"
			@select="onSelect"
			>
			<a-tree-select-node key="0" value="all" title="全选">
			</a-tree-select-node>
			<a-tree-select-node key="0-1" value="乌鲁木齐" title="乌鲁木齐(张XX 13268813610)">
			<a-tree-select-node key="0-1-1" value="米东区" title="米东区(张XX 13268813610)">
			<a-tree-select-node key="0-1-1-1" value="XX村1" title="XX村(李有田 13268813610)" />
			</a-tree-select-node>
			<a-tree-select-node key="0-1-2" value="天山区" title="天山区">
			<a-tree-select-node key="0-1-2-1" value="XX村2">
			<b slot="title" style="color: #08c">XX村</b>
			</a-tree-select-node>
			</a-tree-select-node>
			</a-tree-select-node>
			</a-tree-select>

			<br/><br/>
			<div style="float: right;"><b>选择审批领导：</b> <a-select show-search placeholder="请选择审批领导"
			option-filter-prop="children" style="width: 200px" :filter-option="filterOption"
			@focus="handleFocus" @blur="handleBlur" @change="handleChange">
			<a-select-option value="jack">
			裴小威
			</a-select-option>
			<a-select-option value="lucy">
			赵东升
			</a-select-option>
			<a-select-option value="tom">
			王卫萍
			</a-select-option>
			</a-select></div>
			<br /><br />
			<a-button type="primary" class="ftright">
			确认并提交审核
			</a-button>
			</div>

			<div class="right">
			<h2>短信预览</h2>
			<div class="mobile">
			<div class="mesg">
			<P>【{{signname}}】{{message}}。发布单位：{{department}}</P>
			<div class="right">
			<h2>短信预览</h2>
			<div class="mobile">
			<div class="mesg">
			<P>【新疆自然灾害预警中心】{{form.content}}</P>
			</div>
			</div>

			</div>
			</div>

			</a-form-model>
			</div>
			</template>

			<script>


			const OPTIONS = ['自治区消防（李XX）', '自治区公安厅（王XX）', '自治区自然资源厅（刘XX）'];
			import {
			getAreaWithUserIfo,
			getPeerRecipient,
			getLeaders
			} from '@/api/user'
			import {
			getUserInfo
			} from "@/util/storage";
			import Cookies from "js-cookie";
			import {
			massSend,
			msgSend
			} from "@/api/send";
			import {
			deleteFile
			} from "@/api/list";
			import { TreeSelect } from 'ant-design-vue';
			import {verifySimpleContent} from "@/util/validate";
			const SHOW_PARENT = TreeSelect.SHOW_PARENT;
			const treeData = [];
			export default {
			name: "release",
			name: "notice",
			data() {
			let validateContent = (rule, value, callback)=>{
			if(value === ''){
			callback(new Error('请输入信息内容'))
			}else{
			if(!verifySimpleContent(value)){
			callback(new Error('内容不可包含中文中括号【】'))
			}else{
			callback()
			}
			}
			}
			return {
			value: 1,
			message: '',
			signname: '自然灾害风险预警提示',
			department: '自治区自然灾害综合监测预警中心',
			selectedItems: [],
			svalue:undefined,
			value: [],
			SHOW_PARENT,
			treeData,
			userInfo: {},
			unittype: null,
			wrapperCol: {
			span: 24
			},
			filteredOptions: [],
			form: {
			id: null,
			title: '',
			emergType: null,
			disasterType: undefined,
			warningLevel: undefined,
			content: '',
			directViewUrl: '',
			publishingUnit: '',
			districtId: null,
			attachments: [],
			timeout: null,
			reviewId: null,
			receiver: [],
			recipient: [],
			acceptingUnitIds: [],
			peerRecipientIds: []
			},
			sendLeaders: [],
			leaders: [],
			checkAll: false,
			checkSlAll: false,
			withLeaders: false,
			areaUsers: [],
			replaceFields: {
			children: 'children',
			title: 'name',
			key: 'id',
			value: 'id'
			},
			riskOptions: [{
			name: '地震',
			value: 1
			},
			{
			name: '气象',
			value: 3
			},
			{
			name: '地质灾害',
			value: 4
			},
			{
			name: '水旱',
			value: 5
			},
			{
			name: '森林草原火灾',
			value: 6
			}
			],
			levelOptions: [{
			name: '红色预警',
			value: 1
			},
			{
			name: '橙色预警',
			value: 2
			},
			{
			name: '黄色预警',
			value: 3
			},
			{
			name: '蓝色预警',
			value: 4
			}
			],
			rules: {
			emergType: [{
			required: true,
			message: '请选择紧急类型',
			trigger: 'change'
			}],
			disasterType: [{
			required: true,
			message: '请选择灾种',
			trigger: 'change'
			}],
			warningLevel: [{
			required: true,
			message: '请选择预警级别',
			trigger: 'change'
			}],
			title: [{
			required: true,
			message: '请输入信息标题',
			trigger: 'blur'
			}],
			content: [{
			required: true,
			validator: validateContent,
			trigger: 'blur'
			}],
			timeout: [{
			required: true,
			message: '请输入超时时间',
			trigger: 'blur'
			}],
			receiver: [{
			required: true,
			message: '请选择接收单位',
			trigger: 'change'
			}],
			reviewId: [{
			required: true,
			message: '请选择审批人',
			trigger: 'change'
			}],
			// recipient: [{ required: true, message: '请选择平级接收人', trigger: 'change'}]
			// acceptingUnitIds: [{ required: true, message: '请选择接收单位', trigger: 'change'}],
			// peerRecipientIds: [{ required: true, message: '请选择平级接收人', trigger: 'change'}]
			},
			uploadUrl: '',
			fileList: [],
			header: {
			uid: null,
			tk: Cookies.get('resTk')
			},
			delList: []
			};
			},
			components: {},
			computed: {
			filteredOptions() {
			return OPTIONS.filter(o => !this.selectedItems.includes(o));
			},
			created() {
			const t = this
			t.treeData = []
			t.getAreaUsers()
			t.areaUsers = JSON.parse(localStorage.getItem('areaUsers'))
			const {
			baseUrl
			} = require('../../../config/env.' + process.env.NODE_ENV)
			t.uploadUrl = baseUrl + '/attachment/upload/detail'
			t.userInfo = getUserInfo()
			t.header.uid = t.userInfo.uid
			t.form.districtId = t.userInfo.districtId
			t.form.publishingUnit = t.userInfo.company
			t.getSameLevel()
			t.getLeaders()
			},
			computed: {},
			methods: {
			//选择子部门部分
			onChanges(value) {
			if(value.find(i=>i.value == 'all')){
			console.log('全选了')
			}else{
			this.svalue = value;
			// 获取同级接收人
			async getSameLevel() {
			let t = this
			let res = await getPeerRecipient()
			if (res.data.code == 100) {
			if (res.data.data) {
			// t.filteredOptions = res.data.data

			for (const resKey in res.data.data) {
			t.filteredOptions = t.filteredOptions.concat(...res.data.data[resKey]);
			const obj = {
			title: resKey,
			value: resKey,
			key: resKey,
			children: res.data.data[resKey].map(item => {
			item['title'] = item.recipientName + '(' +item.company +item.phone+ ')'
			item['value'] = item.id
			item['key'] = item.id
			return item
			})
			}
			t.treeData.push(obj)
			}
			console.log(this.svalue);
			},
			onSearch() {
			console.log(...arguments);
			} else {
			console.log('暂无数据')
			}
			} else {
			this.$message.warning(res.data.msg);
			}
			},
			getPj(){
			this.treeData = []
			this.getSameLevel()
			},
			onSelect() {
			console.log(...arguments);
			},
			// 获取接收单位
			async getAreaUsers() {
			let t = this
			let res = await getAreaWithUserIfo()
			if (res.data.code == 100) {
			if (res.data.data) {
			t.userTitTree(res.data.data)
			const treeD = t.findNodeById(res.data.data, t.userInfo.districtId)
			// t.areaUsers = treeD.children
			t.unittype = treeD.type
			} else {
			console.log('暂无数据')
			}
			} else {
			this.$message.warning(res.data.msg);
			}
			},

			// 获取领导
			async getLeaders() {
			let t = this
			let res = await getLeaders()
			if (res.data.code == 100) {
			if (res.data.data) {
			t.leaders = res.data.data
			} else {
			console.log('暂无数据')
			}
			} else {
			this.$message.warning(res.data.msg);
			}
			},

			//选择子部门部分
			depChanges(value, label, extra) {
			const t = this
			if (t.form.receiver.length == 0) {
			t.checkAll = false
			}
			},
			checkChange(e) {
			const t = this
			t.checkAll = !t.checkAll
			if (t.checkAll == true) {
			t.form.receiver = t.traverseTree(t.areaUsers)
			} else {
			t.form.receiver = []
			}
			},

			//选择平级部门部分
			handle(selectedItems) {
			this.selectedItems = selectedItems;
			const t = this
			// if (t.form.recipient.length == t.filteredOptions.length) {
			// t.checkSlAll = true
			// } else {
			// t.checkSlAll = false
			// }
			const group = t.treeData.map(item => item.value)
			if (group.length === t.form.recipient.length && group.every((v,i) => v === t.form.recipient[i])) {
			t.checkSlAll = true
			} else {
			t.checkSlAll = false
			}
			},
			onChange(){
			console.log(this.value)

			checkSlChange(e) {
			const t = this
			t.checkSlAll = !t.checkSlAll
			if (t.checkSlAll == true) {
			// t.form.recipient = t.filteredOptions.map(i => i.id)
			t.form.recipient = t.treeData.map(item => item.value)
			} else {
			t.form.recipient = []
			}
			},
			handleChange(value) {
			console.log(`selected ${value}`);

			isAddLeaders(e) {
			const t = this
			t.withLeaders = !t.withLeaders
			t.sendLeaders = []
			if (e.target.checked) {
			for (let i of t.leaders) {
			const {
			realName,
			...data
			} = i
			const {
			id: recipienterId,
			name: recipienterName,
			phone: recipienterPhone,
			...rest
			} = data
			const obj = {
			recipienterId,
			recipienterName,
			recipienterPhone,
			province: null,
			city: null,
			area: null,
			town: null,
			receiveUnit: t.userInfo.company,
			unittype: t.userInfo.unittype,
			roleId: 2,
			...rest
			}
			t.sendLeaders.push(obj)
			}
			}
			},
			handleBlur() {
			console.log('blur');

			fileChange(info) {
			let fileList = [...info.fileList];
			fileList = fileList.map(file => {
			if (file.uid === info.file.uid) {
			if (file.status == 'done') {
			if (file.response) {
			const res = file.response
			if (res.code == 100) {
			this.$message.success('文件上传成功')
			} else {
			this.$message.error('文件上传失败')
			}
			// Component will show file.url as link
			file.url = res.data.fileUrl
			}
			}
			}
			return file
			});
			this.fileList = fileList;
			},
			handleFocus() {
			console.log('focus');

			removeFile(file) {
			this.delList.push(file.response.data.id)
			},
			filterOption(input, option) {
			return (
			option.componentOptions.children[0].text.toLowerCase().indexOf(input.toLowerCase()) >= 0
			);

			async deleteFile() {
			const t = this
			for (let i of t.delList) {
			const res = await deleteFile(i)
			if (res.data.code == 100) {
			console.log('文件删除成功')
			} else {
			t.$message.error(res.data.msg)
			}
			}
			},

			confirmSend() {
			this.$refs.ruleForm.validate(valid => {
			if (valid) {
			this.form.acceptingUnitIds = []
			this.form.peerRecipientIds = []
			const aList = this.form.receiver.map(item => this.findNodeById(this.areaUsers, item.value)
			?.users)
			if (aList.includes(null)) {
			this.$message.error('选择接收单位时存在无用户的单位')
			return
			}
			const newAList = [].concat(...aList)
			for (let i of newAList) {
			// const {realName,...data} = i
			const {id: recipienterId, name: recipienterName, phone: recipienterPhone, company: receiveUnit, realName: recipienterRealName, registrationId: registrationId, ...rest} = i
			const obj = {recipienterId, recipienterName, recipienterRealName, recipienterPhone, receiveUnit, registrationId, ...rest}
			this.form.acceptingUnitIds.push(obj)
			}
			this.form.acceptingUnitIds = [...this.form.acceptingUnitIds, ...this.sendLeaders]


			if (this.form.recipient.length > 0) {
			// const bList = this.form.recipient.map(item => this.filteredOptions.find(i => i.id == item))
			// for (let i of bList) {
			// const {id: recipienterId, recipientName: recipienterName, phone: recipienterPhone, company: receiveUnit, ...rest} = i
			// const obj = {recipienterId, recipienterName, recipienterPhone, receiveUnit, unittype: this.unittype, recipienterRealName: recipienterName, ...rest}
			// this.form.peerRecipientIds.push(obj)
			// }

			let bList = []
			for(let i of this.form.recipient){
			for(let j of this.treeData){
			if(j.value == i){
			bList = bList.concat(j.children)
			}else{
			if(j.children && j.children.length>0){
			for(let k of j.children){
			if(k.id == i){
			bList.push(k)
			}
			}
			}
			}
			}
			}
			for (let i of bList) {
			const {id: recipienterId, recipientName: recipienterName, phone: recipienterPhone, company: receiveUnit, id,province,city,area,town,...rest} = i
			const obj = {recipienterId, recipienterName, recipienterPhone, receiveUnit, unittype: this.unittype, recipienterRealName: recipienterName, id,province,city,area,town}
			this.form.peerRecipientIds.push(obj)
			}

			}

			this.form.attachments = this.fileList.map(i => i.response.data.id)
			const {
			receiver,
			recipient,
			id,
			...data
			} = this.form
			msgSend(data).then(res => {
			if (res.data.code == 100) {
			this.deleteFile()
			this.$message.success('信息已提交审核')
			} else {
			this.$message.error(res.data.msg)
			}
			this.fileList = []
			this.delList = []
			this.withLeaders = false
			this.$refs.ruleForm.clearValidate()
			this.$refs.ruleForm.resetFields()
			})
			} else {
			console.log('error submit!!');
			return false;
			}
			})
			},


			// 根据id查对象
			findNodeById(data, value) {
			for (const node of data) {
			if (node.id === value) {
			return node;
			}
			if (node.children) {
			const foundNode = this.findNodeById(node.children, value);
			if (foundNode) {
			return foundNode;
			}
			}
			}
			return null;
			},

			// 将树状数据所有id和name放入对象数组
			traverseTree(treeData) {
			let result = [];

			function traverse(data) {
			for (const node of data) {
			if (node.users && node.users.length > 0) {
			result.push({
			label: node.name,
			value: node.id
			});
			if (node.children && node.children.length > 0) {
			traverse(node.children);
			}
			}
			}
			}
			traverse(treeData);
			return result;
			},

			// 将树状数据name字段放入users的姓名电话
			userTitTree(treeData) {
			for (const node of treeData) {
			if (node.users) {
			node.users = node.users.filter(i => i.roleId == 3)
			node.users = node.users.map((i) => {
			return {
			...i,
			unittype: node.type,
			districtId: node.id
			}
			})
			node.name = node.name + '(' + node.users.map(i => i.realName + ' ' + i.phone).join(',') + ')'
			}
			if (node.children) {
			this.userTitTree(node.children)
			}
			}
			return treeData
			},
			// 将users为null的节点删除
			// removeNodesWithoutUsers(node) {
			// if (node.users === null && node.children === null) {
			// return null; // 返回 null 表示删除节点
			// }
			// if (node.children && node.children.length > 0) {
			// node.children = node.children.map(child => this.removeNodesWithoutUsers(child)).filter(Boolean);
			// }
			// return node;
			// },

			onSearch() {
			console.log(...arguments);
			},
			onSelect() {
			console.log(...arguments);
			},

			handleRisk(selectedItems) {
			// this.selectedItems = selectedItems;
			},
			handleLevel(selectedItems) {
			// this.selectedItems = selectedItems;
			},
			},
			}
			@@ -211,4 +735,4 @@
			}

			}
			</style>
			</style>