daikins/.svn/pristine/f6/f6e3e9f6597e4beb954b8d66483...

326 lines
9.8 KiB
Plaintext

<script setup lang="ts">
import AppBlock from '@/components/AppBlock.vue'
import { useMessage, NModal,NSelect,NSpace } from 'naive-ui'
import HomeHead from '@/views/home/components/HomeHead.vue'
import { getImg } from './images'
import { Plus } from '@element-plus/icons-vue'
import type { UploadProps, UploadUserFile } from 'element-plus'
import { useUserStore } from '@/stores/modules/user'
import { getLabActList, getLabCsrActList,addLab,getCateList } from '@/api/daikin/base'
import UserList from '@/views/home/intelligence/process/UserPages.vue'
const ids = ref('')
const {push} = useRouter()
const store = useUserStore()
const message = useMessage()
const header = { 'token': store.user.token }
const dialogImageUrl = ref('')
const dialogVisible = ref(false)
let swiperList = ref([])
const dataA =ref([])
const dataB =ref([])
const dataC =ref([])
const dogList = ref([])
const options = ref([])
const fuckList = ref()
const editB = ref({
fileList:[]
})
const shomkA = ref(false)
const memberUserLists =ref()
const leftUserLists =ref()
const rightUserLists =ref()
const bannerUserLists =ref()
const memberContentUserLists = ref()
const files =ref()
onMounted(async () => {
const { data } = await getLabActList()
dataA.value = data.bannerContent
dataB.value = data.leftContent
dataC.value = data.rightContent
ids.value = data.id
memberUserLists.value = data.memberUserList
leftUserLists.value = data.leftUserList
rightUserLists.value = data.rightUserList
bannerUserLists.value = data.bannerUserList
memberContentUserLists.value = data.memberContentUserList
if(data.memberContent.porList&&data.memberContent.porList.length>0){
dogList.value =data.memberContent.porList.map((obj: any,indx: number)=>({
...obj,
id:indx+1
}))
}
if(data.memberContent.file){
editB.value =data.memberContent.file
console.log( editB.value)
}
})
async function onSubmitAdd() {
const id = ids.value
const bannerContent = unref(dataA.value)
const leftContent = unref(dataB.value)
const rightContent = unref(dataC.value)
const porList = unref(dogList.value)
const file =unref(editB.value)
const bannerUserList = unref(bannerUserLists)
const leftUserList = unref(leftUserLists)
const rightUserList = unref(rightUserLists)
const memberUserList = unref(memberUserLists)
const { code, msg } = await addLab({ id,bannerUserList,leftUserList,rightUserList,memberUserList,bannerContent,leftContent,rightContent,memberContent:{file,porList}})
if (code === 200) { message.success("修改成功") }
else message.warning(msg)
}
async function onSubmits(row: { id: number; url: any; title: string; time: string; dowhat: string; files: never[]; fileList: never[] }) {
// dogList.value.push(row)
dogList.value.map(obj=>{
obj.id === row.id ? { ...obj, ...row } : obj
// console.log(i.id)
})
const existingIds = dogList.value.map(obj => obj.id);
if (!existingIds.includes(row.id)) {
if(row.id===''){
row.id = Math.floor(Math.random() * 100)
}
dogList.value.push(row);
}
shomkA.value = false
console.log(dogList.value)
}
const handleEdits = (index: number, row: any) => {
console.log(row)
if (row && row.url) {
if(row.files.length<=0){
row.files.push({ url: row.url });
}
else{
row.files.map(i=>{
i.url = i.response.url
})
}
} else {
fuckList.value = {
id:'',
url: '',
title: '',
time: '',
dowhat:'',
files: [],
fileList: [],
}
}
shomkA.value = true
if (!row) return
fuckList.value = row
console.log(fuckList.value)
}
const handleDeletes = (index: number, row: any) => {
dogList.value = dogList.value.filter(item => item.id !== row.id);
console.log(index, row)
}
const handleRemove: UploadProps['onRemove'] = (uploadFile: any, uploadFiles: any) => {
console.log(uploadFile, uploadFiles)
}
const handOnExceed: UploadProps['onExceed'] = (uploadFile: any, uploadFiles: any) => {
message.warning("最多只能上传一张图片!")
}
const handlePreviews: UploadProps['onSuccess'] = (uploadFile: any) => {
console.log("++++++++++++++++++++++++++++")
console.log(uploadFile)
if(uploadFile.code ===200){
fuckList.value.url = uploadFile.url
}
else{
message.warning(uploadFile.msg)
return
}
}
const handlePreview: UploadProps['onSuccess'] = (uploadFile: any) => {
console.log("++++++++++++++++++++++++++++")
console.log(uploadFile)
editB.value = uploadFile
onSubmitAdd()
}
const showModalRef = ref(false)
const beforeUpload=(file: { type: string })=> {
// Validate the file type before uploading
const isPDF = file.type === 'application/pdf';
if (!isPDF) {
message.error('仅支持PDF文件上传');
}
return isPDF;
}
const showModal = ref(false)
// 获取子组件传过来的值
const handleChild = (data: any) => {
const { showModal: show, multipleSelection } = data
showModal.value = unref(show)
// userList.value = multipleSelection
let userIdList: any[] =[]
multipleSelection.value.forEach((i: { userId: any })=>{
// console.log(dataList.value)
userIdList.push(i.userId)
})
memberUserLists.value = userIdList
onSubmitAdd()
}
const CloseThiss = (data: boolean)=>{
console.log(data)
showModal.value = data
}
const setUserList= ref()
const thisCli=()=>{
showModal.value = true
setUserList.value=memberContentUserLists.value
}
</script>
<template>
<div class="my30px overflow-y-auto h760px">
<el-button type="primary" @click="handleEdits" class="my20px">新增员工信息</el-button>
<el-upload v-model:file-list="editB.fileList" class="upload-demo h80px max-w150px" :before-upload="beforeUpload" :headers="header" :on-success="handlePreview"
action="/test-api/common/upload" :limit="1">
<el-button type="primary">选择需要上传的PDF文件</el-button>
</el-upload>
<el-table :data="dogList" style="width: 100%" :header-cell-style="{ background:'#2A7BF7',color:'#fff',height:'60px',textAlign: 'center','font-size':'24px'}" :cell-style="{ 'text-align': 'center'}">
<el-table-column label="照片" width="200">
<template #default="scope">
<div style="display: flex; align-items: center">
<div><img :src="scope.row.url" class="w150px"></div>
</div>
</template>
</el-table-column>
<el-table-column label="名字" prop="title" />
<el-table-column label="职务" prop="time" />
<el-table-column label="研究方向" prop="dowhat" />
<!-- <el-table-column label="通知范围" prop="memberContentUserLists" >
<template #default="scope">
<div v-if="memberContentUserLists" v-for="(it,index) in memberContentUserLists">
{{it.nickName}}
</div>
</template>
</el-table-column> -->
<el-table-column label="操作">
<template #default="scope">
<el-button size="small" @click="handleEdits(scope.$index, scope.row)">编辑</el-button>
<el-button size="small" type="danger" @click="handleDeletes(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<el-form-item>
<div class="my20px fixed bottom-25px left-20% z-2000 h50px w-full">
<el-button type="primary" @click="onSubmitAdd" >提交数据</el-button>
<el-button type="primary" @click="thisCli" > 查看范围</el-button>
</div>
</el-form-item>
<n-modal v-model:show="shomkA">
<div class="bg-#FFF p30px">
<el-form :model="fuckList" label-width="120px" :inline="true">
<el-form-item label="名字">
<el-input v-model="fuckList.title" />
</el-form-item>
<br>
<el-form-item label="照片">
<el-upload v-model:file-list="fuckList.files" :headers="header"
action="/test-api/common/upload" list-type="picture-card"
:on-success="handlePreviews" :on-remove="handleRemove" :on-exceed="handOnExceed" :limit="1">
<el-icon>
<Plus />
</el-icon>
</el-upload>
<br>
<el-dialog v-model="dialogVisible">
<img w-full :src="dialogImageUrl" alt="Preview Image" />
</el-dialog>
</el-form-item>
<br>
<el-form-item label="职位">
<el-input v-model="fuckList.time" />
</el-form-item>
<br>
<el-form-item label="研究方向">
<el-input v-model="fuckList.dowhat" />
</el-form-item>
<br>
<!-- <el-form-item label="文件">
<el-upload v-model:file-list="fuckList.fileList" class="upload-demo" :before-upload="beforeUpload" :headers="header"
action="/test-api/common/upload" >
<el-button type="primary">选择文件</el-button>
</el-upload>
</el-form-item> -->
</el-form>
<hr class="mb15px border-#f1f1f1">
<el-form-item>
<el-button type="primary" @click="onSubmits(fuckList)">确认</el-button>
</el-form-item>
</div>
</n-modal>
<n-modal v-model:show="showModal">
<UserList :userDataList="setUserList" @clickChild="handleChild" @CloseThis="CloseThiss"/>
</n-modal>
</template>
<style scoped lang="less">
.top {
position: absolute;
right: 30px;
top: -92px;
}
</style>