528 lines
18 KiB
Plaintext
528 lines
18 KiB
Plaintext
<script setup lang="ts">
|
|
// import Editor from '../components/Editor.vue'
|
|
import Editor from '../components/TinyECE.vue'
|
|
import HomeHead from '@/views/home/components/HomeHead.vue'
|
|
import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
|
|
import UserPage from './UserPages.vue'
|
|
import { useDate } from '@/views/home/hooks/useDate'
|
|
import { getArticleDetail, review } from '@/api/daikin/base'
|
|
import { NModal, NCard, NForm, NButton, NFormItem, NInput, NRadio, NSelect, NSpace, NRadioGroup, useMessage, treeDark } from 'naive-ui'
|
|
import { getImg } from '../images'
|
|
import { useUserStore } from '@/stores/modules/user'
|
|
import {noticeld} from '@/stores/modules/noticeId'
|
|
import { Plus } from '@element-plus/icons-vue'
|
|
import type { UploadProps, UploadUserFile } from 'element-plus'
|
|
|
|
|
|
const stores = noticeld()
|
|
const store = useUserStore()
|
|
|
|
const state = ref<any>({})
|
|
async function getData() {
|
|
const { id } = route.params
|
|
if (!id) return
|
|
const { data} = await getArticleDetail(id as string)
|
|
state.value = data
|
|
dataList.value = data.userList
|
|
formValue.value = Object.assign(data,{
|
|
type:data.type+'',
|
|
cate:data.cate+'',
|
|
})
|
|
editorContent.value =data.content? unescapeHTML(data.content):''
|
|
cate.value = data.cate
|
|
console.log(data.type)
|
|
}
|
|
|
|
const message = useMessage()
|
|
const { day, week } = useDate()
|
|
const { push } = useRouter()
|
|
const route = useRoute()
|
|
let cate = ref(1);
|
|
let formValue: any = ref({
|
|
type: 1,
|
|
status:1,
|
|
cate: '',
|
|
title: '',
|
|
tag: '',
|
|
source: '',
|
|
content: '',
|
|
isTop:'N',
|
|
bannerImg:'',
|
|
})
|
|
|
|
let rules = {
|
|
cate: {
|
|
required: false,
|
|
message: '请选择类型',
|
|
trigger: 'blur'
|
|
},
|
|
title: {
|
|
required: false,
|
|
message: '请输入标题',
|
|
trigger: 'blur'
|
|
},
|
|
tag: {
|
|
required: true,
|
|
message: '请输入标题',
|
|
trigger: 'blur'
|
|
},
|
|
source: {
|
|
required: true,
|
|
message: '请输入标题',
|
|
trigger: 'blur'
|
|
},
|
|
content: {
|
|
required: false,
|
|
message: '请输入内容',
|
|
trigger: 'blur'
|
|
}
|
|
}
|
|
// let options = [{
|
|
// label: '紧急',
|
|
// value: '紧急'
|
|
// },
|
|
// {
|
|
// label: 'New',
|
|
// value: 'New'
|
|
// },]
|
|
function change(i: any) {
|
|
cate.value = i
|
|
formValue.cate = cate.value
|
|
// console.log( formValue.cate)
|
|
}
|
|
function unescapeHTML(html: string) {
|
|
const doc = new DOMParser().parseFromString(html, 'text/html');
|
|
return doc.documentElement.textContent;
|
|
}
|
|
function escapeHTML(html: string): string {
|
|
const tempElement = document.createElement('div');
|
|
tempElement.textContent = html;
|
|
return tempElement.innerHTML;
|
|
}
|
|
// 获取子组件传过来的值
|
|
const handleChild2 = (data: string) => {
|
|
editorContent.value = data
|
|
}
|
|
const starts =ref(1)
|
|
const fileList = ref<[]>()
|
|
const editorContent = ref('')
|
|
async function sure() {
|
|
const {id, title, source, type ,isTop,content:conts} = formValue.value
|
|
const cont = editorContent.value
|
|
const content = cont?escapeHTML(cont):conts
|
|
|
|
const noticeId = stores.article.noticeld
|
|
const cates = cate.value
|
|
const status = starts.value
|
|
console.log(content)
|
|
let userIdList: any[] =[]
|
|
// let filLists
|
|
// if(isTop==='Y'&&!fileList.value){
|
|
// message.error("请选择图片")
|
|
// return
|
|
// }
|
|
// else if(isTop==='Y'&&fileList.value){
|
|
// filLists = fileList.value.map(item => item.response.fileName).join(',');
|
|
|
|
// }
|
|
|
|
|
|
if(!dataList.value){
|
|
message.success("请选择要提醒的对象")
|
|
return
|
|
}
|
|
dataList.value.forEach((i: { userId: any })=>{
|
|
console.log(dataList.value)
|
|
userIdList.push(i.userId)
|
|
})
|
|
// console.log(formValue.value)
|
|
if(userIdList.length<0) return
|
|
const { msg, code } = await review({id,status,isTop, title, source, cate:cates,noticeId, type, content ,userIdList})
|
|
if (code === 200) {
|
|
showModalRef2.value = true
|
|
}
|
|
else { message.success(msg); }
|
|
}
|
|
|
|
|
|
|
|
const showModal = ref(false)
|
|
const showModalRef = ref(false)
|
|
const showModalRef2 = ref(false)
|
|
const bodyStyle = ref({
|
|
// 'background-color': '#236EED'
|
|
})
|
|
function onNegativeClick() {
|
|
message.success('Cancel')
|
|
showModalRef.value = false
|
|
}
|
|
function onPositiveClick() {
|
|
showModalRef.value = false
|
|
sure()
|
|
|
|
}
|
|
function onPositiveClicks() {
|
|
showModalRefs.value = false
|
|
sure()
|
|
|
|
}
|
|
const dataList = ref()
|
|
// 获取子组件传过来的值
|
|
const handleChild = (data: any) => {
|
|
const { showModal: show, multipleSelection } = data
|
|
showModal.value = unref(show)
|
|
dataList.value = unref(multipleSelection)
|
|
}
|
|
|
|
const handleClose = (tag: any) => {
|
|
|
|
dataList.value.splice(dataList.value.indexOf(tag), 1)
|
|
// console.log( dataList.value)
|
|
}
|
|
const CloseThis = (data: boolean)=>{
|
|
showModal.value = data
|
|
}
|
|
const ok =() =>{
|
|
showModalRef2.value = false
|
|
push('/Home/Process')
|
|
}
|
|
|
|
const submitSave = (page: any)=>{
|
|
console.log(page)
|
|
if(store.user.isReview === 1){
|
|
if(page === 1){
|
|
|
|
showModalRef.value = true
|
|
}else{
|
|
showModalRefs.value = true
|
|
}
|
|
starts.value = page
|
|
// console.log(page,showModalRef.value, showModalRefs.value)
|
|
}
|
|
else{
|
|
message.warning("您还未获得审核权限")
|
|
}
|
|
|
|
}
|
|
getData()
|
|
const showModals =ref(false)
|
|
const header = {'token':store.user.token}
|
|
// console.log(store.user.token)
|
|
|
|
const dialogImageUrl = ref('')
|
|
const dialogVisible = ref(false)
|
|
|
|
const handleRemove: UploadProps['onRemove'] = (uploadFile: any, uploadFiles: any) => {
|
|
// console.log(dialogImageUrl,dialogVisible)
|
|
}
|
|
|
|
const handlePictureCardPreview: UploadProps['onPreview'] = (uploadFile: { url: string }) => {
|
|
dialogImageUrl.value = uploadFile.url!
|
|
dialogVisible.value = true
|
|
// console.log(dialogImageUrl.value)
|
|
}
|
|
const setUserList =ref()
|
|
const thisClick=()=>{
|
|
showModal.value = true
|
|
setUserList.value = dataList.value
|
|
stores.article.reviewSource = formValue.value.reviewSource
|
|
console.log(stores.article.reviewSource)
|
|
}
|
|
const showModalRefs = ref(false)
|
|
</script>
|
|
<template>
|
|
<div>
|
|
<HomeHead class="top">
|
|
<template #content>
|
|
<!-- <HomeHeadSearch /> -->
|
|
</template>
|
|
</HomeHead>
|
|
<div class="h-full relative flex flex-col">
|
|
<div class="font-600 flex items-end mt30px">
|
|
<div class="text-36px">情报新增待审批</div>
|
|
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
|
<div class="text-18px">{{ week }}</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="q-wrapper flex-1 mt30px text-#142142 flex flex-col bg-#fff p30px ">
|
|
<n-form ref="formRef" :label-width="900" :model="formValue" :rules="rules" size="medium"
|
|
require-mark-placement="left">
|
|
<n-form-item v-if="formValue.reviewSource===2" label="情报属性" path="type">
|
|
<n-radio-group v-model:value="formValue.type" name="radiogroup">
|
|
<n-space>
|
|
<!-- <n-radio v-for="song in songs" :key="song.value" :value="song.value">
|
|
{{ song.label }}
|
|
</n-radio> -->
|
|
<n-radio value="2">社内</n-radio>
|
|
<n-radio value="1">社外</n-radio>
|
|
</n-space>
|
|
</n-radio-group>
|
|
</n-form-item>
|
|
<n-form-item label="是否紧急" path="isTop">
|
|
<n-radio-group v-model:value="formValue.isTop" name="radiogroup">
|
|
<n-space>
|
|
<!-- <n-radio v-for="song in songs" :key="song.value" :value="song.value">
|
|
{{ song.label }}
|
|
</n-radio> -->
|
|
<n-radio value="Y">是</n-radio>
|
|
<n-radio value="N">不是</n-radio>
|
|
</n-space>
|
|
</n-radio-group>
|
|
</n-form-item>
|
|
<!-- <n-form-item v-if="formValue.isTop==='Y'" label="上传图片" >
|
|
<el-upload
|
|
v-model:file-list="fileList"
|
|
:headers="header"
|
|
action="/test-api/common/upload"
|
|
list-type="picture-card"
|
|
:on-preview="handlePictureCardPreview"
|
|
:on-remove="handleRemove"
|
|
:limit="3"
|
|
>
|
|
<el-icon><Plus /></el-icon>
|
|
</el-upload>
|
|
|
|
<el-dialog v-model="dialogVisible">
|
|
<img w-full :src="dialogImageUrl" alt="Preview Image" />
|
|
</el-dialog>
|
|
</n-form-item> -->
|
|
|
|
<n-form-item v-if="formValue.reviewSource===2&&cate!=9" label="情报类型" path="cate">
|
|
<div class="flex gap-20px cursor-pointer">
|
|
|
|
<div v-if="formValue.type==='1'" :class="cate == 1 ? 'img yes' : 'img'" @click="change(1)">
|
|
<img src="../images/icon-1.svg" alt="" class="ml15px mt8px">
|
|
<div class="text-center text-14px text-#fff">外部环境</div>
|
|
</div>
|
|
<div v-if="formValue.type==='1'" :class="cate == 2 ? 'img yes' : 'img'" @click="change(2)">
|
|
<img src="../images/icon-2.svg" alt="" class="ml18px mt14px">
|
|
<div class="text-center text-14px text-#fff">竞争对手</div>
|
|
</div>
|
|
<div v-if="formValue.type==='1'" :class="cate == 3 ? 'img yes' : 'img'" @click="change(3)">
|
|
<img src="../images/icon-3.svg" alt="" class="ml19px mt8px">
|
|
<div class="text-center text-14px text-#fff">供方动向</div>
|
|
</div>
|
|
|
|
<div v-if="formValue.type==='2'" :class="cate == 4 ? 'img yes' : 'img'" @click="change(4)">
|
|
<img src="../images/icon-4.svg" alt="" class="ml17px mt10px">
|
|
<div class="text-center text-14px text-#fff">大金集团</div>
|
|
</div>
|
|
<div v-if="formValue.type==='2'" :class="cate == 5 ? 'img yes' : 'img'" @click="change(5)">
|
|
<img src="../images/icon-5.svg" alt="" class="ml17px mt9px">
|
|
<div class="text-center text-14px text-#fff">中国据点</div>
|
|
</div>
|
|
<div v-if="formValue.type==='2'" :class="cate == 6 ? 'img yes' : 'img'" @click="change(6)">
|
|
<img src="../images/icon-6.svg" alt="" class="ml15px mt8px">
|
|
<div class="text-center text-14px text-#fff">调达本部</div>
|
|
</div>
|
|
|
|
|
|
|
|
</div>
|
|
</n-form-item>
|
|
<n-form-item v-if="formValue.reviewSource===3&&cate!=9" label="情报类型" path="cate">
|
|
<div class="flex gap-20px cursor-pointer">
|
|
|
|
|
|
<div v-if="formValue.type==='1'" :class="cate == 7 ? 'img yes' : 'img'" @click="change(7)">
|
|
<img src="../images/news2@2x.png" alt="" class="ml19px mt8px w46px">
|
|
<div class="text-center text-14px text-#fff">News</div>
|
|
</div>
|
|
<div v-if="formValue.type==='1'" :class="cate == 8 ? 'img yes' : 'img'" @click="change(8)">
|
|
<img src="../images/zytz@2x.png" alt="" class="ml10px mt8px w55px">
|
|
<div class="text-center text-14px text-#fff">重要通知</div>
|
|
</div>
|
|
</div>
|
|
</n-form-item>
|
|
<n-form-item v-if="formValue.reviewSource===2" label="轮播图" path="title">
|
|
<img v-if="formValue.bannerImg[0]" :src="formValue.bannerImg[0]" class="max-w600px max-h300px"/>
|
|
</n-form-item>
|
|
<n-form-item label="情报标题" path="title">
|
|
<n-input v-model:value="formValue.title" placeholder="" />
|
|
</n-form-item>
|
|
<!-- <n-form-item label="情报状态" path="tag" v-if="store.user.isPublish !==1">
|
|
<n-select v-model:value="formValue.tag" :options="options" />
|
|
</n-form-item> -->
|
|
<n-form-item label="情报来源" path="source">
|
|
<n-input v-model:value="formValue.source" placeholder="" />
|
|
</n-form-item>
|
|
<n-form-item label="情报内容" path="content">
|
|
<Editor :content="state.content" @getChildData="handleChild2"></Editor>
|
|
</n-form-item>
|
|
|
|
<n-button @click="showModals = true"> 文本内容预览 </n-button>
|
|
<br>
|
|
<br>
|
|
<br>
|
|
<n-button @click="thisClick" v-if="cate!=9">
|
|
情报公开范围
|
|
</n-button>
|
|
<div class="mt15px h150px overflow-y-auto" v-if="cate!=9">
|
|
<el-tag v-for="i in dataList" :key="i" class="mx-1 my5px" closable :disable-transitions="false"
|
|
@close="handleClose(i)" type="info" size="large">
|
|
{{ i.nickName }}
|
|
</el-tag>
|
|
</div>
|
|
<div class=" text-end float-right block h50px pt10px">
|
|
<n-form-item>
|
|
<n-button attr-type="button" style=" padding: 0 20px;" @click="submitSave(2)">
|
|
拒绝
|
|
</n-button>
|
|
<n-button attr-type="button" @click="submitSave(1)"
|
|
style="background-color: #3870E5; border-radius: 5px; color: #fff;margin-left: 10px; padding: 0 20px;">
|
|
发布
|
|
</n-button>
|
|
</n-form-item>
|
|
</div>
|
|
|
|
</n-form>
|
|
</div>
|
|
|
|
<div>
|
|
<n-modal v-model:show="showModal">
|
|
<!-- <n-card style="width:1100px; height: 800px;" title="调达中心" :bordered="false" size="huge" role="dialog"
|
|
aria-modal="true"> -->
|
|
<UserPage :userDataList="setUserList" @clickChild="handleChild" @CloseThis="CloseThis"></UserPage>
|
|
<!-- </n-card> -->
|
|
</n-modal>
|
|
</div>
|
|
<div>
|
|
<n-modal v-model:show="showModalRef">
|
|
<n-card style="width: 500px;" title="提示" :bordered="false" size="huge" role="dialog" aria-modal="true">
|
|
|
|
<div class="h200px bg#fff flex-col flex items-center justify-center">
|
|
<span class=" mb60px text-18px">确认发布本情报</span>
|
|
<div class="leading-25px">
|
|
<span
|
|
class="inline-block w80px h25px text-#bfbfbf border border-solid text-center rounded-5px cursor-pointer"
|
|
@click="showModalRef = false">暂缓</span>
|
|
<span
|
|
class="inline-block w80px h25px text-#fff bg-#236EED ml5px text-center rounded-5px cursor-pointer"
|
|
@click="onPositiveClick">确认发布</span>
|
|
</div>
|
|
</div>
|
|
</n-card>
|
|
|
|
</n-modal>
|
|
</div>
|
|
<div>
|
|
<n-modal v-model:show="showModalRefs">
|
|
<n-card style="width: 500px;" title="提示" :bordered="false" size="huge" role="dialog" aria-modal="true">
|
|
|
|
<div class="h200px bg#fff flex-col flex items-center justify-center">
|
|
<span class=" mb60px text-18px">确认驳回本情报</span>
|
|
<div class="leading-25px">
|
|
<span
|
|
class="inline-block w80px h25px text-#bfbfbf border border-solid text-center rounded-5px cursor-pointer"
|
|
@click="showModalRefs = false">暂缓</span>
|
|
<span
|
|
class="inline-block w80px h25px text-#fff bg-#236EED ml5px text-center rounded-5px cursor-pointer"
|
|
@click="onPositiveClicks">确认驳回</span>
|
|
</div>
|
|
</div>
|
|
</n-card>
|
|
|
|
</n-modal>
|
|
</div>
|
|
<div>
|
|
<n-modal :mask-closable="false" v-model:show="showModalRef2">
|
|
<n-card style="width: 500px;" title="提示" :bordered="false" size="huge" role="dialog" aria-modal="true" >
|
|
|
|
<div class="h200px bg#fff flex-col flex items-center justify-center">
|
|
<img class="w60px h60px" src="../images/quedd.png" alt="">
|
|
<span class="mt10px mb40px">{{starts==1?'已成功发布':'已成功驳回'}}</span>
|
|
<span class="w50px h30px text-#fff bg-#236EED p5px text-center rounded-5px cursor-pointer"
|
|
@click="ok">确认</span>
|
|
</div>
|
|
|
|
</n-card>
|
|
|
|
</n-modal>
|
|
</div>
|
|
|
|
<div>
|
|
<n-modal v-model:show="showModals">
|
|
<div class=" flex w80% p30px bg-#fff my40px rounded-30px">
|
|
|
|
<div class=" overflow-y-auto h800px container" v-html="editorContent"></div>
|
|
</div>
|
|
</n-modal>
|
|
</div>
|
|
</template>
|
|
<style lang="less">
|
|
:deep.container {
|
|
// column-count: 2;
|
|
column-gap: 34px;
|
|
margin: 30px;
|
|
line-height: 2;
|
|
margin-top: 32px;
|
|
// :deep(p>img){
|
|
// width: 100%;
|
|
// }
|
|
// max-width: 1062px;
|
|
:deep(img) {
|
|
// width: 100%;
|
|
// max-width: 500px;
|
|
border-radius: 6px;
|
|
margin-bottom: 24px;
|
|
}
|
|
:deep(p) {
|
|
text-indent: 2em;
|
|
}
|
|
}
|
|
/* 设置滚动条宽度 */
|
|
::-webkit-scrollbar {
|
|
width: 1px;
|
|
}
|
|
|
|
.top {
|
|
position: absolute;
|
|
right: 30px;
|
|
top: -92px;
|
|
}
|
|
|
|
.add {
|
|
border: 1px solid #FFFFFF;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.defultStyle {
|
|
display: table-cell;
|
|
vertical-align: middle;
|
|
text-align: center;
|
|
background-color: #C2C2C2;
|
|
}
|
|
|
|
|
|
.top {
|
|
position: absolute;
|
|
right: 30px;
|
|
top: -92px;
|
|
}
|
|
|
|
.add {
|
|
border: 1px solid #FFFFFF;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
.img {
|
|
width: 80px;
|
|
height: 80px;
|
|
border-radius: 20px;
|
|
background-color: #C2C2C2;
|
|
}
|
|
|
|
.img.yes {
|
|
background-color: #63BFB2;
|
|
}
|
|
.q-wrapper {
|
|
border-radius: 18px;
|
|
border: 1px solid #E7EBF5;
|
|
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
|
overflow-y: auto;
|
|
height: 830px;
|
|
|
|
}
|
|
</style> |