Compare commits
7 Commits
d80d0988d2
...
1f20c6f589
| Author | SHA1 | Date |
|---|---|---|
 wwl
|
1f20c6f589 | |
|
wwl
|
345e57e504 | |
|
wwl
|
8c43a7bde1 | |
|
wwl
|
4a98654782 | |
|
wwl
|
181bc06d63 | |
|
wwl
|
a955287aba | |
|
wwl
|
9ceffc71f9 |
|
|
@ -0,0 +1,11 @@
|
|||
{
|
||||
"trailingComma": "none",
|
||||
"semi": false,
|
||||
"singleQuote": true,
|
||||
"jsxSingleQuote": true,
|
||||
"arrowParens": "always",
|
||||
"printWidth": 100,
|
||||
"tabWidth": 2,
|
||||
"quoteProps": "preserve",
|
||||
"endOfLine": "auto"
|
||||
}
|
||||
|
|
@ -24,7 +24,8 @@
|
|||
"dayjs": "^1.11.10",
|
||||
"echarts": "^5.4.3",
|
||||
"echarts-liquidfill": "^3.1.0",
|
||||
"element-plus": "^2.3.7",
|
||||
"element-plus": "^2.6.2",
|
||||
"lodash-es": "^4.17.21",
|
||||
"lottie-web": "^5.12.2",
|
||||
"naive-ui": "^2.34.4",
|
||||
"pinia": "^2.0.32",
|
||||
|
|
|
|||
126
src/App.vue
126
src/App.vue
|
|
@ -1,7 +1,7 @@
|
|||
<script setup lang="ts">
|
||||
import { RouterView } from 'vue-router'
|
||||
import { useFullscreen, useFavicon, useTitle } from '@vueuse/core'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
import FitScreen from '@fit-screen/vue'
|
||||
import { NMessageProvider } from 'naive-ui'
|
||||
import { useUserStore } from '@/stores/modules/user'
|
||||
|
|
@ -26,55 +26,49 @@ store.getUser()
|
|||
const route = useRoute() // 获取当前的路由信息
|
||||
|
||||
const pageClass = computed(() => {
|
||||
// console.log(route.name)
|
||||
// if (navigator.userAgent.match(/iPad|Android Tablet/i)) {
|
||||
// // 这是一个平板设备
|
||||
// console.log("平板",navigator.userAgent)
|
||||
// } else {
|
||||
// // 这不是一个平板设备
|
||||
// console.log("电脑")
|
||||
// }
|
||||
// 根据路由信息返回不同的页面类名
|
||||
if (route.name === 'Entry') {
|
||||
return 'bg-#fff' // 假设关于页的类名为 page-about
|
||||
} else if (route.name === 'DataBase') {
|
||||
return 'bg-#fff'
|
||||
} else if (route.name === 'ExternalLogin' || route.name === 'Login') {
|
||||
return 'bg-#f3f3f3' // 假设关于页的类名为 page-about
|
||||
}
|
||||
return 'page' // 默认类名
|
||||
// console.log(route.name)
|
||||
// if (navigator.userAgent.match(/iPad|Android Tablet/i)) {
|
||||
// // 这是一个平板设备
|
||||
// console.log("平板",navigator.userAgent)
|
||||
// } else {
|
||||
// // 这不是一个平板设备
|
||||
// console.log("电脑")
|
||||
// }
|
||||
// 根据路由信息返回不同的页面类名
|
||||
if (route.name === 'Entry') {
|
||||
return 'bg-#fff' // 假设关于页的类名为 page-about
|
||||
} else if (route.name === 'DataBase') {
|
||||
return 'bg-#fff'
|
||||
} else if (route.name === 'ExternalLogin' || route.name === 'Login') {
|
||||
return 'bg-#f3f3f3' // 假设关于页的类名为 page-about
|
||||
}
|
||||
return 'page' // 默认类名
|
||||
})
|
||||
const pageStyle = computed(() => {
|
||||
// 根据路由信息返回不同的页面样式
|
||||
if (route.name === 'Entry') {
|
||||
return { 'background-color': '#fff !important' } // 假设关于页的类名为 page-about
|
||||
} else if (route.name === 'DataBase') {
|
||||
return { 'background-color': '#fff !important' }
|
||||
} else if (route.name === 'ExternalLogin' || route.name === 'Login') {
|
||||
return { 'background-color': '#f3f3f3 !important' } // 假设关于页的类名为 page-about
|
||||
}
|
||||
return {
|
||||
'background-image': `url(${img}) !important`,
|
||||
'background-position': '0 0',
|
||||
'background-repeat': 'no-repeat',
|
||||
'background-size': 'cover'
|
||||
} // 默认类名
|
||||
// 根据路由信息返回不同的页面样式
|
||||
if (route.name === 'Entry') {
|
||||
return { 'background-color': '#fff !important' } // 假设关于页的类名为 page-about
|
||||
} else if (route.name === 'DataBase') {
|
||||
return { 'background-color': '#fff !important' }
|
||||
} else if (route.name === 'ExternalLogin' || route.name === 'Login') {
|
||||
return { 'background-color': '#f3f3f3 !important' } // 假设关于页的类名为 page-about
|
||||
}
|
||||
return {
|
||||
'background-image': `url(${img}) !important`,
|
||||
'background-position': '0 0',
|
||||
'background-repeat': 'no-repeat',
|
||||
'background-size': 'cover'
|
||||
} // 默认类名
|
||||
})
|
||||
|
||||
const locale = computed(() => zhCn)
|
||||
|
||||
const scaleChange = ({
|
||||
widthRatio,
|
||||
heightRatio
|
||||
}: {
|
||||
widthRatio: number
|
||||
heightRatio: number
|
||||
}) => {
|
||||
console.log('scaleChange', widthRatio, heightRatio)
|
||||
const scaleChange = ({ widthRatio, heightRatio }: { widthRatio: number; heightRatio: number }) => {
|
||||
console.log('scaleChange', widthRatio, heightRatio)
|
||||
}
|
||||
const beforeCalculate = (scale) => {
|
||||
console.log('🚀 ~ scale:', scale)
|
||||
return false
|
||||
console.log('🚀 ~ scale:', scale)
|
||||
return false
|
||||
}
|
||||
// ref="fitscreenRef"
|
||||
// :width="screenWidth"
|
||||
|
|
@ -88,40 +82,40 @@ const beforeCalculate = (scale) => {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<NMessageProvider>
|
||||
<VScaleScreen
|
||||
ref="fitscreenRef"
|
||||
:width="screenWidth"
|
||||
:height="screenHeight"
|
||||
mode="fit"
|
||||
:box-style="pageStyle"
|
||||
>
|
||||
<!-- <div :class="pageClass"> -->
|
||||
<n-config-provider :locale="NZhCN" :date-locale="dateZhCN">
|
||||
<el-config-provider :locale="locale">
|
||||
<RouterView />
|
||||
</el-config-provider>
|
||||
</n-config-provider>
|
||||
<!-- </div> -->
|
||||
</VScaleScreen>
|
||||
</NMessageProvider>
|
||||
<NMessageProvider>
|
||||
<VScaleScreen
|
||||
ref="fitscreenRef"
|
||||
:width="screenWidth"
|
||||
:height="screenHeight"
|
||||
mode="fit"
|
||||
:box-style="pageStyle"
|
||||
>
|
||||
<!-- <div :class="pageClass"> -->
|
||||
<n-config-provider :locale="NZhCN" :date-locale="dateZhCN">
|
||||
<el-config-provider :locale="locale">
|
||||
<RouterView />
|
||||
</el-config-provider>
|
||||
</n-config-provider>
|
||||
<!-- </div> -->
|
||||
</VScaleScreen>
|
||||
</NMessageProvider>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.fit-screen {
|
||||
text-rendering: optimizeLegibility !important;
|
||||
text-rendering: optimizeLegibility !important;
|
||||
}
|
||||
.page,
|
||||
.v-screen-box {
|
||||
// background-image: url('@/assets/images/bg.jpg') !important;
|
||||
// background-position: 0 0;
|
||||
// background-repeat: no-repeat;
|
||||
// background-size: cover;
|
||||
// background-image: url('@/assets/images/bg.jpg') !important;
|
||||
// background-position: 0 0;
|
||||
// background-repeat: no-repeat;
|
||||
// background-size: cover;
|
||||
}
|
||||
.pages {
|
||||
background-color: #fff;
|
||||
background-color: #fff;
|
||||
}
|
||||
.pagess {
|
||||
background-color: #f3f3f3;
|
||||
background-color: #f3f3f3;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
Binary file not shown.
|
After Width: | Height: | Size: 235 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 104 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 105 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 116 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 112 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 18 KiB |
|
|
@ -1,27 +1,32 @@
|
|||
<template>
|
||||
<input type="text" placeholder="请输入搜索内容" @keydown.enter="keyDown" v-model="search"
|
||||
class="h-full w-full text-#fff text-18px pl30px pr54px placeholder-#fff" />
|
||||
<img src="@/assets/images/icon-search.svg" @click="clickThis" class="w22px h22px absolute right-24px top-50% -translate-y-50%" />
|
||||
<input
|
||||
type="text"
|
||||
placeholder="请输入搜索内容"
|
||||
@keydown.enter="keyDown"
|
||||
v-model="search"
|
||||
class="h-full w-full text-#fff text-18px pl30px pr54px placeholder-#fff"
|
||||
/>
|
||||
<img
|
||||
src="@/assets/images/icon-search.svg"
|
||||
@click="clickThis"
|
||||
class="w22px h22px absolute right-24px top-50% -translate-y-50%"
|
||||
/>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
|
||||
import { searchStore } from '@/stores/modules/search'
|
||||
const searchS = searchStore()
|
||||
const search = ref('')
|
||||
const { push } = useRouter()
|
||||
const keyDown=(e)=>{
|
||||
if(e.key ==='Enter'&&search.value)
|
||||
{
|
||||
searchS.search.content = search.value
|
||||
push({name:'Search'})
|
||||
const keyDown = (e) => {
|
||||
if (e.key === 'Enter' && search.value) {
|
||||
searchS.setArticle(search.value)
|
||||
push({ name: 'Search' })
|
||||
}
|
||||
}
|
||||
const clickThis = ()=>{
|
||||
if(search.value)
|
||||
{
|
||||
searchS.search.content = search.value
|
||||
push({name:'Search'})
|
||||
const clickThis = () => {
|
||||
if (search.value) {
|
||||
searchS.setArticle(search.value)
|
||||
push({ name: 'Search' })
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
</script>
|
||||
|
|
|
|||
1048
src/router/index.ts
1048
src/router/index.ts
File diff suppressed because it is too large
Load Diff
|
|
@ -1,17 +1,15 @@
|
|||
import { defineStore } from 'pinia'
|
||||
|
||||
|
||||
|
||||
|
||||
export const searchStore = defineStore('search', () => {
|
||||
const search = ref({
|
||||
content:''
|
||||
})
|
||||
|
||||
function setArticle(data: { content: string }){
|
||||
search.value = data
|
||||
}
|
||||
|
||||
return { search,setArticle }
|
||||
const search = ref({
|
||||
content: '',
|
||||
time: 0
|
||||
})
|
||||
|
||||
})
|
||||
function setArticle(data: string) {
|
||||
search.value.content = data
|
||||
search.value.time = new Date().getTime()
|
||||
}
|
||||
|
||||
return { search, setArticle }
|
||||
})
|
||||
|
|
|
|||
|
|
@ -10,73 +10,80 @@ import { cateFileList } from '@/api/daikin/base'
|
|||
const { day, week } = useDate()
|
||||
const { push } = useRouter()
|
||||
const array = ref<any[]>([
|
||||
{
|
||||
content1: '将扩大的机遇转为成果 更强更大地展翅飞翔',
|
||||
content2: 'ひろがるチャンスを 成果につなげ 強く大きく 羽ばたこう',
|
||||
year: '2023年'
|
||||
},
|
||||
{ content1: '领先时代的变化 开创崭新的未来', content2: '', year: '2022年' },
|
||||
{
|
||||
content1: '以“重大变化”为契机 向新课题发起挑战',
|
||||
content2: '',
|
||||
year: '2021年'
|
||||
},
|
||||
{
|
||||
content1: '加速推进三个协创 决胜于变化的时代',
|
||||
content2: '',
|
||||
year: '2020年'
|
||||
},
|
||||
{
|
||||
content1: '以三个协创为轴心 人人迅速果断行动',
|
||||
content2: '',
|
||||
year: '2016年'
|
||||
},
|
||||
{
|
||||
content1: '突破壁垒 集中优势 不断挑战新课题',
|
||||
content2: '',
|
||||
year: '2018年'
|
||||
},
|
||||
{
|
||||
content1: '坚持以人为轴心，融合新的力量',
|
||||
content2: '集团上下齐心协力提升企业价值',
|
||||
year: '2017年'
|
||||
},
|
||||
{ content1: '站稳脚跟 强化优势 大步迈进', content2: '', year: '2016年' },
|
||||
{ content1: '创造未来，决胜于变化的时代', content2: '', year: '2015年' }
|
||||
{
|
||||
content1: '将扩大的机遇转为成果 更强更大地展翅飞翔',
|
||||
content2: 'ひろがるチャンスを 成果につなげ 強く大きく 羽ばたこう',
|
||||
year: '2023年'
|
||||
},
|
||||
{ content1: '领先时代的变化 开创崭新的未来', content2: '', year: '2022年' },
|
||||
{
|
||||
content1: '以“重大变化”为契机 向新课题发起挑战',
|
||||
content2: '',
|
||||
year: '2021年'
|
||||
},
|
||||
{
|
||||
content1: '加速推进三个协创 决胜于变化的时代',
|
||||
content2: '',
|
||||
year: '2020年'
|
||||
},
|
||||
{
|
||||
content1: '以三个协创为轴心 人人迅速果断行动',
|
||||
content2: '',
|
||||
year: '2016年'
|
||||
},
|
||||
{
|
||||
content1: '突破壁垒 集中优势 不断挑战新课题',
|
||||
content2: '',
|
||||
year: '2018年'
|
||||
},
|
||||
{
|
||||
content1: '坚持以人为轴心，融合新的力量',
|
||||
content2: '集团上下齐心协力提升企业价值',
|
||||
year: '2017年'
|
||||
},
|
||||
{ content1: '站稳脚跟 强化优势 大步迈进', content2: '', year: '2016年' },
|
||||
{ content1: '创造未来，决胜于变化的时代', content2: '', year: '2015年' }
|
||||
])
|
||||
|
||||
const fileItem = ref<any>({})
|
||||
const fileItemTwo = ref<any>({})
|
||||
const message = useMessage()
|
||||
const getFile = async () => {
|
||||
const { rows }: any = await cateFileList({
|
||||
cateId: 261,
|
||||
pageNum: 1,
|
||||
pageSize: 100
|
||||
})
|
||||
fileItem.value = rows.find((item: any) => item.id == 1693) || {}
|
||||
const { rows }: any = await cateFileList({
|
||||
cateId: 261,
|
||||
pageNum: 1,
|
||||
pageSize: 100
|
||||
})
|
||||
fileItem.value = rows.find((item: any) => item.id == 1693) || {}
|
||||
const { rows: rowsTow }: any = await cateFileList({
|
||||
cateId: 265,
|
||||
pageNum: 1,
|
||||
pageSize: 100
|
||||
})
|
||||
fileItemTwo.value = rowsTow.find((item: any) => item.id == 1854) || {}
|
||||
}
|
||||
const goFile = () => {
|
||||
const { isSelect, filePath } = fileItem.value
|
||||
if (!isSelect || isSelect === 2) {
|
||||
message.info('没有访问权限!')
|
||||
return
|
||||
}
|
||||
if (!filePath) {
|
||||
message.info('暂无文件')
|
||||
}
|
||||
window.open(filePath)
|
||||
const goFile = (row: any) => {
|
||||
const { isSelect, filePath } = row
|
||||
if (!isSelect || isSelect === 2) {
|
||||
message.info('没有访问权限!')
|
||||
return
|
||||
}
|
||||
if (!filePath) {
|
||||
message.info('暂无文件')
|
||||
}
|
||||
window.open(filePath)
|
||||
}
|
||||
|
||||
getFile()
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<HomeHead class="top">
|
||||
<template #content>
|
||||
<!-- <HomeHeadSearch /> -->
|
||||
</template>
|
||||
</HomeHead>
|
||||
<!-- <div class="h-full relative flex flex-col">
|
||||
<HomeHead class="top">
|
||||
<template #content>
|
||||
<!-- <HomeHeadSearch /> -->
|
||||
</template>
|
||||
</HomeHead>
|
||||
<!-- <div class="h-full relative flex flex-col">
|
||||
<div class="font-600 flex items-end mt27px">
|
||||
<div class="text-36px">集团方针</div>
|
||||
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
||||
|
|
@ -96,49 +103,64 @@ getFile()
|
|||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="mt30px mr20px flex w100% relative">
|
||||
<!-- <img src="../../assets/images/fangz.png" class="w100%"/> -->
|
||||
<img src="../../assets/images/fzqiet.png" class="w100%" />
|
||||
<div
|
||||
class="absolute py10px left-1160px top-270px pb-0px z-100 text-20px text-#285FE9 flex justify-center items-center hover:border-b-1px hover:border-b-solid hover:border-b-#285FE9 hover:cursor-pointer"
|
||||
@click="goFile"
|
||||
>
|
||||
<img src="../../assets/images/wjqq@2x.png" class="w18px h20px mr8px" />
|
||||
2024年グループ年頭方针
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt30px mr20px flex w100% relative">
|
||||
<!-- <img src="../../assets/images/fangz.png" class="w100%"/> -->
|
||||
<!-- <img src="../../assets/images/fzqiet.png" class="w100%" />
|
||||
<div
|
||||
class="absolute py10px left-1160px top-270px pb-0px z-100 text-20px text-#285FE9 flex justify-center items-center hover:border-b-1px hover:border-b-solid hover:border-b-#285FE9 hover:cursor-pointer"
|
||||
@click="goFile"
|
||||
>
|
||||
<img src="../../assets/images/wjqq@2x.png" class="w18px h20px mr8px" />
|
||||
2024年グループ年頭方针
|
||||
</div> -->
|
||||
<img src="../../assets/images/2024fz.jpg" class="w100%" />
|
||||
<div
|
||||
class="absolute py10px left-880px top-250px pb-0px z-100 text-20px text-#285FE9 flex justify-center items-center hover:border-b-1px hover:border-b-solid hover:border-b-#285FE9 hover:cursor-pointer"
|
||||
@click="goFile(fileItem)"
|
||||
>
|
||||
<img src="../../assets/images/wjqq@2x.png" class="w18px h20px mr8px" />
|
||||
2024年グループ年頭方针
|
||||
</div>
|
||||
<div
|
||||
class="absolute py10px left-920px top-645px pb-0px z-100 text-20px text-#285FE9 flex justify-center items-center hover:border-b-1px hover:border-b-solid hover:border-b-#285FE9 hover:cursor-pointer"
|
||||
@click="goFile(fileItemTwo)"
|
||||
>
|
||||
<img src="../../assets/images/wjqq@2x.png" class="w18px h20px mr8px" />
|
||||
2024年调达方针说明会
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.top {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
}
|
||||
|
||||
.g-wrapper {
|
||||
border-radius: 18px;
|
||||
border: 1px solid #e7ebf5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: hidden;
|
||||
border-radius: 18px;
|
||||
border: 1px solid #e7ebf5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: hidden;
|
||||
|
||||
.timeline {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #142142;
|
||||
.timeline {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #142142;
|
||||
|
||||
.one {
|
||||
position: relative;
|
||||
.year {
|
||||
left: -132px;
|
||||
top: -14px;
|
||||
color: #003cb7;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.one {
|
||||
position: relative;
|
||||
.year {
|
||||
left: -132px;
|
||||
top: -14px;
|
||||
color: #003cb7;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -17,44 +17,44 @@ const newId = ref<string>()
|
|||
const scale = ref(1)
|
||||
const imgW = ref('auto')
|
||||
const pageInfo = reactive({
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
type: '1',
|
||||
total: 10
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
type: '1',
|
||||
total: 10
|
||||
})
|
||||
const listData = ref([])
|
||||
|
||||
async function setModule(codes: any) {
|
||||
const moduleCode = codes
|
||||
await report({ moduleCode })
|
||||
const moduleCode = codes
|
||||
await report({ moduleCode })
|
||||
}
|
||||
|
||||
const toDetail = (n: any, item: any) => {
|
||||
// push(`${route.path}/${item.id}`)
|
||||
// if(n.isSelect===1){
|
||||
setModule(item)
|
||||
push(`/external/info/${n.id}`)
|
||||
// }
|
||||
// else{
|
||||
// message.info("您没有权限查看！")
|
||||
// }
|
||||
// push(`${route.path}/${item.id}`)
|
||||
// if(n.isSelect===1){
|
||||
setModule(item)
|
||||
push(`/external/info/${n.id}`)
|
||||
// }
|
||||
// else{
|
||||
// message.info("您没有权限查看！")
|
||||
// }
|
||||
}
|
||||
|
||||
const toList = (nb) => {
|
||||
if (nb === 7) {
|
||||
pages.page.cate = '7'
|
||||
pages.page.title = 'News'
|
||||
} else {
|
||||
pages.page.cate = '8'
|
||||
pages.page.title = '重要通知'
|
||||
}
|
||||
replace(`/external/info/${nb === 7 ? 'news' : 'info'}`)
|
||||
// push({ name: 'DetailInfoList' })
|
||||
if (nb === 7) {
|
||||
pages.page.cate = '7'
|
||||
pages.page.title = 'News'
|
||||
} else {
|
||||
pages.page.cate = '8'
|
||||
pages.page.title = '重要通知'
|
||||
}
|
||||
replace(`/external/info/${nb === 7 ? 'news' : 'info'}`)
|
||||
// push({ name: 'DetailInfoList' })
|
||||
}
|
||||
|
||||
const SideNews = [
|
||||
{ key: 'IntelligenceWithin', name: 'News', cate: 7, type: 0 },
|
||||
{ key: 'IntelligenceOutside', name: '重要通知', cate: 8, type: 1 }
|
||||
{ key: 'IntelligenceWithin', name: 'News', cate: 7, type: 0 },
|
||||
{ key: 'IntelligenceOutside', name: '重要通知', cate: 8, type: 1 }
|
||||
]
|
||||
|
||||
// 获取News数据 getArticlePage
|
||||
|
|
@ -63,16 +63,15 @@ const newsSoll = ref<HTMLElement | null>(null)
|
|||
let newLength: number
|
||||
let newPum = 1
|
||||
async function getArticle(page: any) {
|
||||
const pasr = {
|
||||
pageNum: page,
|
||||
pageSize: '10',
|
||||
type: '1',
|
||||
cate: '7'
|
||||
}
|
||||
const { rows, total } = await externalList(pasr)
|
||||
console.log('🚀 ~ file: Detail.vue:46 ~ rows:', rows)
|
||||
newsList.value = rows || []
|
||||
newLength = total / 10
|
||||
const pasr = {
|
||||
pageNum: page,
|
||||
pageSize: '10',
|
||||
type: '1',
|
||||
cate: '7'
|
||||
}
|
||||
const { rows, total } = await externalList(pasr)
|
||||
newsList.value = rows || []
|
||||
newLength = total / 10
|
||||
}
|
||||
// 获取重要通知数据 getArticlePage
|
||||
const portantList = ref<any[]>([])
|
||||
|
|
@ -80,395 +79,379 @@ const portant = ref<HTMLElement | null>(null)
|
|||
let pLenght: number
|
||||
let prpum = 1
|
||||
async function getArticleP(page: any) {
|
||||
const pasr = {
|
||||
pageNum: page,
|
||||
pageSize: '10',
|
||||
type: '1',
|
||||
cate: '8'
|
||||
}
|
||||
const { rows, total } = await externalList(pasr)
|
||||
portantList.value = rows || []
|
||||
pLenght = total / 10
|
||||
const pasr = {
|
||||
pageNum: page,
|
||||
pageSize: '10',
|
||||
type: '1',
|
||||
cate: '8'
|
||||
}
|
||||
const { rows, total } = await externalList(pasr)
|
||||
portantList.value = rows || []
|
||||
pLenght = total / 10
|
||||
}
|
||||
|
||||
const state = ref<any>({})
|
||||
const type = ref('')
|
||||
watchEffect(() => {
|
||||
const { id } = route.params as any
|
||||
if (!id) return
|
||||
newId.value = id as string
|
||||
scale.value = id === '701' ? 2 : ['778', '840', '887'].includes(id) ? 1.5 : 1
|
||||
imgW.value = id !== '1241' ? '100%' : 'auto'
|
||||
getArticleP(1)
|
||||
getArticle(1)
|
||||
getData()
|
||||
const { id } = route.params as any
|
||||
if (!id) return
|
||||
newId.value = id as string
|
||||
scale.value = id === '701' ? 2 : ['778', '840', '887'].includes(id) ? 1.5 : 1
|
||||
imgW.value = id !== '1241' ? '100%' : 'auto'
|
||||
getArticleP(1)
|
||||
getArticle(1)
|
||||
getData()
|
||||
})
|
||||
|
||||
async function getData() {
|
||||
const { id } = route.params
|
||||
if (!id) return
|
||||
if (id == 'news' || id == 'info') {
|
||||
const { rows, total } = await externalList({
|
||||
pageNum: pageInfo.currentPage,
|
||||
pageSize: pageInfo.pageSize,
|
||||
type: pageInfo.type,
|
||||
cate: id === 'news' ? '7' : '8'
|
||||
})
|
||||
type.value = id == 'news' ? 'News' : '重要通知'
|
||||
pageInfo.total = total
|
||||
listData.value = rows
|
||||
return
|
||||
}
|
||||
listData.value = []
|
||||
type.value = ''
|
||||
const { data } = await externalInfo(id as string)
|
||||
data.tagColor = data.tag === '紧急' ? '#e60e0e' : '#2cba06'
|
||||
const { id } = route.params
|
||||
if (!id) return
|
||||
if (id == 'news' || id == 'info') {
|
||||
const { rows, total } = await externalList({
|
||||
pageNum: pageInfo.currentPage,
|
||||
pageSize: pageInfo.pageSize,
|
||||
type: pageInfo.type,
|
||||
cate: id === 'news' ? '7' : '8'
|
||||
})
|
||||
type.value = id == 'news' ? 'News' : '重要通知'
|
||||
pageInfo.total = total
|
||||
listData.value = rows
|
||||
return
|
||||
}
|
||||
listData.value = []
|
||||
type.value = ''
|
||||
const { data } = await externalInfo(id as string)
|
||||
data.tagColor = data.tag === '紧急' ? '#e60e0e' : '#2cba06'
|
||||
|
||||
data.content = unescapeHTML(data.content)
|
||||
state.value = data
|
||||
console.log(state)
|
||||
data.content = unescapeHTML(data.content)
|
||||
state.value = data
|
||||
console.log(state)
|
||||
}
|
||||
function unescapeHTML(html: string) {
|
||||
const doc = new DOMParser().parseFromString(html, 'text/html')
|
||||
return doc.documentElement.textContent
|
||||
const doc = new DOMParser().parseFromString(html, 'text/html')
|
||||
return doc.documentElement.textContent
|
||||
}
|
||||
const handleSizeChange = (e) => {
|
||||
pageInfo.pageSize = e
|
||||
pageInfo.currentPage = 1
|
||||
getData()
|
||||
pageInfo.pageSize = e
|
||||
pageInfo.currentPage = 1
|
||||
getData()
|
||||
}
|
||||
|
||||
const handleCurrentChange = (e) => {
|
||||
pageInfo.currentPage = e
|
||||
getData()
|
||||
pageInfo.currentPage = e
|
||||
getData()
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page w-1920px h-1080px p30px flex flex-col">
|
||||
<HomeHead class="top">
|
||||
<!-- <template #content>
|
||||
<div class="page w-1920px h-1080px p30px flex flex-col">
|
||||
<HomeHead class="top">
|
||||
<!-- <template #content>
|
||||
<HomeHeadSearch />
|
||||
</template> -->
|
||||
</HomeHead>
|
||||
<div style="width: 400px" class="flex items-end absolute">
|
||||
<!-- <img src="../images/ͼƬ1.png" alt=""> -->
|
||||
<div v-if="false">
|
||||
<span style="font-size: 20px; margin-top: -50px"
|
||||
>大金空调调达本部HOMEPAGE</span
|
||||
>
|
||||
<el-button
|
||||
class=""
|
||||
style="font-size: 18px; margin-left: 5px"
|
||||
type="primary"
|
||||
round
|
||||
@click="push({ name: 'external' })"
|
||||
>
|
||||
<!-- <img src="../images/fanhui.png" alt=""> -->
|
||||
返回</el-button
|
||||
>
|
||||
</div>
|
||||
</HomeHead>
|
||||
<div style="width: 400px" class="flex items-end absolute">
|
||||
<!-- <img src="../images/ͼƬ1.png" alt=""> -->
|
||||
<div v-if="false">
|
||||
<span style="font-size: 20px; margin-top: -50px">大金空调调达本部HOMEPAGE</span>
|
||||
<el-button
|
||||
class=""
|
||||
style="font-size: 18px; margin-left: 5px"
|
||||
type="primary"
|
||||
round
|
||||
@click="push({ name: 'external' })"
|
||||
>
|
||||
<!-- <img src="../images/fanhui.png" alt=""> -->
|
||||
返回</el-button
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="w300px -mr-1px flex flex-col shrink-0">
|
||||
<div class="text-20px text-#fff font-600 mt6px">
|
||||
大金中国调达本部 HOMEPAGE
|
||||
</div>
|
||||
<!-- @dblclick="toggle" -->
|
||||
<img src="@/assets/images/logo.png" class="w197px h44px mt14px" />
|
||||
</div>
|
||||
<!-- class="p-10 bg-[#3870E5] !w-[110px] !w-[48px] rounded-[24px] flex justify-center items-center" -->
|
||||
<el-button
|
||||
style="font-size: 18px; margin-left: 5px;background-color;:#3870E5;margin-bottom: 6px;"
|
||||
type="primary"
|
||||
round
|
||||
@click="push({ name: 'external' })"
|
||||
>
|
||||
<img src="../images/fanhui.png" class="w-[27px] h-[20px] mr-2" alt="" />
|
||||
返回
|
||||
</el-button>
|
||||
</div>
|
||||
<div class="w300px -mr-1px flex flex-col shrink-0">
|
||||
<div class="text-20px text-#fff font-600 mt6px">大金中国调达本部 HOMEPAGE</div>
|
||||
<!-- @dblclick="toggle" -->
|
||||
<img src="@/assets/images/logo.png" class="w197px h44px mt14px" />
|
||||
</div>
|
||||
<!-- class="p-10 bg-[#3870E5] !w-[110px] !w-[48px] rounded-[24px] flex justify-center items-center" -->
|
||||
<el-button
|
||||
style="font-size: 18px; margin-left: 5px;background-color;:#3870E5;margin-bottom: 6px;"
|
||||
type="primary"
|
||||
round
|
||||
@click="push({ name: 'external' })"
|
||||
>
|
||||
<img src="../images/fanhui.png" class="w-[27px] h-[20px] mr-2" alt="" />
|
||||
返回
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<!-- <div class="h-full flex ml30px">
|
||||
<!-- <div class="h-full flex ml30px">
|
||||
<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 class="main flex-1 rd-32px pt60px mt22px page-wrap">
|
||||
<div class="absolute text-white top-18px left-30px">
|
||||
<n-breadcrumb separator=">">
|
||||
<n-breadcrumb-item @click="push({ name: 'external' })">
|
||||
外部首页</n-breadcrumb-item
|
||||
>
|
||||
<n-breadcrumb-item> {{ type || state.title }}</n-breadcrumb-item>
|
||||
</n-breadcrumb>
|
||||
</div>
|
||||
<!-- <div class="page-wrap h-934px mt24px" style="grid-template-columns: 1fr"> -->
|
||||
<div class="page-main ml-28px mb-30px">
|
||||
<AppBlock class="h-full">
|
||||
<div
|
||||
class="q-wrapper relative flex-1 text-#142142 flex flex-col bg-#fff p30px pl80px h-full"
|
||||
v-if="listData.length"
|
||||
>
|
||||
<img
|
||||
src="../images/beijq.png"
|
||||
class="absolute bottom-0 left-0 right-0 z w-full"
|
||||
/>
|
||||
<div
|
||||
class="mt8px cursor-pointer flex flex-wrap flex-col p15px pl20px text-18px max-w-100%"
|
||||
>
|
||||
<div
|
||||
v-for="i in listData"
|
||||
:key="i"
|
||||
class="w-70% mb-20px flex items-center justify-between flex-1"
|
||||
>
|
||||
<div
|
||||
class="truncate flex-1 text-#142142 hover:underline"
|
||||
@click="push(`/external/info/${i.id}`)"
|
||||
>
|
||||
<img
|
||||
v-if="i.tag === 'New'"
|
||||
src="../images/NEW@2x.png"
|
||||
class="h24px mr5px badge-new"
|
||||
/>
|
||||
<span
|
||||
v-if="i.isTop === 'Y'"
|
||||
class="text-#fff bg-red p5px text-16px rounded-5px mr-5px badge-24"
|
||||
>置顶</span
|
||||
>
|
||||
<span
|
||||
class="no-underline"
|
||||
:style="i.isRead === 2 ? 'color:#0058E5' : ''"
|
||||
>
|
||||
{{ i.title }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="shrink-0 ml100px w-200px text-#808696">
|
||||
{{ i.createTime }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="absolute bottom-20px left-50% translate-x-[-50%] z-11">
|
||||
<el-pagination
|
||||
background
|
||||
v-model:current-page="pageInfo.currentPage"
|
||||
v-model:page-size="pageInfo.pageSize"
|
||||
layout="prev, pager, next, total,jumper,->"
|
||||
:total="pageInfo.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="overflow-y-auto h-full">
|
||||
<div class="px46px py40px">
|
||||
<DetailNews
|
||||
:title="state.title"
|
||||
:content="state.content"
|
||||
:publishTime="state.publishTime"
|
||||
:tag="state.tag"
|
||||
:tagColor="state.tagColor"
|
||||
:source="state.source"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
<div class="flex-col mr-30px">
|
||||
<div class="mb-26px" v-for="item in SideNews" :key="item.key">
|
||||
<AppBlock class="h410px">
|
||||
<div class="box h-full">
|
||||
<div
|
||||
class="box-title flex items-center"
|
||||
@click="toList(item.cate)"
|
||||
>
|
||||
<span class="flex-1">{{ item.name }}</span>
|
||||
<span>❯</span>
|
||||
</div>
|
||||
<!-- hover:bg-[#2c7af7] -->
|
||||
<div class="box-content overflow-y-auto px22px py-4px">
|
||||
<div
|
||||
class="line hover:bg-gray-100 hover:text-white hover:cursor-pointer hover:rounded-[10px]"
|
||||
v-for="i in [newsList, portantList][item.type]"
|
||||
:key="i.id"
|
||||
@click="toDetail(i, 'App_E_News')"
|
||||
>
|
||||
<div class="flex flex-col">
|
||||
<div class="truncate">
|
||||
<img
|
||||
v-if="i.tag === 'New'"
|
||||
src="../images/NEW@2x.png"
|
||||
class="h35px mr5px badge-new !h-20px"
|
||||
/>
|
||||
<!-- <span
|
||||
<div class="main flex-1 rd-32px pt60px mt22px page-wrap">
|
||||
<div class="absolute text-white top-18px left-30px">
|
||||
<n-breadcrumb separator=">">
|
||||
<n-breadcrumb-item @click="push({ name: 'external' })"> 外部首页</n-breadcrumb-item>
|
||||
<n-breadcrumb-item> {{ type || state.title }}</n-breadcrumb-item>
|
||||
</n-breadcrumb>
|
||||
</div>
|
||||
<!-- <div class="page-wrap h-934px mt24px" style="grid-template-columns: 1fr"> -->
|
||||
<div class="page-main ml-28px mb-30px">
|
||||
<AppBlock class="h-full">
|
||||
<div
|
||||
class="q-wrapper relative flex-1 text-#142142 flex flex-col bg-#fff p30px pl80px h-full"
|
||||
v-if="listData.length"
|
||||
>
|
||||
<img src="../images/beijq.png" class="absolute bottom-0 left-0 right-0 z w-full" />
|
||||
<div
|
||||
class="mt8px cursor-pointer flex flex-wrap flex-col p15px pl20px text-18px max-w-100%"
|
||||
>
|
||||
<div
|
||||
v-for="i in listData"
|
||||
:key="i"
|
||||
class="w-70% mb-20px flex items-center justify-between flex-1"
|
||||
>
|
||||
<div
|
||||
class="truncate flex-1 text-#142142 hover:underline"
|
||||
@click="push(`/external/info/${i.id}`)"
|
||||
>
|
||||
<img
|
||||
v-if="i.tag === 'New'"
|
||||
src="../images/NEW@2x.png"
|
||||
class="h24px mr5px badge-new"
|
||||
/>
|
||||
<span
|
||||
v-if="i.isTop === 'Y'"
|
||||
class="text-#fff bg-red p5px text-16px rounded-5px mr-5px badge-24"
|
||||
>置顶</span
|
||||
>
|
||||
<span class="no-underline" :style="i.isRead === 2 ? 'color:#0058E5' : ''">
|
||||
{{ i.title }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="shrink-0 ml100px w-200px text-#808696">
|
||||
{{ i.createTime }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="absolute bottom-20px left-50% translate-x-[-50%] z-11">
|
||||
<el-pagination
|
||||
background
|
||||
v-model:current-page="pageInfo.currentPage"
|
||||
v-model:page-size="pageInfo.pageSize"
|
||||
layout="prev, pager, next, total,jumper,->"
|
||||
:total="pageInfo.total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="overflow-y-auto h-full">
|
||||
<div class="px46px py40px">
|
||||
<DetailNews
|
||||
:title="state.title"
|
||||
:content="state.content"
|
||||
:publishTime="state.publishTime"
|
||||
:tag="state.tag"
|
||||
:tagColor="state.tagColor"
|
||||
:source="state.source"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
<div class="flex-col mr-30px">
|
||||
<div class="mb-26px" v-for="item in SideNews" :key="item.key">
|
||||
<AppBlock class="h410px">
|
||||
<div class="box h-full">
|
||||
<div class="box-title flex items-center" @click="toList(item.cate)">
|
||||
<span class="flex-1">{{ item.name }}</span>
|
||||
<span>❯</span>
|
||||
</div>
|
||||
<!-- hover:bg-[#2c7af7] -->
|
||||
<div class="box-content overflow-y-auto px22px py-4px">
|
||||
<div
|
||||
class="line hover:bg-gray-100 hover:text-white hover:cursor-pointer hover:rounded-[10px]"
|
||||
v-for="i in [newsList, portantList][item.type]"
|
||||
:key="i.id"
|
||||
@click="toDetail(i, 'App_E_News')"
|
||||
>
|
||||
<div class="flex flex-col">
|
||||
<div class="truncate">
|
||||
<img
|
||||
v-if="i.tag === 'New'"
|
||||
src="../images/NEW@2x.png"
|
||||
class="h35px mr5px badge-new !h-20px"
|
||||
/>
|
||||
<!-- <span
|
||||
v-if="i.tag === '紧急'"
|
||||
class="text-#fff bg-[#E60E0E] p5px text-14px rounded-5px mr-5px badge-24"
|
||||
/> -->
|
||||
<span
|
||||
v-if="i.isTop === 'Y'"
|
||||
class="text-#fff bg-red p5px text-14px rounded-5px mr-5px badge-24"
|
||||
>置顶</span
|
||||
>
|
||||
<span
|
||||
:style="
|
||||
i.isRead === 2 ? 'color:#0058E5;font-weight:bolb' : ''
|
||||
"
|
||||
:title="i.title"
|
||||
>{{ i.title }}</span
|
||||
>
|
||||
</div>
|
||||
<span
|
||||
v-if="i.isTop === 'Y'"
|
||||
class="text-#fff bg-red p5px text-14px rounded-5px mr-5px badge-24"
|
||||
>置顶</span
|
||||
>
|
||||
<span
|
||||
:style="i.isRead === 2 ? 'color:#0058E5;font-weight:bolb' : ''"
|
||||
:title="i.title"
|
||||
>{{ i.title }}</span
|
||||
>
|
||||
</div>
|
||||
|
||||
<!-- <div
|
||||
<!-- <div
|
||||
class="icons min-w-110px w110px h20px mt15px absolute right-0px top-0 text-black"
|
||||
> -->
|
||||
<div class="min-w-110px w110px text-black mb-8px ml-auto">
|
||||
{{ i.createTime?.substring(0, 10) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="min-w-110px w110px text-black mb-8px ml-auto">
|
||||
{{ i.createTime?.substring(0, 10) }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.back {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 5px;
|
||||
color: #fff;
|
||||
// z-index: 500;
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
left: 5px;
|
||||
color: #fff;
|
||||
// z-index: 500;
|
||||
|
||||
// font-weight: bold;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
// display: flex;
|
||||
font-size: 14px;
|
||||
// font-weight: bold;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
// display: flex;
|
||||
font-size: 14px;
|
||||
}
|
||||
.top {
|
||||
right: 30px;
|
||||
top: -10px;
|
||||
right: 30px;
|
||||
top: -10px;
|
||||
}
|
||||
.page {
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
font-family: 'PingFang SC';
|
||||
user-select: none;
|
||||
background: 0;
|
||||
// background-image: url('@/assets/images/bg.jpg');
|
||||
// background-color: #000;
|
||||
// background-position: 0 0;
|
||||
// background-repeat: no-repeat;
|
||||
// background-size: cover;
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
height: 100px;
|
||||
font-family: 'PingFang SC';
|
||||
user-select: none;
|
||||
background: 0;
|
||||
// background-image: url('@/assets/images/bg.jpg');
|
||||
// background-color: #000;
|
||||
// background-position: 0 0;
|
||||
// background-repeat: no-repeat;
|
||||
// background-size: cover;
|
||||
color: #fff;
|
||||
|
||||
line-height: 1;
|
||||
.page-wrap {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 414px;
|
||||
grid-template-rows: repeat(2, 1fr);
|
||||
grid-column-gap: 30px;
|
||||
grid-row-gap: 30px;
|
||||
height: 936px;
|
||||
line-height: 1;
|
||||
.page-wrap {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 414px;
|
||||
grid-template-rows: repeat(2, 1fr);
|
||||
grid-column-gap: 30px;
|
||||
grid-row-gap: 30px;
|
||||
height: 936px;
|
||||
|
||||
.page-main {
|
||||
height: 850px;
|
||||
// padding-bottom: 20px;
|
||||
// grid-area: 1 / 1 / 3 / 2;
|
||||
}
|
||||
.page-side {
|
||||
margin-right: 30px;
|
||||
// height: 100%;
|
||||
// grid-area: 1 / 2 / 2 / 3;
|
||||
&:last-of-type {
|
||||
// height: 300px;
|
||||
// grid-area: 2 / 2 / 3 / 3;
|
||||
}
|
||||
}
|
||||
}
|
||||
.page-main {
|
||||
height: 850px;
|
||||
// padding-bottom: 20px;
|
||||
// grid-area: 1 / 1 / 3 / 2;
|
||||
}
|
||||
.page-side {
|
||||
margin-right: 30px;
|
||||
// height: 100%;
|
||||
// grid-area: 1 / 2 / 2 / 3;
|
||||
&:last-of-type {
|
||||
// height: 300px;
|
||||
// grid-area: 2 / 2 / 3 / 3;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.main {
|
||||
background-image: url('@/assets/images/bg-rs-main.svg');
|
||||
background-position: 0 0;
|
||||
background-repeat: repeat-x;
|
||||
background-size: auto;
|
||||
background-image: url('@/assets/images/bg-rs-main.svg');
|
||||
background-position: 0 0;
|
||||
background-repeat: repeat-x;
|
||||
background-size: auto;
|
||||
}
|
||||
|
||||
.box {
|
||||
--title-h: 58px;
|
||||
--title-h: 58px;
|
||||
|
||||
border: 0;
|
||||
.box-title {
|
||||
height: var(--title-h);
|
||||
color: #fff;
|
||||
background-color: #537deb;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
padding: 0 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.box-content {
|
||||
height: 100%;
|
||||
max-height: calc(100% - var(--title-h));
|
||||
}
|
||||
border: 0;
|
||||
.box-title {
|
||||
height: var(--title-h);
|
||||
color: #fff;
|
||||
background-color: #537deb;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
padding: 0 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.box-content {
|
||||
height: 100%;
|
||||
max-height: calc(100% - var(--title-h));
|
||||
}
|
||||
}
|
||||
.line {
|
||||
border-bottom: 1px solid #eef3fb;
|
||||
border-bottom: 1px solid #eef3fb;
|
||||
}
|
||||
|
||||
.badge-24 {
|
||||
box-sizing: border-box;
|
||||
height: 24px;
|
||||
display: inline-block;
|
||||
line-height: 24px;
|
||||
padding: 0 5px;
|
||||
box-sizing: border-box;
|
||||
height: 24px;
|
||||
display: inline-block;
|
||||
line-height: 24px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.truncate {
|
||||
max-width: 395px;
|
||||
min-width: 100px;
|
||||
overflow: hidden;
|
||||
padding: 4px 0 4px 6px;
|
||||
line-height: 24px;
|
||||
color: black;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
max-width: 395px;
|
||||
min-width: 100px;
|
||||
overflow: hidden;
|
||||
padding: 4px 0 4px 6px;
|
||||
line-height: 24px;
|
||||
color: black;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
::v-deep(.n-breadcrumb-item__link) {
|
||||
color: #fff !important;
|
||||
font-size: 18px !important;
|
||||
font-size: 16px !important;
|
||||
font-weight: 600 !important;
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
color: #fff !important;
|
||||
font-size: 18px !important;
|
||||
font-size: 16px !important;
|
||||
font-weight: 600 !important;
|
||||
&:hover {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
::v-deep {
|
||||
.el-pagination {
|
||||
--el-pagination-border-radius: 8px;
|
||||
}
|
||||
.n-breadcrumb-item__separator {
|
||||
color: #fff !important;
|
||||
font-size: 16px !important;
|
||||
}
|
||||
span > img {
|
||||
width: v-bind(imgW);
|
||||
object-fit: contain;
|
||||
}
|
||||
p > img {
|
||||
// width: 100%;
|
||||
// object-fit: contain;
|
||||
// transform: scale(1.5);
|
||||
// width: v-bind(imgW);
|
||||
transform: scale(v-bind(scale));
|
||||
transform-origin: top;
|
||||
}
|
||||
.el-pagination {
|
||||
--el-pagination-border-radius: 8px;
|
||||
}
|
||||
.n-breadcrumb-item__separator {
|
||||
color: #fff !important;
|
||||
font-size: 16px !important;
|
||||
}
|
||||
span > img {
|
||||
// width: v-bind(imgW);
|
||||
width: auto;
|
||||
object-fit: contain;
|
||||
}
|
||||
p > img {
|
||||
// width: 100%;
|
||||
// object-fit: contain;
|
||||
// transform: scale(1.5);
|
||||
// width: v-bind(imgW);
|
||||
transform: scale(v-bind(scale));
|
||||
transform-origin: top;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,27 +1,54 @@
|
|||
<script setup lang="ts">
|
||||
import { getArticlePage, report, cateFileList } from '@/api/daikin/base'
|
||||
import { getArticlePage, report, cateFileList, newDataList } from '@/api/daikin/base'
|
||||
import { message } from '@/utils/message'
|
||||
import { Swiper, SwiperSlide } from 'swiper/vue'
|
||||
import { Autoplay, Navigation, Pagination, A11y } from 'swiper'
|
||||
import { NCarousel } from 'naive-ui'
|
||||
import dayjs from 'dayjs'
|
||||
// import { NCarousel } from 'naive-ui'
|
||||
|
||||
const route = useRoute()
|
||||
const { push } = useRouter()
|
||||
const listData = ref<any[]>([])
|
||||
const curTab = ref(0)
|
||||
const firstItem = ref<any>('')
|
||||
const newsData = ref<any>({})
|
||||
async function getPageList() {
|
||||
const { code } = report({ moduleCode: 'App_Article' })
|
||||
const { rows } = await getArticlePage({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
position: 'relate'
|
||||
} as any)
|
||||
// console.log(rows)
|
||||
// for (let index = 0; index < 50; index++) {
|
||||
listData.value = rows
|
||||
|
||||
// }
|
||||
console.log(listData.value.length)
|
||||
// const { code } = report({ moduleCode: 'App_Article' })
|
||||
const { rows } = await getArticlePage({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
position: 'relate'
|
||||
} as any)
|
||||
// console.log(rows)
|
||||
// for (let index = 0; index < 50; index++) {
|
||||
listData.value = rows
|
||||
// }
|
||||
console.log(listData.value.length)
|
||||
}
|
||||
|
||||
const fetchNewDataList = async () => {
|
||||
const res = await newDataList({ pageNum: 1, pageSize: 8 })
|
||||
// const data = groupDatesByWeek(res.rows || [])
|
||||
const data = res.rows || []
|
||||
newsData.value = data
|
||||
firstItem.value = Object.keys(data)[0]
|
||||
}
|
||||
|
||||
// 将日期按照周分组
|
||||
function groupDatesByWeek(dates = [], weekStartDay = 1) {
|
||||
return dates.reduce((acc: any, item: any) => {
|
||||
const weekStart = dayjs(item.createTime)
|
||||
.startOf('week')
|
||||
.add(weekStartDay, 'day')
|
||||
.format('MM月DD日')
|
||||
const weekEnd = dayjs(item.createTime).endOf('week').add(weekStartDay, 'day').format('MM月DD日')
|
||||
const key = `${weekStart} - ${weekEnd}`
|
||||
acc[key] = acc[key] || []
|
||||
acc[key].push(item)
|
||||
return acc
|
||||
}, {})
|
||||
}
|
||||
|
||||
onMounted(getPageList)
|
||||
|
||||
// console.log(listData)
|
||||
|
|
@ -37,126 +64,227 @@ onMounted(getPageList)
|
|||
// }
|
||||
// }
|
||||
const toDetail2 = (n: any) => {
|
||||
// console.log(n)
|
||||
if (n.id === 0) return
|
||||
if (n.isSelect === 1) {
|
||||
push(`/intelligence/${n.type == 2 ? 'within' : 'outside'}/` + n.id)
|
||||
} else {
|
||||
message.error('没有访问权限')
|
||||
}
|
||||
console.log(n)
|
||||
if (n.id === 0) return
|
||||
if (n.isSelect === 1) {
|
||||
if (n.moduleCode === 'App_Database') {
|
||||
return push('/DataBase?id=' + n.cateId)
|
||||
}
|
||||
if (n.moduleCode === 'App_Article') {
|
||||
return push('/Home/intelligence/' + n.id)
|
||||
}
|
||||
push(`/intelligence/${n.type == 2 ? 'within' : 'outside'}/` + n.id)
|
||||
} else {
|
||||
message.error('没有访问权限')
|
||||
}
|
||||
}
|
||||
|
||||
const downloads = (data: any = {}) => {
|
||||
const { fileCommon, filePath } = data
|
||||
if ((fileCommon?.fileSize || 0) > 25 * 1024 * 1024) {
|
||||
message.info('正在下载中，请稍等～')
|
||||
downloadFile(filePath)
|
||||
return
|
||||
}
|
||||
if (filePath) {
|
||||
window.open(filePath, '_blank')
|
||||
} else {
|
||||
message.info('没有可预览文件！')
|
||||
}
|
||||
}
|
||||
function downloadFile(url: any) {
|
||||
fetch(url)
|
||||
.then((response) => response.blob())
|
||||
.then((blob) => {
|
||||
const downloadUrl = URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = downloadUrl
|
||||
link.download = getFileNameFromUrl(url)
|
||||
link.click()
|
||||
})
|
||||
}
|
||||
function getFileNameFromUrl(url: string) {
|
||||
const lastSlashIndex = url.lastIndexOf('/')
|
||||
if (lastSlashIndex !== -1) {
|
||||
return url.substring(lastSlashIndex + 1)
|
||||
} else {
|
||||
return 'Invalid URL'
|
||||
}
|
||||
}
|
||||
const modules = [Autoplay, Pagination, Navigation, A11y]
|
||||
|
||||
const files = ref<any>({})
|
||||
const cateId = 201
|
||||
const getFile = async () => {
|
||||
const { rows }: any = await cateFileList({
|
||||
// cateId: 201,
|
||||
cateId,
|
||||
pageNum: 1,
|
||||
pageSize: 1
|
||||
})
|
||||
files.value = rows?.[0] || {}
|
||||
const t = files.value.createTime
|
||||
if (t) {
|
||||
const arr = t.split('-')
|
||||
files.value.time = arr[0] + '年' + (+arr[1] - 1) + '月'
|
||||
}
|
||||
const { rows }: any = await cateFileList({
|
||||
// cateId: 201,
|
||||
cateId,
|
||||
pageNum: 1,
|
||||
pageSize: 1
|
||||
})
|
||||
files.value = rows?.[0] || {}
|
||||
const t = files.value.createTime
|
||||
if (t) {
|
||||
const arr = t.split('-')
|
||||
// files.value.time = arr[0] + '年' + (+arr[1] - 1) + '月'
|
||||
files.value.time = arr[1] - 1
|
||||
}
|
||||
}
|
||||
|
||||
getFile()
|
||||
fetchNewDataList()
|
||||
</script>
|
||||
<template>
|
||||
<div class="card news relative">
|
||||
<div class="flex justify-between items-center">
|
||||
<div>
|
||||
<div
|
||||
class="card_title cursor-pointer hover:underline"
|
||||
@click="push({ name: 'Intelligence' })"
|
||||
>
|
||||
外部情报
|
||||
</div>
|
||||
<div class="card_sub-title">责任者：调达研究院 研究企画T</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex text-#fff tetx-16px items-end txt-bg px-10px py-8px rounded-10px text-#fff mt-[10px] mr-16px"
|
||||
>
|
||||
<p
|
||||
class="text-16px text-#fff flex flex-col flex-start"
|
||||
@click="push({ name: 'DataBase', query: { id: cateId } })"
|
||||
>
|
||||
<span
|
||||
class="flex align-middle items-center cursor-pointer hover:underline mb-4px"
|
||||
>调达本部月报
|
||||
<img
|
||||
class="h-14px pl-4px"
|
||||
src="@/assets/images/yjtt@2x.png"
|
||||
alt=""
|
||||
/>
|
||||
</span>
|
||||
<span class="text-14px mt2px">
|
||||
作成日：{{ files.time || `2024年1月` }}
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card_content px-20px pt-30px pb-0">
|
||||
<div
|
||||
v-if="false"
|
||||
class="news_card w-437px flex items-end gap-12px text-#fff/80 !absolute right--20% top--38% scale-50"
|
||||
>
|
||||
<img
|
||||
src="@/assets/images/bg-card6-text.svg"
|
||||
class="h26px absolute left-16px top-16px animate__animated animate__zoomIn animate__delay-2s animate__slower animate__repeat-2"
|
||||
/>
|
||||
<div
|
||||
class="news_card_item i1 flex-1 w0 h100px p10px pt56px flex flex-col justify-around"
|
||||
>
|
||||
<img
|
||||
src="@/assets/images/WATCHING@2x.png"
|
||||
class="w41px h47px absolute left-40px top-25px animate__animated animate__infinite animate__heartBeat"
|
||||
/>
|
||||
<img
|
||||
src="@/assets/images/WATCHING2@2x.png"
|
||||
class="w80px left-10px top-10px"
|
||||
/>
|
||||
<!-- <p class="truncate" v-if="listData && Array.isArray(listData) && listData.length > 0" v-for="i in listData.slice(0,2)" :key="i" @click="toDetail2(i)">{{ i.title }}</p> -->
|
||||
</div>
|
||||
<div
|
||||
class="news_card_item i2 flex-1 w0 h120px p10px pt56px flex flex-col justify-around"
|
||||
>
|
||||
<img
|
||||
src="@/assets/images/ALARM@2x.png"
|
||||
class="w61px h63px absolute left-28px top-30px animate__animated animate__infinite animate__fadeIn"
|
||||
/>
|
||||
<img
|
||||
src="@/assets/images/ALARM2@2x.png"
|
||||
class="w70px left-15px top-14px"
|
||||
/>
|
||||
<!-- <p class="truncate" v-if="listData && Array.isArray(listData) && listData.length > 2" v-for="i in listData.slice(2,4)" :key="i" @click="toDetail2(i)">{{ i.title }}</p> -->
|
||||
</div>
|
||||
<div
|
||||
class="news_card_item i3 w140px h160px p10px pt70px flex flex-col justify-around"
|
||||
>
|
||||
<img
|
||||
src="@/assets/images/WARNING@2x.png"
|
||||
class="w82px h66px absolute left-30px top-45px animate__animated animate__infinite animate__flipOutY"
|
||||
/>
|
||||
<img
|
||||
src="@/assets/images//WARNING2@2x.png"
|
||||
class="w100px left-8px top-20px"
|
||||
/>
|
||||
<!-- <p class="truncate" v-if="listData && Array.isArray(listData) && listData.length > 4" v-for="i in listData.slice(4,7)" :key="i" @click="toDetail2(i)">{{ i.title }}</p> -->
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="card_title !pl0 !pt0 cursor-pointer hover:underline"
|
||||
@click="push({ name: 'News' })"
|
||||
>
|
||||
最新News
|
||||
</div>
|
||||
<div class="font-16px !h-230px overflow-y-auto mt10px">
|
||||
<!-- <n-carousel direction="vertical" dot-placement="right" style="width: 100%; height: 100px" autoplay :interval="1200"
|
||||
<div class="card news relative">
|
||||
<div class="news-left absolute z-10 transition-all" v-show="curTab == 1"></div>
|
||||
<div class="news-right absolute z-10 transition-all" v-show="curTab == 0"></div>
|
||||
<div class="absolute top-0 left-0 right-0 flex items-center z-11">
|
||||
<div
|
||||
class="text-black p-20px text-28px w-1/3 transition-all"
|
||||
:class="[{ 'text-#fff': curTab == 1 }]"
|
||||
@click="curTab = 0"
|
||||
>
|
||||
最近更新
|
||||
</div>
|
||||
<div class="card_title !pt-10px !pl-30px flex-1 !pb-10px" @click="curTab = 1">
|
||||
<div class="flex justify-between items-center">
|
||||
<p
|
||||
class="text-22px cursor-pointer hover:underline transition-all"
|
||||
:class="[{ 'text-#fff': curTab == 0 }]"
|
||||
@click.stop="push({ name: 'Intelligence' })"
|
||||
>
|
||||
外部情报
|
||||
</p>
|
||||
<div
|
||||
class="flex text-#fff tetx-16px items-end txt-bg px-8px py-6px rounded-10px text-#fff mr-10px"
|
||||
>
|
||||
<div
|
||||
@click.stop="push({ name: 'DataBase', query: { id: cateId } })"
|
||||
class="text-16px text-#fff flex align-middle items-center cursor-pointer hover:underline transition-all"
|
||||
>
|
||||
<div>{{ files.time || `1` }}月月报</div>
|
||||
<img class="h-14px pl-4px" src="@/assets/images/yjtt@2x.png" alt="" />
|
||||
</div>
|
||||
<!-- <span class="text-14px mt2px"> 作成日：{{ files.time || `2024年1月` }} </span> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="!px-0 !text-12px mt-4px" :class="[{ 'text-#fff': curTab == 0 }]">
|
||||
责任者：开发调达部 研究企画T
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="card_sub-title">责任者：调达研究院 研究企画T</div> -->
|
||||
</div>
|
||||
<!-- <div
|
||||
class="flex text-#fff tetx-16px items-end txt-bg px-10px py-8px rounded-10px text-#fff mt-[10px] mr-16px"
|
||||
>
|
||||
<p
|
||||
class="text-16px text-#fff flex flex-col flex-start"
|
||||
@click="push({ name: 'DataBase', query: { id: cateId } })"
|
||||
>
|
||||
<span class="flex align-middle items-center cursor-pointer hover:underline mb-4px"
|
||||
>调达本部月报
|
||||
<img class="h-14px pl-4px" src="@/assets/images/yjtt@2x.png" alt="" />
|
||||
</span>
|
||||
<span class="text-14px mt2px"> 作成日：{{ files.time || `2024年1月` }} </span>
|
||||
</p>
|
||||
</div> -->
|
||||
<div
|
||||
class="card_content px-20px pb-0 mt-0px absolute left-0 right-0 z-100 top-70px"
|
||||
v-if="curTab == 0"
|
||||
>
|
||||
<!-- <div class="font-16px !h-310px overflow-y-scroll"> -->
|
||||
<!-- <swiper
|
||||
id="swiperList2"
|
||||
v-if="listData"
|
||||
:slides-per-view="4"
|
||||
:autoplay="false && { delay: 1000, disableOnInteraction: false }"
|
||||
:speed="500"
|
||||
:space-between="10"
|
||||
:direction="'vertical'"
|
||||
:scrollbar="{ draggable: false }"
|
||||
:loop="true"
|
||||
:modules="modules"
|
||||
style="height: 280px"
|
||||
>
|
||||
<swiper-slide v-for="(i, index) of newsData" :key="index"> -->
|
||||
<div height="310px" class="h-310px overflow-hidden">
|
||||
<!-- <div class="text-black mb-10px" v-for="(item, index) of newsData" :key="index"> -->
|
||||
<div class="text-black mb-10px" v-for="(i, index) in newsData" :key="index">
|
||||
<div class="flex justify-between items-center mb4px" v-if="index === 0">
|
||||
<span class="text-18px mb-10px mt-0px opacity-0">{{ index }}</span>
|
||||
<span
|
||||
class="text-16px text-#4D7EE8 cursor-pointer hover:underline"
|
||||
@click="push({ name: 'Latest' })"
|
||||
>更多</span
|
||||
>
|
||||
</div>
|
||||
<!-- <template v-for="(i, k) in item" :key="k"> -->
|
||||
<div class="flex items-baseline flex-1">
|
||||
<div
|
||||
@click="toDetail2(i)"
|
||||
class="text-#142142 truncate text-18px font-bold w-95% no-underline text-#142142 cursor-pointer hover:underline h-16px leading-16px"
|
||||
>
|
||||
<!-- <img class="h-20px" src="@/assets/images/NEW.gif" alt="" /> -->
|
||||
<span>{{ i.title || '' }}</span>
|
||||
</div>
|
||||
<div class="text-#808696 ml20px text-14px flex items-center justify-between mb-10px">
|
||||
<span class="whitespace-nowrap block w-100px"> {{ i.departName }}</span>
|
||||
<!-- <span class="w-[36%]"> {{ i.userName }}</span> -->
|
||||
<span class="whitespace-nowrap block w86px"> {{ i.createTime?.slice(0, 10) }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </template> -->
|
||||
</div>
|
||||
</div>
|
||||
<!-- </swiper-slide>
|
||||
</swiper> -->
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
<div
|
||||
class="card_content px-20px pt-20px pb-0 mt-0px absolute left-0 right-0 top-70px z-[-1]"
|
||||
:class="[{ 'z-100': curTab == 1 }]"
|
||||
>
|
||||
<div
|
||||
v-if="false"
|
||||
class="news_card w-437px flex items-end gap-12px text-#fff/80 !absolute right--20% top--38% scale-50"
|
||||
>
|
||||
<img
|
||||
src="@/assets/images/bg-card6-text.svg"
|
||||
class="h26px absolute left-16px top-16px animate__animated animate__zoomIn animate__delay-2s animate__slower animate__repeat-2"
|
||||
/>
|
||||
<div class="news_card_item i1 flex-1 w0 h100px p10px pt56px flex flex-col justify-around">
|
||||
<img
|
||||
src="@/assets/images/WATCHING@2x.png"
|
||||
class="w41px h47px absolute left-40px top-25px animate__animated animate__infinite animate__heartBeat"
|
||||
/>
|
||||
<img src="@/assets/images/WATCHING2@2x.png" class="w80px left-10px top-10px" />
|
||||
<!-- <p class="truncate" v-if="listData && Array.isArray(listData) && listData.length > 0" v-for="i in listData.slice(0,2)" :key="i" @click="toDetail2(i)">{{ i.title }}</p> -->
|
||||
</div>
|
||||
<div class="news_card_item i2 flex-1 w0 h120px p10px pt56px flex flex-col justify-around">
|
||||
<img
|
||||
src="@/assets/images/ALARM@2x.png"
|
||||
class="w61px h63px absolute left-28px top-30px animate__animated animate__infinite animate__fadeIn"
|
||||
/>
|
||||
<img src="@/assets/images/ALARM2@2x.png" class="w70px left-15px top-14px" />
|
||||
<!-- <p class="truncate" v-if="listData && Array.isArray(listData) && listData.length > 2" v-for="i in listData.slice(2,4)" :key="i" @click="toDetail2(i)">{{ i.title }}</p> -->
|
||||
</div>
|
||||
<div class="news_card_item i3 w140px h160px p10px pt70px flex flex-col justify-around">
|
||||
<img
|
||||
src="@/assets/images/WARNING@2x.png"
|
||||
class="w82px h66px absolute left-30px top-45px animate__animated animate__infinite animate__flipOutY"
|
||||
/>
|
||||
<img src="@/assets/images//WARNING2@2x.png" class="w100px left-8px top-20px" />
|
||||
<!-- <p class="truncate" v-if="listData && Array.isArray(listData) && listData.length > 4" v-for="i in listData.slice(4,7)" :key="i" @click="toDetail2(i)">{{ i.title }}</p> -->
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="card_title !pl0 !pt0 cursor-pointer hover:underline"
|
||||
@click="push({ name: 'News' })"
|
||||
>
|
||||
最新News
|
||||
</div>
|
||||
<div class="font-16px !h-240px overflow-y-auto mt10px">
|
||||
<!-- <n-carousel direction="vertical" dot-placement="right" style="width: 100%; height: 100px" autoplay :interval="1200"
|
||||
:slides-per-view="2" :space-between="0" :loop="false" mousewheel>
|
||||
<div class="mt-10px" v-if="listData && Array.isArray(listData) && listData.length > 0" v-for="i in listData"
|
||||
:key="i">
|
||||
|
|
@ -167,192 +295,206 @@ getFile()
|
|||
</div>
|
||||
</n-carousel> -->
|
||||
|
||||
<swiper
|
||||
id="swiperList2"
|
||||
v-if="listData"
|
||||
:slides-per-view="4"
|
||||
:autoplay="{ delay: 1000, disableOnInteraction: false }"
|
||||
:speed="500"
|
||||
:space-between="10"
|
||||
:direction="'vertical'"
|
||||
:scrollbar="{ draggable: false }"
|
||||
:loop="true"
|
||||
:modules="modules"
|
||||
style="height: 230px"
|
||||
>
|
||||
<swiper-slide v-for="(i, index) in listData" :key="index">
|
||||
<div class="mt-10px">
|
||||
<div class="text-#142142 truncate text-16px">
|
||||
<a
|
||||
@click="toDetail2(i)"
|
||||
:href="i.url"
|
||||
class="no-underline text-#142142 cursor-pointer hover:underline"
|
||||
>{{ i.title }}</a
|
||||
>
|
||||
</div>
|
||||
<div class="text-#808696 mt-8px text-14px">
|
||||
<span>来源于: {{ i.source }}</span> <span>{{
|
||||
i.publishTime
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<swiper
|
||||
id="swiperList2"
|
||||
v-if="listData"
|
||||
:slides-per-view="4"
|
||||
:autoplay="{ delay: 1000, disableOnInteraction: false }"
|
||||
:speed="500"
|
||||
:space-between="10"
|
||||
:direction="'vertical'"
|
||||
:scrollbar="{ draggable: false }"
|
||||
:loop="true"
|
||||
:modules="modules"
|
||||
style="height: 230px"
|
||||
>
|
||||
<swiper-slide v-for="(i, index) in listData" :key="index">
|
||||
<div class="mt-10px">
|
||||
<div class="text-#142142 truncate text-16px">
|
||||
<a
|
||||
@click="toDetail2(i)"
|
||||
:href="i.url"
|
||||
class="no-underline text-#142142 cursor-pointer hover:underline"
|
||||
>{{ i.title }}</a
|
||||
>
|
||||
</div>
|
||||
<div class="text-#808696 mt-8px text-14px">
|
||||
<span>来源于: {{ i.source }}</span> <span>{{
|
||||
i.publishTime
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
</swiper-slide>
|
||||
</swiper>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<style lang="less" scoped>
|
||||
.news-left {
|
||||
background: url('@/assets/images/news-left.jpg') no-repeat;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: -2px;
|
||||
left: 0px;
|
||||
}
|
||||
.news-right {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: -2px;
|
||||
right: 0px;
|
||||
background: url('@/assets/images/news-right.jpg') no-repeat;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 1px;
|
||||
width: 1px;
|
||||
}
|
||||
.txt-bg {
|
||||
background: linear-gradient(to right, #4aa7d9, #60d1c7);
|
||||
background: linear-gradient(to right, #4aa7d9, #60d1c7);
|
||||
}
|
||||
.card {
|
||||
// width: 480px;
|
||||
// height: 428px;
|
||||
width: 480px;
|
||||
height: 395px;
|
||||
border-radius: 18px;
|
||||
overflow: hidden;
|
||||
// width: 480px;
|
||||
// height: 428px;
|
||||
width: 480px;
|
||||
height: 395px;
|
||||
border-radius: 18px;
|
||||
overflow: hidden;
|
||||
|
||||
background-color: #fff;
|
||||
// border: 1px solid #e7ebf5;
|
||||
box-shadow: 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
// border: 1px solid #e7ebf5;
|
||||
box-shadow: 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: relative;
|
||||
|
||||
&::after {
|
||||
content: ' ';
|
||||
background-image: url('@/assets/images/bg-card.svg');
|
||||
pointer-events: none;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 127px;
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
&::after {
|
||||
content: ' ';
|
||||
background-image: url('@/assets/images/bg-card.svg');
|
||||
pointer-events: none;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 127px;
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.card_title {
|
||||
flex-shrink: 0;
|
||||
font-size: 28px;
|
||||
color: #142142;
|
||||
padding: 20px;
|
||||
padding-right: 8px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.card_title {
|
||||
flex-shrink: 0;
|
||||
font-size: 28px;
|
||||
color: #142142;
|
||||
padding: 20px;
|
||||
padding-right: 8px;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
.card_sub-title {
|
||||
color: rgba(128, 134, 150, 0.8);
|
||||
font-size: 16px;
|
||||
padding: 0 20px;
|
||||
padding-bottom: 0;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.card_sub-title {
|
||||
color: rgba(128, 134, 150, 0.8);
|
||||
font-size: 16px;
|
||||
padding: 0 20px;
|
||||
padding-bottom: 0;
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
.topics {
|
||||
.item {
|
||||
border-radius: 8px;
|
||||
width: 210px;
|
||||
height: 155px;
|
||||
box-shadow: inset 1.4px 1.4px 0px 0px rgba(255, 255, 255, 0.004);
|
||||
overflow: hidden;
|
||||
.item {
|
||||
border-radius: 8px;
|
||||
width: 210px;
|
||||
height: 155px;
|
||||
box-shadow: inset 1.4px 1.4px 0px 0px rgba(255, 255, 255, 0.004);
|
||||
overflow: hidden;
|
||||
|
||||
background-image: url('@/assets/images/bg-card4.svg');
|
||||
background-position: -2px -2px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 215px 165px;
|
||||
position: relative;
|
||||
background-image: url('@/assets/images/bg-card4.svg');
|
||||
background-position: -2px -2px;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 215px 165px;
|
||||
position: relative;
|
||||
|
||||
.item_title {
|
||||
padding-left: 16px;
|
||||
padding-top: 22px;
|
||||
color: #002fa7;
|
||||
position: relative;
|
||||
// z-index: 9;
|
||||
}
|
||||
.item_title {
|
||||
padding-left: 16px;
|
||||
padding-top: 22px;
|
||||
color: #002fa7;
|
||||
position: relative;
|
||||
// z-index: 9;
|
||||
}
|
||||
|
||||
.item_sub-title {
|
||||
color: rgba(128, 134, 150, 0.8);
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
padding: 0 16px;
|
||||
padding-right: 8px;
|
||||
padding-bottom: 0;
|
||||
margin-top: 10px;
|
||||
z-index: 9;
|
||||
}
|
||||
.item_sub-title {
|
||||
color: rgba(128, 134, 150, 0.8);
|
||||
font-size: 12px;
|
||||
font-weight: normal;
|
||||
padding: 0 16px;
|
||||
padding-right: 8px;
|
||||
padding-bottom: 0;
|
||||
margin-top: 10px;
|
||||
z-index: 9;
|
||||
}
|
||||
|
||||
.item_img {
|
||||
position: absolute;
|
||||
bottom: -10px;
|
||||
right: 0;
|
||||
// z-index: 5;
|
||||
transition: transform 0.3s;
|
||||
.item_img {
|
||||
position: absolute;
|
||||
bottom: -10px;
|
||||
right: 0;
|
||||
// z-index: 5;
|
||||
transition: transform 0.3s;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover {
|
||||
transform: scale(1.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.news {
|
||||
.card_content {
|
||||
// padding: 20px;
|
||||
// padding-top: 0;
|
||||
}
|
||||
.card_content {
|
||||
// padding: 20px;
|
||||
// padding-top: 0;
|
||||
}
|
||||
|
||||
.news_card {
|
||||
// width: 442px;
|
||||
height: 180px;
|
||||
padding: 16px;
|
||||
font-size: 14px;
|
||||
.news_card {
|
||||
// width: 442px;
|
||||
height: 180px;
|
||||
padding: 16px;
|
||||
font-size: 14px;
|
||||
|
||||
// background-image: url('./images/bg-card6.png');
|
||||
background-repeat: no-repeat;
|
||||
// background-position: 0 0;
|
||||
// background-size: cover;
|
||||
background-size: 100% 100%;
|
||||
// background-image: url('./images/bg-card6.png');
|
||||
background-repeat: no-repeat;
|
||||
// background-position: 0 0;
|
||||
// background-size: cover;
|
||||
background-size: 100% 100%;
|
||||
|
||||
// border: 0px solid;
|
||||
// // padding: 0;
|
||||
// border-width: 4px;
|
||||
// border-image-outset: 4px;
|
||||
// // box-sizing: content-box;
|
||||
// border: 0px solid;
|
||||
// // padding: 0;
|
||||
// border-width: 4px;
|
||||
// border-image-outset: 4px;
|
||||
// // box-sizing: content-box;
|
||||
|
||||
// border-image-source: url('@/assets/images/bg-card6.svg');
|
||||
// border-image-slice: 4 4 4 4;
|
||||
// border-image-repeat: round repeat;
|
||||
// border-image-source: url('@/assets/images/bg-card6.svg');
|
||||
// border-image-slice: 4 4 4 4;
|
||||
// border-image-repeat: round repeat;
|
||||
|
||||
position: relative;
|
||||
}
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.news_card_item {
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
border-radius: 10px;
|
||||
background-position: 0 4px;
|
||||
.news_card_item {
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
position: relative;
|
||||
border-radius: 10px;
|
||||
background-position: 0 4px;
|
||||
|
||||
&.i1 {
|
||||
background-image: url('@/assets/images/bg-card6-11.svg');
|
||||
}
|
||||
&.i1 {
|
||||
background-image: url('@/assets/images/bg-card6-11.svg');
|
||||
}
|
||||
|
||||
&.i2 {
|
||||
background-image: url('@/assets/images/bg-card6-21.svg');
|
||||
}
|
||||
&.i2 {
|
||||
background-image: url('@/assets/images/bg-card6-21.svg');
|
||||
}
|
||||
|
||||
&.i3 {
|
||||
background-image: url('@/assets/images/bg-card6-31.svg');
|
||||
background-position: 0 10px;
|
||||
}
|
||||
}
|
||||
&.i3 {
|
||||
background-image: url('@/assets/images/bg-card6-31.svg');
|
||||
background-position: 0 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -15,33 +15,37 @@ const store = useUserStore()
|
|||
|
||||
const { push } = useRouter()
|
||||
const route = useRoute()
|
||||
const userCode = ['admin', 'csr_dandang', 'tech_service'].includes(
|
||||
store.user.roleCode
|
||||
)
|
||||
const Navs = [{ name: '集团*部门方针' }, { name: '年度活动日程表' }, { name: '其他链接' }, { name: '紧急联络' }, { name: 'CN/JP' }]
|
||||
const userCode = ['admin', 'csr_dandang', 'tech_service'].includes(store.user.roleCode)
|
||||
const Navs = [
|
||||
{ name: '集团*部门方针' },
|
||||
{ name: '年度活动日程表' },
|
||||
{ name: '其他链接' },
|
||||
{ name: '紧急联络' },
|
||||
{ name: 'CN/JP' }
|
||||
]
|
||||
const Content = [
|
||||
{ key: '1-1', component: () => <CSRContent /> },
|
||||
{ key: '1-2', component: () => <CSRContent22/> },
|
||||
{ key: '1-2', component: () => <CSRContent22 /> },
|
||||
{ key: '1-3', component: () => <CSRContent23 /> },
|
||||
// { key: '1-4', component: () => <CSRContent2 items={Content3} /> },
|
||||
{ key: '1-4', component: () => <CSRContent2 /> },
|
||||
{ key: '1-4', component: () => <CSRContent2 /> }
|
||||
]
|
||||
|
||||
const activeNav = ref(route.query.key || '1-4')
|
||||
const activeContent = computed(() => {
|
||||
const nav = unref(activeNav)
|
||||
const curContent = Content.find((i) => nav.includes(i.key))
|
||||
console.log(curContent,1111)
|
||||
console.log(curContent, 1111)
|
||||
return curContent?.component || null
|
||||
})
|
||||
|
||||
const shomks = () => {
|
||||
// push('csr/modifyCsr2')
|
||||
push({ name: 'modifyCsrCarbon' })
|
||||
// push('csr/modifyCsr2')
|
||||
push({ name: 'modifyCsrCarbon' })
|
||||
}
|
||||
|
||||
watch(activeNav, (newVal) => {
|
||||
push({ path: '/Home/csr',replace:true, query: { key: newVal } })
|
||||
push({ path: '/Home/csr', replace: true, query: { key: newVal } })
|
||||
})
|
||||
</script>
|
||||
|
||||
|
|
@ -54,14 +58,18 @@ watch(activeNav, (newVal) => {
|
|||
<div class="h-full relative flex flex-col">
|
||||
<div class="flex flex-end ml10px mt27px">
|
||||
<div class="flex-1"></div>
|
||||
<el-button class="absolute right-5 top-[-8px]" v-if="userCode && activeNav === '1-2'" type="primary" @click="shomks"
|
||||
>管理</el-button
|
||||
>
|
||||
<el-button
|
||||
class="absolute right-5 top-[-8px]"
|
||||
v-if="userCode && activeNav === '1-2'"
|
||||
type="primary"
|
||||
@click="shomks"
|
||||
>管理</el-button
|
||||
>
|
||||
<!-- <div class="px16px py8px cursor-pointer text-20px" v-for="nav in Navs" :key="nav.name">{{ nav.name }}</div> -->
|
||||
</div>
|
||||
<div class="flex-1 mt30px text-#142142 flex gap-30px h-825px">
|
||||
<AppBlock class="shrink-0 h-full w241px box !b-0">
|
||||
<div class="overflow-y-auto h-full ">
|
||||
<div class="overflow-y-auto h-full">
|
||||
<CSRSide v-model:activeNav="activeNav" />
|
||||
</div>
|
||||
</AppBlock>
|
||||
|
|
|
|||
|
|
@ -1,15 +1,15 @@
|
|||
<script setup lang="ts">
|
||||
// import {message} from '@/utils/message'
|
||||
import {
|
||||
fetchCsrSupplier,
|
||||
fetchCsrSupplierList,
|
||||
fetchCsrSupplierTopList,
|
||||
fetchCsrSupplierTaskInfo
|
||||
fetchCsrSupplier,
|
||||
fetchCsrSupplierList,
|
||||
fetchCsrSupplierTopList,
|
||||
fetchCsrSupplierTaskInfo
|
||||
} from '@/api/daikin/base'
|
||||
|
||||
const query = ref<any>({
|
||||
year: '',
|
||||
supplierName: ''
|
||||
year: '',
|
||||
supplierName: ''
|
||||
})
|
||||
const year = new Date().getFullYear()
|
||||
const month = new Date().getMonth()
|
||||
|
|
@ -21,96 +21,75 @@ const nowIndexMonth = calendar.indexOf(calendarShow)
|
|||
const updateTime = ref('')
|
||||
|
||||
const handleChange = () => {
|
||||
getCsrSupplier()
|
||||
getCsrSupplierList()
|
||||
getCsrSupplier()
|
||||
getCsrSupplierList()
|
||||
}
|
||||
|
||||
const isDateDisabled = (date: any) => {
|
||||
return date > new Date()
|
||||
return date > new Date()
|
||||
}
|
||||
const csrSupplier = ref<any>([])
|
||||
const csrSupplierObj = ref<any>({})
|
||||
const months = [
|
||||
'04',
|
||||
'05',
|
||||
'06',
|
||||
'07',
|
||||
'08',
|
||||
'09',
|
||||
'10',
|
||||
'11',
|
||||
'12',
|
||||
'01',
|
||||
'02',
|
||||
'03'
|
||||
]
|
||||
const months = ['04', '05', '06', '07', '08', '09', '10', '11', '12', '01', '02', '03']
|
||||
const loading = ref(false)
|
||||
const getCsrSupplier = () => {
|
||||
loading.value = true
|
||||
months.forEach((item: any) => {
|
||||
csrSupplierObj.value[item] = { month: item }
|
||||
})
|
||||
const req = { ...query.value }
|
||||
fetchCsrSupplier(req).then(({ data = {} }) => {
|
||||
const resData = Object.keys(data) || []
|
||||
try {
|
||||
csrSupplier.value = resData.length
|
||||
? resData.map((key) => {
|
||||
const obj = data[key] || {}
|
||||
const month = String(key).split('-')?.[1] || ''
|
||||
Object.assign(csrSupplierObj.value[month], obj)
|
||||
return {
|
||||
key,
|
||||
month,
|
||||
data: obj
|
||||
}
|
||||
})
|
||||
: []
|
||||
} catch (error) {}
|
||||
console.log(
|
||||
'🚀 ~ file: CSRContent23.vue:50 ~ csrSupplierObj:',
|
||||
csrSupplierObj
|
||||
)
|
||||
if (!csrSupplier.value.length) {
|
||||
// message.warning('暂无数据')
|
||||
csrSupplierObj.value = {}
|
||||
}
|
||||
})
|
||||
setTimeout(() => {
|
||||
loading.value = false
|
||||
}, 300)
|
||||
loading.value = true
|
||||
months.forEach((item: any) => {
|
||||
csrSupplierObj.value[item] = { month: item }
|
||||
})
|
||||
const req = { ...query.value }
|
||||
fetchCsrSupplier(req).then(({ data = {} }) => {
|
||||
const resData = Object.keys(data) || []
|
||||
try {
|
||||
csrSupplier.value = resData.length
|
||||
? resData.map((key) => {
|
||||
const obj = data[key] || {}
|
||||
const month = String(key).split('-')?.[1] || ''
|
||||
Object.assign(csrSupplierObj.value[month], obj)
|
||||
return {
|
||||
key,
|
||||
month,
|
||||
data: obj
|
||||
}
|
||||
})
|
||||
: []
|
||||
} catch (error) {}
|
||||
console.log('🚀 ~ file: CSRContent23.vue:50 ~ csrSupplierObj:', csrSupplierObj)
|
||||
if (!csrSupplier.value.length) {
|
||||
// message.warning('暂无数据')
|
||||
csrSupplierObj.value = {}
|
||||
}
|
||||
})
|
||||
setTimeout(() => {
|
||||
loading.value = false
|
||||
}, 300)
|
||||
}
|
||||
|
||||
const csrSupplierList = ref<any>([])
|
||||
const selMonth = ref('')
|
||||
const getCsrSupplierList = (index?: any) => {
|
||||
const month =
|
||||
index || index === 0 ? query.value.year + '-' + months[index] : ''
|
||||
csrSupplierList.value = []
|
||||
selMonth.value = ''
|
||||
const req = { pageNum: 1, pageSize: 10, ...query.value, month }
|
||||
req.supplierName
|
||||
? fetchCsrSupplierList(req).then((res: any) => {
|
||||
csrSupplierList.value = (res.rows || []).filter(
|
||||
(item: any) => item.submitunCount > 0
|
||||
)
|
||||
})
|
||||
: fetchCsrSupplierTopList(req).then((res: any) => {
|
||||
csrSupplierList.value = (res.rows || []).filter(
|
||||
(item: any) => item.submitunCount > 0
|
||||
)
|
||||
})
|
||||
selMonth.value = month ? +months[index] + '月' : ''
|
||||
const month = index || index === 0 ? query.value.year + '-' + months[index] : ''
|
||||
csrSupplierList.value = []
|
||||
selMonth.value = ''
|
||||
const req = { pageNum: 1, pageSize: 10, ...query.value, month }
|
||||
req.supplierName
|
||||
? fetchCsrSupplierList(req).then((res: any) => {
|
||||
csrSupplierList.value = (res.rows || []).filter((item: any) => item.submitunCount > 0)
|
||||
})
|
||||
: fetchCsrSupplierTopList(req).then((res: any) => {
|
||||
csrSupplierList.value = (res.rows || []).filter((item: any) => item.submitunCount > 0)
|
||||
})
|
||||
selMonth.value = month ? +months[index] + '月' : ''
|
||||
}
|
||||
|
||||
const getCsrSupplierTaskInfo = () => {
|
||||
fetchCsrSupplierTaskInfo().then((res) => {
|
||||
updateTime.value = res.data?.updateTime
|
||||
})
|
||||
fetchCsrSupplierTaskInfo().then((res) => {
|
||||
updateTime.value = res.data?.updateTime
|
||||
})
|
||||
}
|
||||
|
||||
const handleMonth = (index: number) => {
|
||||
getCsrSupplierList(index)
|
||||
getCsrSupplierList(index)
|
||||
}
|
||||
|
||||
getCsrSupplier()
|
||||
|
|
@ -119,375 +98,329 @@ getCsrSupplierTaskInfo()
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex w-full rounded-18px">
|
||||
<!-- <AppBlock> -->
|
||||
<!-- <img src="./images/goudongxi2.png" class="w-full h-full" /> -->
|
||||
<div
|
||||
class="relative overflow-hidden w-full bg-#f4f4f4 flex flex-wrap justify-between h-full rd-25px"
|
||||
>
|
||||
<div class="cards">
|
||||
<div class="cards_title">供方月度碳排放数据提交情况</div>
|
||||
<div class="!text-18px right-20 pt30px text-#4E7EE8">
|
||||
<a
|
||||
href="https://procurement.daikin.net.cn/mingdao/portal/app/7abea528-f7b4-4437-84bb-6b6b169bad3d"
|
||||
class="no-underline text-#4E7EE8"
|
||||
><img src="./images/yuny@2x.png" class="w25px mr5px mt--4px" /><span
|
||||
>明道云</span
|
||||
></a
|
||||
>
|
||||
</div>
|
||||
<div class="flex w-full h-80px p20px items-center mt10px">
|
||||
<div>
|
||||
<el-date-picker
|
||||
v-model="query.year"
|
||||
type="year"
|
||||
@change="handleChange"
|
||||
placeholder=""
|
||||
:disabled-date="isDateDisabled"
|
||||
:clearable="false"
|
||||
value-format="YYYY"
|
||||
/>
|
||||
</div>
|
||||
<el-input
|
||||
v-model.trim="query.supplierName"
|
||||
class="w-50 m-2"
|
||||
placeholder="供方名"
|
||||
prefix-icon="Search"
|
||||
width="150px"
|
||||
/>
|
||||
<el-button type="primary" @click="handleChange">查询</el-button>
|
||||
</div>
|
||||
<div class="w-full h-730px p20px" v-loading="loading">
|
||||
<el-row :gutter="10" v-if="false">
|
||||
<el-col :span="8"
|
||||
><div class="times">
|
||||
<div
|
||||
class="text-#fff text-18px font-bold absolute left-40% top-18px"
|
||||
>
|
||||
<span class="text-30px">1</span>月
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15%"
|
||||
>
|
||||
已提交：45
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15%"
|
||||
>
|
||||
未提交：100
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"
|
||||
>
|
||||
<span class="text-60px">2</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"
|
||||
>
|
||||
<span class="text-60px">3</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8" v-for="(it, i) in months" :key="i">
|
||||
<div
|
||||
v-show="!loading"
|
||||
:class="
|
||||
i <= nowIndexMonth && query.year == jpMonth ? 'times' : 'time'
|
||||
"
|
||||
@click="handleMonth(i)"
|
||||
>
|
||||
<div
|
||||
v-if="i > nowIndexMonth || query.year != jpMonth"
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"
|
||||
>
|
||||
<span class="text-60px">{{ +it }}</span
|
||||
>月
|
||||
</div>
|
||||
<template
|
||||
v-if="
|
||||
i <= nowIndexMonth &&
|
||||
(query.year == jpMonth || !!csrSupplierObj[it])
|
||||
"
|
||||
>
|
||||
<div
|
||||
class="text-#fff text-18px font-bold absolute left-40% top-24px"
|
||||
>
|
||||
<span class="text-24px">{{ +it }}</span
|
||||
>月
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-140px absolute top-70px text-#A0C6B5 text-18px font-bold p10px left-10% rounded-xl"
|
||||
>
|
||||
已提交：{{ csrSupplierObj[it]?.submitedCount || 0 }}
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-140px absolute top-110px text-red text-18px font-bold p10px left-10% rounded-xl"
|
||||
>
|
||||
未提交：{{ csrSupplierObj[it]?.submitunCount || 0 }}
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8" v-if="false"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"
|
||||
>
|
||||
<span class="text-60px">5</span>月
|
||||
</div>
|
||||
<template v-if="false">
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15% rounded-xl"
|
||||
>
|
||||
已提交：45
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15% rounded-xl"
|
||||
>
|
||||
未提交：100
|
||||
</div>
|
||||
</template>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8" v-if="false"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"
|
||||
>
|
||||
<span class="text-60px">6</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
<el-row :gutter="10" v-if="false">
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"
|
||||
>
|
||||
<span class="text-60px">7</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"
|
||||
>
|
||||
<span class="text-60px">8</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="times">
|
||||
<!-- <div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">9</span>月</div> -->
|
||||
<div
|
||||
class="text-#fff text-18px font-bold absolute left-40% top-24px"
|
||||
>
|
||||
<span class="text-24px">9</span>月
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-140px absolute top-70px text-#A0C6B5 text-18px font-bold p10px left-10% rounded-xl"
|
||||
>
|
||||
已提交：45
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-140px absolute top-110px text-red text-18px font-bold p10px left-10% rounded-xl"
|
||||
>
|
||||
未提交：100
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
<el-row :gutter="10" v-if="false">
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-30% top-45%"
|
||||
>
|
||||
<span class="text-60px">10</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-30% top-45%"
|
||||
>
|
||||
<span class="text-60px">11</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-30% top-45%"
|
||||
>
|
||||
<span class="text-60px">12</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
<el-row :gutter="10" v-if="false">
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"
|
||||
>
|
||||
<span class="text-60px">1</span>月
|
||||
</div>
|
||||
<template v-if="false">
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15%"
|
||||
>
|
||||
已提交：45
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15%"
|
||||
>
|
||||
未提交：100
|
||||
</div>
|
||||
</template>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"
|
||||
>
|
||||
<span class="text-60px">2</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"
|
||||
>
|
||||
<span class="text-60px">3</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cards">
|
||||
<div class="cards_title relative">
|
||||
未提交供应商明细({{ query.year }}年{{ selMonth }})
|
||||
</div>
|
||||
<div
|
||||
class="absolute top-24px !text-18px right-20px pt30px text-#4E7EE8"
|
||||
>
|
||||
<span class="text-#ababab">更新时间：{{ updateTime }}</span>
|
||||
</div>
|
||||
<div
|
||||
ref="msgScoll"
|
||||
class="px20px w-full h800px cent_box overflow-y-auto mt-12px"
|
||||
>
|
||||
<div
|
||||
v-if="csrSupplierList?.length"
|
||||
class="text-18px text-#808696 bg-#F4F8FF items-center flex py10px rd-5px mt10px"
|
||||
v-for="(i, key) in csrSupplierList"
|
||||
:key="key"
|
||||
>
|
||||
<div class="truncate2" @click="">
|
||||
<span
|
||||
class="text-#fff bg-#407DF1 px8px rounded-1/2 mr-5px inlineFlex"
|
||||
>{{ ++key }}</span
|
||||
>
|
||||
<span>{{ i.supplierName }} </span>
|
||||
</div>
|
||||
<div class="min-w130px max-w130px text-#000">
|
||||
{{ i.submitunCount }}次未提交
|
||||
</div>
|
||||
<!-- <div class="min-w150px max-w150px text-#000">{{++key}}月未提交</div> -->
|
||||
<span class="absolute right-10px top-18px">
|
||||
<!-- 暂不开发 12-03 -->
|
||||
<!-- <el-button>提醒</el-button> -->
|
||||
</span>
|
||||
</div>
|
||||
<div v-else class="py10px rd-5px mt100px">
|
||||
<el-empty description="该月份下供应商全部提交" :image-size="300" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex w-full rounded-18px">
|
||||
<!-- <AppBlock> -->
|
||||
<!-- <img src="./images/goudongxi2.png" class="w-full h-full" /> -->
|
||||
<div
|
||||
class="relative overflow-hidden w-full bg-#f4f4f4 flex flex-wrap justify-between h-full rd-25px"
|
||||
>
|
||||
<div class="cards">
|
||||
<div class="cards_title">供方月度碳排放数据提交情况</div>
|
||||
<div class="!text-18px right-20 pt30px text-#4E7EE8">
|
||||
<a
|
||||
href="https://procurement.daikin.net.cn/mingdao/portal/app/7abea528-f7b4-4437-84bb-6b6b169bad3d"
|
||||
class="no-underline text-#4E7EE8"
|
||||
><img src="./images/yuny@2x.png" class="w25px mr5px mt--4px" /><span>明道云</span></a
|
||||
>
|
||||
</div>
|
||||
<div class="flex w-full h-80px p20px items-center mt10px">
|
||||
<div>
|
||||
<el-date-picker
|
||||
popper-class="dete-picker"
|
||||
v-model="query.year"
|
||||
type="year"
|
||||
@change="handleChange"
|
||||
placeholder=""
|
||||
:disabled-date="isDateDisabled"
|
||||
:clearable="false"
|
||||
value-format="YYYY"
|
||||
/>
|
||||
</div>
|
||||
<el-input
|
||||
v-model.trim="query.supplierName"
|
||||
class="w-50 m-2"
|
||||
placeholder="供方名"
|
||||
prefix-icon="Search"
|
||||
width="150px"
|
||||
/>
|
||||
<el-button type="primary" @click="handleChange">查询</el-button>
|
||||
</div>
|
||||
<div class="w-full h-730px p20px" v-loading="loading">
|
||||
<el-row :gutter="10" v-if="false">
|
||||
<el-col :span="8"
|
||||
><div class="times">
|
||||
<div class="text-#fff text-18px font-bold absolute left-40% top-18px">
|
||||
<span class="text-30px">1</span>月
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15%"
|
||||
>
|
||||
已提交：45
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15%"
|
||||
>
|
||||
未提交：100
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%">
|
||||
<span class="text-60px">2</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%">
|
||||
<span class="text-60px">3</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8" v-for="(it, i) in months" :key="i">
|
||||
<div
|
||||
v-show="!loading"
|
||||
:class="i <= nowIndexMonth && query.year == jpMonth ? 'times' : 'time'"
|
||||
@click="handleMonth(i)"
|
||||
>
|
||||
<div
|
||||
v-if="i > nowIndexMonth || query.year != jpMonth"
|
||||
class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"
|
||||
>
|
||||
<span class="text-60px">{{ +it }}</span
|
||||
>月
|
||||
</div>
|
||||
<template
|
||||
v-if="i <= nowIndexMonth && (query.year == jpMonth || !!csrSupplierObj[it])"
|
||||
>
|
||||
<div class="text-#fff text-18px font-bold absolute left-40% top-24px">
|
||||
<span class="text-24px">{{ +it }}</span
|
||||
>月
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-140px absolute top-70px text-#A0C6B5 text-18px font-bold p10px left-10% rounded-xl"
|
||||
>
|
||||
已提交：{{ csrSupplierObj[it]?.submitedCount || 0 }}
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-140px absolute top-110px text-red text-18px font-bold p10px left-10% rounded-xl"
|
||||
>
|
||||
未提交：{{ csrSupplierObj[it]?.submitunCount || 0 }}
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8" v-if="false"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%">
|
||||
<span class="text-60px">5</span>月
|
||||
</div>
|
||||
<template v-if="false">
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15% rounded-xl"
|
||||
>
|
||||
已提交：45
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15% rounded-xl"
|
||||
>
|
||||
未提交：100
|
||||
</div>
|
||||
</template>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8" v-if="false"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%">
|
||||
<span class="text-60px">6</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
<el-row :gutter="10" v-if="false">
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%">
|
||||
<span class="text-60px">7</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%">
|
||||
<span class="text-60px">8</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="times">
|
||||
<!-- <div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">9</span>月</div> -->
|
||||
<div class="text-#fff text-18px font-bold absolute left-40% top-24px">
|
||||
<span class="text-24px">9</span>月
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-140px absolute top-70px text-#A0C6B5 text-18px font-bold p10px left-10% rounded-xl"
|
||||
>
|
||||
已提交：45
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-140px absolute top-110px text-red text-18px font-bold p10px left-10% rounded-xl"
|
||||
>
|
||||
未提交：100
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
<el-row :gutter="10" v-if="false">
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-30% top-45%">
|
||||
<span class="text-60px">10</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-30% top-45%">
|
||||
<span class="text-60px">11</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-30% top-45%">
|
||||
<span class="text-60px">12</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
<el-row :gutter="10" v-if="false">
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%">
|
||||
<span class="text-60px">1</span>月
|
||||
</div>
|
||||
<template v-if="false">
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15%"
|
||||
>
|
||||
已提交：45
|
||||
</div>
|
||||
<div
|
||||
class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15%"
|
||||
>
|
||||
未提交：100
|
||||
</div>
|
||||
</template>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%">
|
||||
<span class="text-60px">2</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
<el-col :span="8"
|
||||
><div class="time">
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%">
|
||||
<span class="text-60px">3</span>月
|
||||
</div>
|
||||
</div></el-col
|
||||
>
|
||||
</el-row>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cards">
|
||||
<div class="cards_title relative">未提交供应商明细({{ query.year }}年{{ selMonth }})</div>
|
||||
<div class="absolute top-24px !text-18px right-20px pt30px text-#4E7EE8">
|
||||
<span class="text-#ababab">更新时间：{{ updateTime }}</span>
|
||||
</div>
|
||||
<div ref="msgScoll" class="px20px w-full h800px cent_box overflow-y-auto mt-12px">
|
||||
<div
|
||||
v-if="csrSupplierList?.length"
|
||||
class="text-18px text-#808696 bg-#F4F8FF items-center flex py10px rd-5px mt10px"
|
||||
v-for="(i, key) in csrSupplierList"
|
||||
:key="key"
|
||||
>
|
||||
<div class="truncate2" @click="">
|
||||
<span class="text-#fff bg-#407DF1 px8px rounded-1/2 mr-5px inlineFlex">{{
|
||||
++key
|
||||
}}</span>
|
||||
<span>{{ i.supplierName }} </span>
|
||||
</div>
|
||||
<div class="min-w130px max-w130px text-#000">{{ i.submitunCount }}次未提交</div>
|
||||
<!-- <div class="min-w150px max-w150px text-#000">{{++key}}月未提交</div> -->
|
||||
<span class="absolute right-10px top-18px">
|
||||
<!-- 暂不开发 12-03 -->
|
||||
<!-- <el-button>提醒</el-button> -->
|
||||
</span>
|
||||
</div>
|
||||
<div v-else class="py10px rd-5px mt100px">
|
||||
<el-empty description="该月份下供应商全部提交" :image-size="300" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- </AppBlock> -->
|
||||
</div>
|
||||
<!-- </AppBlock> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.cards {
|
||||
width: 49%;
|
||||
height: 100%;
|
||||
border-radius: 18px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
width: 49%;
|
||||
height: 100%;
|
||||
border-radius: 18px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.time {
|
||||
width: 175px;
|
||||
height: 175px;
|
||||
background: url('@/assets/images/A2@2x.png');
|
||||
background-size: cover;
|
||||
width: 175px;
|
||||
height: 175px;
|
||||
background: url('@/assets/images/A2@2x.png');
|
||||
background-size: cover;
|
||||
}
|
||||
.times {
|
||||
width: 175px;
|
||||
height: 175px;
|
||||
background: url('@/assets/images/A1@2x.png');
|
||||
background-size: cover;
|
||||
width: 175px;
|
||||
height: 175px;
|
||||
background: url('@/assets/images/A1@2x.png');
|
||||
background-size: cover;
|
||||
}
|
||||
.cards_title {
|
||||
flex-shrink: 0;
|
||||
font-size: 26px;
|
||||
color: #142142;
|
||||
padding: 20px;
|
||||
margin-left: 20px;
|
||||
font-weight: bold;
|
||||
padding-bottom: 0;
|
||||
flex-shrink: 0;
|
||||
font-size: 26px;
|
||||
color: #142142;
|
||||
padding: 20px;
|
||||
margin-left: 20px;
|
||||
font-weight: bold;
|
||||
padding-bottom: 0;
|
||||
|
||||
&::before {
|
||||
content: ' ';
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 30px;
|
||||
background-color: #003ab5;
|
||||
&::before {
|
||||
content: ' ';
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 30px;
|
||||
background-color: #003ab5;
|
||||
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
position: absolute;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
.truncate2 {
|
||||
max-width: 360px;
|
||||
min-width: 360px;
|
||||
overflow: hidden;
|
||||
padding: 5px 10px;
|
||||
line-height: 30px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #142142;
|
||||
cursor: pointer;
|
||||
max-width: 360px;
|
||||
min-width: 360px;
|
||||
overflow: hidden;
|
||||
padding: 5px 10px;
|
||||
line-height: 30px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
color: #142142;
|
||||
cursor: pointer;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
}
|
||||
:deep {
|
||||
.el-empty__description > p {
|
||||
font-size: 28px !important;
|
||||
}
|
||||
.el-empty__description > p {
|
||||
font-size: 28px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -15,343 +15,336 @@ let idx = ref(0)
|
|||
const onClic = ref(false)
|
||||
const titles = ref()
|
||||
function menuHandler(menu: any, index: number) {
|
||||
console.log(menu, index)
|
||||
activeMenuKey.value = menu.id
|
||||
titles.value = menu.name
|
||||
idx.value = index
|
||||
activeItem.value = menu.id
|
||||
if (menu.childList && menu.childList.length > 0) {
|
||||
activeItem.value = menu.childList[0].id
|
||||
}
|
||||
if (database.database.id == activeItem.value && onClic.value) {
|
||||
onClic.value = false
|
||||
} else {
|
||||
onClic.value = !!menu.childList?.length
|
||||
// onClic.value = !onClic.value
|
||||
}
|
||||
database.database.id = activeItem.value
|
||||
goListPage()
|
||||
console.log(menu, index)
|
||||
activeMenuKey.value = menu.id
|
||||
titles.value = menu.name
|
||||
idx.value = index
|
||||
activeItem.value = menu.id
|
||||
if (menu.childList && menu.childList.length > 0) {
|
||||
activeItem.value = menu.childList[0].id
|
||||
}
|
||||
if (database.database.id == activeItem.value && onClic.value) {
|
||||
onClic.value = false
|
||||
} else {
|
||||
onClic.value = !!menu.childList?.length
|
||||
// onClic.value = !onClic.value
|
||||
}
|
||||
database.database.id = activeItem.value
|
||||
goListPage()
|
||||
}
|
||||
function goChild(menu: any) {
|
||||
activeItem.value = menu.id
|
||||
console.log('🚀 ~ menu:', menu.id, menu.name)
|
||||
database.database.id = menu.id
|
||||
goListPage()
|
||||
activeItem.value = menu.id
|
||||
console.log('🚀 ~ menu:', menu.id, menu.name)
|
||||
database.database.id = menu.id
|
||||
goListPage()
|
||||
}
|
||||
function goListPage() {
|
||||
const { path } = route
|
||||
if (path === '/DataBase/review') push('/DataBase')
|
||||
const { path } = route
|
||||
if (path === '/DataBase/review') push('/DataBase')
|
||||
}
|
||||
var activeItem = ref<any>(0)
|
||||
const tableData = ref()
|
||||
async function getTree() {
|
||||
const { data = [] } = await treeDbList({})
|
||||
tableData.value = data
|
||||
const { data = [] } = await treeDbList({})
|
||||
tableData.value = data
|
||||
|
||||
if (data && data[0]) {
|
||||
// console.log(data[0])
|
||||
titles.value = data[0].name
|
||||
activeMenuKey.value = data[0].id
|
||||
// if(data[0].childList&&data[0].childList.length>0){
|
||||
// activeItem.value = data[0].childList[0].id
|
||||
// activeMenuKey.value = data[0].childList[0].id
|
||||
// }
|
||||
}
|
||||
const { id } = route.query
|
||||
if (id) {
|
||||
activeItem.value = +id
|
||||
// const index = data.findIndex((i: any) => i.id == id)
|
||||
// if (index > -1) {
|
||||
// const item = data[index]
|
||||
// if (item) {
|
||||
// // menuHandler(item, index)
|
||||
// // onClic.value = true
|
||||
// // titles.value = item.name
|
||||
// // activeMenuKey.value = item.id
|
||||
// // database.database.id = item.id
|
||||
// }
|
||||
// }
|
||||
}
|
||||
if (activeItem.value) {
|
||||
const { topLevelItem, targetItem } = findItemById(data, activeItem.value)
|
||||
console.log('🚀 ~ topLevelItem, targetItem:', topLevelItem, targetItem)
|
||||
if (topLevelItem && targetItem) {
|
||||
const index = data.findIndex((i: any) => i.id === topLevelItem.id)
|
||||
nextTick(() => {
|
||||
// onClic.value = true
|
||||
menuHandler(topLevelItem, index === -1 ? 0 : index)
|
||||
goChild(targetItem)
|
||||
})
|
||||
} else {
|
||||
const index = data.findIndex((i: any) => i.id == id)
|
||||
if (index > -1) {
|
||||
const item = data[index]
|
||||
if (item) {
|
||||
menuHandler(item, index)
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
database.database.id = data[0].id
|
||||
}
|
||||
if (data && data[0]) {
|
||||
// console.log(data[0])
|
||||
titles.value = data[0].name
|
||||
activeMenuKey.value = data[0].id
|
||||
// if(data[0].childList&&data[0].childList.length>0){
|
||||
// activeItem.value = data[0].childList[0].id
|
||||
// activeMenuKey.value = data[0].childList[0].id
|
||||
// }
|
||||
}
|
||||
const { id } = route.query
|
||||
if (id) {
|
||||
activeItem.value = +id
|
||||
// const index = data.findIndex((i: any) => i.id == id)
|
||||
// if (index > -1) {
|
||||
// const item = data[index]
|
||||
// if (item) {
|
||||
// // menuHandler(item, index)
|
||||
// // onClic.value = true
|
||||
// // titles.value = item.name
|
||||
// // activeMenuKey.value = item.id
|
||||
// // database.database.id = item.id
|
||||
// }
|
||||
// }
|
||||
}
|
||||
if (activeItem.value) {
|
||||
const { topLevelItem, targetItem } = findItemById(data, activeItem.value)
|
||||
console.log('🚀 ~ topLevelItem, targetItem:', topLevelItem, targetItem)
|
||||
if (topLevelItem && targetItem) {
|
||||
const index = data.findIndex((i: any) => i.id === topLevelItem.id)
|
||||
nextTick(() => {
|
||||
// onClic.value = true
|
||||
menuHandler(topLevelItem, index === -1 ? 0 : index)
|
||||
goChild(targetItem)
|
||||
})
|
||||
} else {
|
||||
const index = data.findIndex((i: any) => i.id == id)
|
||||
if (index > -1) {
|
||||
const item = data[index]
|
||||
if (item) {
|
||||
menuHandler(item, index)
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
database.database.id = data[0].id
|
||||
}
|
||||
}
|
||||
getTree()
|
||||
|
||||
function findItemById(
|
||||
items: any,
|
||||
targetId: any,
|
||||
topLevelItem: any = null
|
||||
): any {
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
const item = items[i]
|
||||
if (item.id === targetId) {
|
||||
return { topLevelItem: topLevelItem || item, targetItem: item }
|
||||
} else if (item.childList?.length > 0) {
|
||||
const result = findItemById(
|
||||
item.childList,
|
||||
targetId,
|
||||
topLevelItem || item
|
||||
)
|
||||
if (result.targetItem) {
|
||||
return result
|
||||
}
|
||||
}
|
||||
}
|
||||
return { topLevelItem: null, targetItem: null }
|
||||
function findItemById(items: any, targetId: any, topLevelItem: any = null): any {
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
const item = items[i]
|
||||
if (item.id === targetId) {
|
||||
return { topLevelItem: topLevelItem || item, targetItem: item }
|
||||
} else if (item.childList?.length > 0) {
|
||||
const result = findItemById(item.childList, targetId, topLevelItem || item)
|
||||
if (result.targetItem) {
|
||||
return result
|
||||
}
|
||||
}
|
||||
}
|
||||
return { topLevelItem: null, targetItem: null }
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page w-1920px h-1080px flex">
|
||||
<div class="w350px -mr-1px flex flex-col shrink-0 overflow-auto">
|
||||
<div class="p30px bg-#000">
|
||||
<!-- @dblclick="toggle" -->
|
||||
<img src="@/assets/images/logo@2x.png" class="w197px h44px mt14px" />
|
||||
</div>
|
||||
<div class="page w-1920px h-1080px flex">
|
||||
<div class="w350px -mr-1px flex flex-col shrink-0 overflow-auto">
|
||||
<div class="p30px bg-#000">
|
||||
<!-- @dblclick="toggle" -->
|
||||
<img src="@/assets/images/logo@2x.png" class="w197px h44px mt14px" />
|
||||
</div>
|
||||
|
||||
<div class="pt30px pb24px flex-1 pl20px bg-#fff">
|
||||
<div
|
||||
class="nav px50px py24px m10px mr0 rd-32px rd-r-0 flex flex-col text-#000 cursor-pointer"
|
||||
v-for="(m, index) in tableData"
|
||||
:key="m.id"
|
||||
:class="
|
||||
activeMenuKey === m.id ? (m.childList ? 'actives' : 'active') : ''
|
||||
"
|
||||
@click="() => menuHandler(m, index)"
|
||||
>
|
||||
<div
|
||||
:class="activeMenuKey === m.id && 'onActive'"
|
||||
class="flex relative"
|
||||
>
|
||||
<!-- @click="!!m.childList?.length ? (onClic = !onClic) : ''" -->
|
||||
<!-- <img v-if="activeMenuKey === m.id" :src="m.icon1" class="w22px h22px mr16px mt--5px" />
|
||||
<div class="pt30px pb24px flex-1 pl20px bg-#fff">
|
||||
<div
|
||||
class="nav px50px py24px m10px mr0 rd-32px rd-r-0 flex flex-col text-#000 cursor-pointer"
|
||||
v-for="(m, index) in tableData"
|
||||
:key="m.id"
|
||||
:class="activeMenuKey === m.id ? (m.childList ? 'actives' : 'active') : ''"
|
||||
@click="() => menuHandler(m, index)"
|
||||
>
|
||||
<div :class="activeMenuKey === m.id && 'onActive'" class="flex relative">
|
||||
<!-- @click="!!m.childList?.length ? (onClic = !onClic) : ''" -->
|
||||
<!-- <img v-if="activeMenuKey === m.id" :src="m.icon1" class="w22px h22px mr16px mt--5px" />
|
||||
<img v-else :src="m.icon" class="w22px h22px mr16px mt--5px" /> -->
|
||||
<!-- lujinli -->
|
||||
<!-- <span class="text-17px font-900 relative min-w195px block"> -->
|
||||
<span class="text-18px font-900 relative min-w195px block">
|
||||
<span class="truncate"> {{ m.name }} </span>
|
||||
<span class="text-#000000 absolute right--30px top--5px"
|
||||
><el-icon size="26">
|
||||
<CaretTop
|
||||
v-if="activeMenuKey === m.id && onClic"
|
||||
class="text-#4977FC"
|
||||
/>
|
||||
<CaretBottom v-else /> </el-icon
|
||||
></span>
|
||||
<img
|
||||
v-if="m.isSelFlag == 1"
|
||||
src="@/assets/images/NEW.gif"
|
||||
class="!h-20px !w-auto absolute left-[-46px] top-[50%] translate-y-[-50%]"
|
||||
alt=""
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<!-- lujinli -->
|
||||
<!-- <span class="text-17px font-900 relative min-w195px block"> -->
|
||||
<span class="text-18px font-900 relative min-w195px block">
|
||||
<span class="truncate"> {{ m.name }} </span>
|
||||
<span class="text-#000000 absolute right--30px top--5px"
|
||||
><el-icon size="26">
|
||||
<CaretTop v-if="activeMenuKey === m.id && onClic" class="text-#4977FC" />
|
||||
<CaretBottom v-else /> </el-icon
|
||||
></span>
|
||||
<img
|
||||
v-if="m.isSelFlag == 1"
|
||||
src="@/assets/images/NEW.gif"
|
||||
class="!h-20px !w-auto absolute left-[-46px] top-[50%] translate-y-[-50%]"
|
||||
alt=""
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="m.childList && idx == index"
|
||||
class="pl40px"
|
||||
v-show="idx === index && onClic ? true : false"
|
||||
>
|
||||
<div
|
||||
class="my30px pl10px text-#000 activeChildren"
|
||||
v-for="(item, ind) in m.childList"
|
||||
:key="item.id"
|
||||
@click.stop="goChild(item)"
|
||||
@click="activeItem = item.id"
|
||||
>
|
||||
<!-- <el-tooltip :content="item.name" placement="top-start" effect="light"> -->
|
||||
<n-popover trigger="hover" placement="top-start">
|
||||
<template #trigger>
|
||||
<span
|
||||
class="text-18px flex child font-900 truncate"
|
||||
:class="activeItem === item.id ? 'text-#002fa7' : ''"
|
||||
>{{ item.name }}</span
|
||||
>
|
||||
</template>
|
||||
<div class="text-18px leading-40px">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</n-popover>
|
||||
<!-- </el-tooltip> -->
|
||||
<div
|
||||
v-if="m.childList && idx == index"
|
||||
class="pl40px"
|
||||
v-show="idx === index && onClic ? true : false"
|
||||
>
|
||||
<div
|
||||
class="my30px pl10px text-#000 activeChildren"
|
||||
v-for="(item, ind) in m.childList"
|
||||
:key="item.id"
|
||||
@click.stop="goChild(item)"
|
||||
@click="activeItem = item.id"
|
||||
>
|
||||
<!-- <el-tooltip :content="item.name" placement="top-start" effect="light"> -->
|
||||
<div class="relative">
|
||||
<n-popover trigger="hover" placement="top-start">
|
||||
<template #trigger>
|
||||
<span
|
||||
class="text-18px flex child font-900 truncate"
|
||||
:class="activeItem === item.id ? 'text-#002fa7' : ''"
|
||||
>{{ item.name }}</span
|
||||
>
|
||||
</template>
|
||||
<div class="text-18px leading-40px">
|
||||
{{ item.name }}
|
||||
</div>
|
||||
</n-popover>
|
||||
<img
|
||||
@click="activeItem = item.id"
|
||||
v-if="item.isSelFlag === 1 && !item.childList?.length"
|
||||
src="@/assets/images/NEW.gif"
|
||||
class="!h-20px !w-auto mr-1 absolute left-[-46px] top-[50%] translate-y-[-50%]"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<!-- </el-tooltip> -->
|
||||
|
||||
<div v-if="item.childList && idx == index" class="pl10px">
|
||||
<div
|
||||
class="my30px pl10px text-#000"
|
||||
v-for="(ite, ind) in item.childList"
|
||||
:key="item.id"
|
||||
@click.stop="goChild(ite)"
|
||||
@click="activeItem = ite.id"
|
||||
>
|
||||
<div class="relative">
|
||||
<n-popover trigger="hover" placement="top-start">
|
||||
<template #trigger>
|
||||
<span
|
||||
class="text-18px flex childs font-900 truncate"
|
||||
:class="activeItem === ite.id ? 'text-#002fa7' : ''"
|
||||
>{{ ite.name }}</span
|
||||
>
|
||||
</template>
|
||||
<div class="text-18px leading-40px">
|
||||
{{ ite.name }}
|
||||
</div>
|
||||
</n-popover>
|
||||
<img
|
||||
@click="activeItem = ite.id"
|
||||
v-if="ite.isSelFlag === 1 && !ite.childList?.length"
|
||||
src="@/assets/images/NEW.gif"
|
||||
class="!h-20px !w-auto mr-1 absolute left-[-46px] top-[50%] translate-y-[-50%]"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
<div v-if="item.childList && idx == index" class="pl10px">
|
||||
<div
|
||||
class="my30px pl10px text-#000"
|
||||
v-for="(ite, ind) in item.childList"
|
||||
:key="item.id"
|
||||
@click.stop="goChild(ite)"
|
||||
@click="activeItem = ite.id"
|
||||
>
|
||||
<div class="relative">
|
||||
<n-popover trigger="hover" placement="top-start">
|
||||
<template #trigger>
|
||||
<span
|
||||
class="text-18px flex childs font-900 truncate"
|
||||
:class="activeItem === ite.id ? 'text-#002fa7' : ''"
|
||||
>{{ ite.name }}</span
|
||||
>
|
||||
</template>
|
||||
<div class="text-18px leading-40px">
|
||||
{{ ite.name }}
|
||||
</div>
|
||||
</n-popover>
|
||||
<img
|
||||
@click="activeItem = ite.id"
|
||||
v-if="ite.isSelFlag === 1 && !ite.childList?.length"
|
||||
src="@/assets/images/NEW.gif"
|
||||
class="!h-20px !w-auto mr-1 absolute left-[-46px] top-[50%] translate-y-[-50%]"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div v-if="ite.childList && idx == index" class="pl10px">
|
||||
<div
|
||||
class="my20px py-10px pl10px text-#000 relative"
|
||||
v-for="(it, ind) in ite.childList"
|
||||
:key="item.id"
|
||||
@click.stop="goChild(it)"
|
||||
@click="activeItem = it.id"
|
||||
>
|
||||
<n-popover trigger="hover" placement="top-start">
|
||||
<template #trigger>
|
||||
<span
|
||||
class="text-18px flex childs font-900 truncate"
|
||||
:class="activeItem === it.id ? 'text-#002fa7' : ''"
|
||||
>{{ it.name }}</span
|
||||
>
|
||||
</template>
|
||||
<div class="text-18px leading-40px">
|
||||
{{ it.name }}
|
||||
</div>
|
||||
</n-popover>
|
||||
<img
|
||||
@click="activeItem = it.id"
|
||||
v-if="it.isSelFlag == 1"
|
||||
src="@/assets/images/NEW.gif"
|
||||
class="!h-20px !w-auto mr-1 absolute left-[-36px] top-[50%] translate-y-[-50%]"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="ite.childList && idx == index" class="pl10px">
|
||||
<div
|
||||
class="my20px py-10px pl10px text-#000 relative"
|
||||
v-for="(it, ind) in ite.childList"
|
||||
:key="item.id"
|
||||
@click.stop="goChild(it)"
|
||||
@click="activeItem = it.id"
|
||||
>
|
||||
<n-popover trigger="hover" placement="top-start">
|
||||
<template #trigger>
|
||||
<span
|
||||
class="text-18px flex childs font-900 truncate"
|
||||
:class="activeItem === it.id ? 'text-#002fa7' : ''"
|
||||
>{{ it.name }}</span
|
||||
>
|
||||
</template>
|
||||
<div class="text-18px leading-40px">
|
||||
{{ it.name }}
|
||||
</div>
|
||||
</n-popover>
|
||||
<img
|
||||
@click="activeItem = it.id"
|
||||
v-if="it.isSelFlag == 1"
|
||||
src="@/assets/images/NEW.gif"
|
||||
class="!h-20px !w-auto mr-1 absolute left-[-36px] top-[50%] translate-y-[-50%]"
|
||||
alt=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="main flex-1 pb15px pt0px relative">
|
||||
<!-- <Home /> -->
|
||||
<RouterView :cateId="activeItem" :title="titles" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="main flex-1 pb15px pt0px relative">
|
||||
<!-- <Home /> -->
|
||||
<RouterView :cateId="activeItem" :title="titles" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.truncate {
|
||||
display: block;
|
||||
max-width: 226px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
display: block;
|
||||
max-width: 226px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
}
|
||||
.page {
|
||||
font-family: 'PingFang SC';
|
||||
user-select: none;
|
||||
background-image: none;
|
||||
background-color: #cacaca;
|
||||
background-position: 0 0;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
// color: #3b3b3b;
|
||||
color: #000;
|
||||
font-family: 'PingFang SC';
|
||||
user-select: none;
|
||||
background-image: none;
|
||||
background-color: #cacaca;
|
||||
background-position: 0 0;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
// color: #3b3b3b;
|
||||
color: #000;
|
||||
|
||||
line-height: 1;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.nav {
|
||||
&::before {
|
||||
top: -48px;
|
||||
}
|
||||
.child:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.childs:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
&::before {
|
||||
top: -48px;
|
||||
}
|
||||
.child:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.childs:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
&::after {
|
||||
bottom: -49px;
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
&::after {
|
||||
bottom: -49px;
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #002fa7;
|
||||
background-color: #e6ecff;
|
||||
&.active {
|
||||
color: #002fa7;
|
||||
background-color: #e6ecff;
|
||||
|
||||
a {
|
||||
color: #002fa7;
|
||||
}
|
||||
a {
|
||||
color: #002fa7;
|
||||
}
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&::before,
|
||||
&::after {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
&.actives {
|
||||
padding: 0px !important;
|
||||
color: #4977fc;
|
||||
background-color: #f5f8ff;
|
||||
&.actives {
|
||||
padding: 0px !important;
|
||||
color: #4977fc;
|
||||
background-color: #f5f8ff;
|
||||
|
||||
a {
|
||||
color: #002fa7;
|
||||
}
|
||||
a {
|
||||
color: #002fa7;
|
||||
}
|
||||
|
||||
&::before,
|
||||
&::after {
|
||||
opacity: 1;
|
||||
}
|
||||
&::before,
|
||||
&::after {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.onActive {
|
||||
background-color: #e6ecff;
|
||||
border-radius: 32px 0 0 32px;
|
||||
.onActive {
|
||||
background-color: #e6ecff;
|
||||
border-radius: 32px 0 0 32px;
|
||||
|
||||
padding: 24px 36px 24px 50px;
|
||||
}
|
||||
}
|
||||
padding: 24px 36px 24px 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main {
|
||||
width: 100%;
|
||||
height: 95%;
|
||||
background-color: #4877fb;
|
||||
margin-left: 30px;
|
||||
width: 100%;
|
||||
height: 95%;
|
||||
background-color: #4877fb;
|
||||
margin-left: 30px;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
scrollbar-width: none;
|
||||
display: none;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -5,19 +5,13 @@ import { formatDate } from '@/utils/format'
|
|||
|
||||
const currentDate = new Date()
|
||||
const currentDates = new Date()
|
||||
const value1 = ref<[Date, Date]>([
|
||||
currentDate.setMonth(currentDate.getMonth()),
|
||||
new Date()
|
||||
])
|
||||
const value2 = ref<[Date, Date]>([
|
||||
currentDates.setMonth(currentDates.getMonth()),
|
||||
new Date()
|
||||
])
|
||||
const value1 = ref<[Date, Date]>([currentDate.setMonth(currentDate.getMonth()), new Date()])
|
||||
const value2 = ref<[Date, Date]>([currentDates.setMonth(currentDates.getMonth()), new Date()])
|
||||
|
||||
const states = reactive<any>({
|
||||
startTime: formatDate(value1.value[0]).substring(0, 10),
|
||||
endTime: formatDate(value1.value[1]).substring(0, 10)
|
||||
// timeType:2,
|
||||
startTime: formatDate(value1.value[0]).substring(0, 10),
|
||||
endTime: formatDate(value1.value[1]).substring(0, 10)
|
||||
// timeType:2,
|
||||
})
|
||||
|
||||
// export function Chart1() {
|
||||
|
|
@ -86,126 +80,126 @@ const states = reactive<any>({
|
|||
// }
|
||||
|
||||
export function Chart1(xAxisData: any = [], color = []) {
|
||||
const option = {
|
||||
width: '100%',
|
||||
// height: '450px', // 设置图表高度为 400 像素
|
||||
grid: {
|
||||
left: '10',
|
||||
top: 90,
|
||||
right: '10',
|
||||
bottom: '10',
|
||||
containLabel: true
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: xAxisData
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
data: [],
|
||||
color: function (params: any) {
|
||||
return color[params.dataIndex] || '#8F97F8'
|
||||
},
|
||||
type: 'bar'
|
||||
}
|
||||
]
|
||||
}
|
||||
return { ...option }
|
||||
const option = {
|
||||
width: '100%',
|
||||
// height: '450px', // 设置图表高度为 400 像素
|
||||
grid: {
|
||||
left: '10',
|
||||
top: 90,
|
||||
right: '10',
|
||||
bottom: '10',
|
||||
containLabel: true
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: xAxisData
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
data: [],
|
||||
color: function (params: any) {
|
||||
return color[params.dataIndex] || '#8F97F8'
|
||||
},
|
||||
type: 'bar'
|
||||
}
|
||||
]
|
||||
}
|
||||
return { ...option }
|
||||
}
|
||||
|
||||
export function pieEchart(arr: any = [], colorList: any = {}) {
|
||||
console.log('🚀 ~ colorList:', colorList)
|
||||
const color: any = []
|
||||
const data = arr.map((item: any) => {
|
||||
color.push(colorList[item.moduleCode])
|
||||
console.log('🚀 ~ item.moduleCode:', item.moduleCode)
|
||||
return {
|
||||
name: item.moduleName,
|
||||
value: item.visitCount,
|
||||
_code: item.moduleCode
|
||||
}
|
||||
})
|
||||
return {
|
||||
// color,
|
||||
title: {
|
||||
text: '各模块登录占比',
|
||||
left: 'center',
|
||||
textStyle: {
|
||||
fontSize: 30
|
||||
},
|
||||
top: 20
|
||||
},
|
||||
grid: {
|
||||
left: '0',
|
||||
top: 0,
|
||||
right: '0',
|
||||
bottom: '2%',
|
||||
containLabel: true
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
textStyle: {
|
||||
fontSize: 24
|
||||
},
|
||||
formatter: function (params: any) {
|
||||
// const title = `<p>${params.seriesName}</p>`
|
||||
const colorDot =
|
||||
'<span style="display:inline-block;margin-right:5px;border-radius:50%;width:10px;height:10px;background-color:' +
|
||||
params.color +
|
||||
'"></span>'
|
||||
return colorDot + params.name + ': ' + params.percent + '%'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
// orient: 'vertical',
|
||||
// left: 'left'
|
||||
// type: 'warp',
|
||||
bottom: '3%',
|
||||
// left: '30%',
|
||||
width: '78%',
|
||||
textStyle: {
|
||||
fontSize: 24,
|
||||
borderRadius: 0
|
||||
},
|
||||
itemWidth: 24,
|
||||
itemHeight: 24
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: '60%',
|
||||
data: data,
|
||||
label: {
|
||||
// show: false,
|
||||
position: 'inside',
|
||||
// formatter: '{b}-{c}%',
|
||||
formatter: function (params: any) {
|
||||
return params.percent < 10
|
||||
? params.percent + '%'
|
||||
: params.name + ' ' + params.percent + '%'
|
||||
},
|
||||
fontSize: 20,
|
||||
color: '#fff'
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
console.log('🚀 ~ colorList:', colorList)
|
||||
const color: any = []
|
||||
const data = arr.map((item: any) => {
|
||||
color.push(colorList[item.moduleCode])
|
||||
console.log('🚀 ~ item.moduleCode:', item.moduleCode)
|
||||
return {
|
||||
name: item.moduleName,
|
||||
value: item.visitCount,
|
||||
_code: item.moduleCode
|
||||
}
|
||||
})
|
||||
return {
|
||||
// color,
|
||||
title: {
|
||||
text: '各模块登录占比',
|
||||
left: 'center',
|
||||
textStyle: {
|
||||
fontSize: 30
|
||||
},
|
||||
top: 20
|
||||
},
|
||||
grid: {
|
||||
left: '0',
|
||||
top: 0,
|
||||
right: '0',
|
||||
bottom: '2%',
|
||||
containLabel: true
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
textStyle: {
|
||||
fontSize: 24
|
||||
},
|
||||
formatter: function (params: any) {
|
||||
// const title = `<p>${params.seriesName}</p>`
|
||||
const colorDot =
|
||||
'<span style="display:inline-block;margin-right:5px;border-radius:50%;width:10px;height:10px;background-color:' +
|
||||
params.color +
|
||||
'"></span>'
|
||||
return colorDot + params.name + ': ' + params.percent + '%'
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
// orient: 'vertical',
|
||||
// left: 'left'
|
||||
// type: 'warp',
|
||||
bottom: '3%',
|
||||
// left: '30%',
|
||||
width: '78%',
|
||||
textStyle: {
|
||||
fontSize: 24,
|
||||
borderRadius: 0
|
||||
},
|
||||
itemWidth: 24,
|
||||
itemHeight: 24
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: '',
|
||||
type: 'pie',
|
||||
radius: '60%',
|
||||
data: data,
|
||||
label: {
|
||||
// show: false,
|
||||
position: 'inside',
|
||||
// formatter: '{b}-{c}%',
|
||||
formatter: function (params: any) {
|
||||
return params.percent < 10
|
||||
? params.percent + '%'
|
||||
: params.name + ' ' + params.percent + '%'
|
||||
},
|
||||
fontSize: 20,
|
||||
color: '#fff'
|
||||
},
|
||||
emphasis: {
|
||||
itemStyle: {
|
||||
shadowBlur: 10,
|
||||
shadowOffsetX: 0,
|
||||
shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
// data:{
|
||||
// '科室':['科室一','科室二','科室三'],
|
||||
|
|
@ -213,151 +207,183 @@ export function pieEchart(arr: any = [], colorList: any = {}) {
|
|||
// '平均活跃度（人员平均访问次数）':['科室一平均活跃度','科室二平均活跃度','科室三平均活跃度'],
|
||||
// }
|
||||
export function barEchart({ deptName = [], visitCount = [], avgCount = [] }) {
|
||||
return {
|
||||
// width: '100%',
|
||||
title: {
|
||||
text: '调达本部各科室HP登录情况(内部足迹)',
|
||||
left: 'center',
|
||||
textStyle: {
|
||||
fontSize: 30
|
||||
},
|
||||
top: 10
|
||||
},
|
||||
grid: {
|
||||
left: '4%',
|
||||
top: '10%',
|
||||
right: '4%',
|
||||
bottom: '10%',
|
||||
containLabel: true
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
// axisPointer: {
|
||||
// type: 'cross',
|
||||
// crossStyle: {
|
||||
// color: '#999'
|
||||
// }
|
||||
// }
|
||||
},
|
||||
legend: {
|
||||
data: [
|
||||
{
|
||||
name: 'HP访问次数',
|
||||
itemStyle: {
|
||||
// color: '#f8cbad',
|
||||
borderWidth: 0
|
||||
},
|
||||
textStyle: {
|
||||
fontSize: 18
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '平均活跃度（人员平均访问次数）',
|
||||
itemStyle: {
|
||||
// color: '#acc1fb',
|
||||
borderWidth: 0
|
||||
},
|
||||
textStyle: {
|
||||
fontSize: 18
|
||||
}
|
||||
}
|
||||
],
|
||||
// data: ['HP访问次数', '平均活跃度（人员平均访问次数）'],
|
||||
bottom: '0px'
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
// data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
|
||||
data: deptName,
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
rotate: 45,
|
||||
fontSize: 18
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: 'HP访问次数',
|
||||
// min: 0,
|
||||
// max: 250,
|
||||
// interval: 50,
|
||||
axisLabel: {
|
||||
formatter: '{value}'
|
||||
},
|
||||
nameTextStyle: {
|
||||
fontSize: 18
|
||||
},
|
||||
nameRotate: 90,
|
||||
nameGap: '60',
|
||||
nameLocation: 'middle'
|
||||
},
|
||||
{
|
||||
type: 'value',
|
||||
name: '平均活跃度（人员平均访问次数）',
|
||||
// min: 0,
|
||||
// max: 25,
|
||||
// interval: 5,
|
||||
axisLabel: {
|
||||
formatter: '{value}'
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
nameTextStyle: {
|
||||
fontSize: 18
|
||||
},
|
||||
nameRotate: 90,
|
||||
nameGap: '46',
|
||||
nameLocation: 'middle'
|
||||
// axisLine: {
|
||||
// lineStyle: {
|
||||
// color: '#f7c455'
|
||||
// }
|
||||
// }
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: 'HP访问次数',
|
||||
type: 'bar',
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + ''
|
||||
}
|
||||
},
|
||||
// data: [
|
||||
// 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
|
||||
// ]
|
||||
data: visitCount
|
||||
// color: '#5b9bd5'
|
||||
},
|
||||
{
|
||||
name: '平均活跃度（人员平均访问次数）',
|
||||
type: 'line',
|
||||
yAxisIndex: 1,
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + ''
|
||||
}
|
||||
},
|
||||
// data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
|
||||
data: avgCount,
|
||||
smooth: true,
|
||||
color: '#ed7d31'
|
||||
}
|
||||
]
|
||||
// emphasis: {
|
||||
// itemStyle: {
|
||||
// shadowBlur: 10,
|
||||
// shadowOffsetX: 0,
|
||||
// shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
// }
|
||||
// }
|
||||
}
|
||||
return {
|
||||
// width: '100%',
|
||||
title: {
|
||||
text: '调达本部各科室HP登录情况(内部足迹)',
|
||||
left: 'center',
|
||||
textStyle: {
|
||||
fontSize: 30
|
||||
},
|
||||
top: 10
|
||||
},
|
||||
grid: {
|
||||
left: '4%',
|
||||
top: '10%',
|
||||
right: '4%',
|
||||
bottom: '10%',
|
||||
containLabel: true
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
// axisPointer: {
|
||||
// type: 'cross',
|
||||
// crossStyle: {
|
||||
// color: '#999'
|
||||
// }
|
||||
// }
|
||||
},
|
||||
legend: {
|
||||
data: [
|
||||
{
|
||||
name: 'HP访问次数',
|
||||
itemStyle: {
|
||||
// color: '#f8cbad',
|
||||
borderWidth: 0
|
||||
},
|
||||
textStyle: {
|
||||
fontSize: 18
|
||||
}
|
||||
},
|
||||
{
|
||||
name: '平均活跃度（人员平均访问次数）',
|
||||
itemStyle: {
|
||||
// color: '#acc1fb',
|
||||
borderWidth: 0
|
||||
},
|
||||
textStyle: {
|
||||
fontSize: 18
|
||||
}
|
||||
}
|
||||
],
|
||||
// data: ['HP访问次数', '平均活跃度（人员平均访问次数）'],
|
||||
bottom: '0px'
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: 'category',
|
||||
// data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
|
||||
data: deptName,
|
||||
axisPointer: {
|
||||
type: 'shadow'
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
rotate: 45,
|
||||
fontSize: 18
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value',
|
||||
name: 'HP访问次数',
|
||||
// min: 0,
|
||||
// max: 250,
|
||||
// interval: 50,
|
||||
axisLabel: {
|
||||
formatter: '{value}'
|
||||
},
|
||||
nameTextStyle: {
|
||||
fontSize: 18
|
||||
},
|
||||
nameRotate: 90,
|
||||
nameGap: '60',
|
||||
nameLocation: 'middle'
|
||||
},
|
||||
{
|
||||
type: 'value',
|
||||
name: '平均活跃度（人员平均访问次数）',
|
||||
// min: 0,
|
||||
// max: 25,
|
||||
// interval: 5,
|
||||
axisLabel: {
|
||||
formatter: '{value}'
|
||||
},
|
||||
splitLine: {
|
||||
show: false
|
||||
},
|
||||
nameTextStyle: {
|
||||
fontSize: 18
|
||||
},
|
||||
nameRotate: 90,
|
||||
nameGap: '46',
|
||||
nameLocation: 'middle'
|
||||
// axisLine: {
|
||||
// lineStyle: {
|
||||
// color: '#f7c455'
|
||||
// }
|
||||
// }
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: 'HP访问次数',
|
||||
type: 'bar',
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + ''
|
||||
}
|
||||
},
|
||||
// data: [
|
||||
// 2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3
|
||||
// ]
|
||||
data: visitCount
|
||||
// color: '#5b9bd5'
|
||||
},
|
||||
{
|
||||
name: '平均活跃度（人员平均访问次数）',
|
||||
type: 'line',
|
||||
yAxisIndex: 1,
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + ''
|
||||
}
|
||||
},
|
||||
// data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
|
||||
data: avgCount,
|
||||
smooth: true,
|
||||
color: '#ed7d31'
|
||||
}
|
||||
]
|
||||
// emphasis: {
|
||||
// itemStyle: {
|
||||
// shadowBlur: 10,
|
||||
// shadowOffsetX: 0,
|
||||
// shadowColor: 'rgba(0, 0, 0, 0.5)'
|
||||
// }
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
export function barEchartModuleList(data = []) {
|
||||
const option = {
|
||||
title: {
|
||||
text: '模块更新统计',
|
||||
left: 'center',
|
||||
textStyle: {
|
||||
fontSize: 30
|
||||
},
|
||||
top: 10
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: data.map((item) => item.moduleName)
|
||||
// data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
series: [
|
||||
{
|
||||
data: data.map((item) => item.updateCount),
|
||||
// data: [120, 200, 150, 80, 70, 110, 130],
|
||||
type: 'bar'
|
||||
}
|
||||
]
|
||||
}
|
||||
return option
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,60 +4,56 @@ import AppBlock from '@/components/AppBlock.vue'
|
|||
import AppNewsBox from '@/components/AppNewsBox.vue'
|
||||
import Layout from './components/Layout.vue'
|
||||
import DetailNews from './DetailNews.vue'
|
||||
import {
|
||||
getArticleDetail,
|
||||
getArticlePage,
|
||||
getManagerDetail
|
||||
} from '@/api/daikin/base'
|
||||
import { getArticleDetail, getArticlePage, getManagerDetail, report } from '@/api/daikin/base'
|
||||
import { message } from '@/utils/message'
|
||||
|
||||
const { push } = useRouter()
|
||||
const route = useRoute()
|
||||
|
||||
const SideNews = [
|
||||
{ key: 'IntelligenceOutside', name: '社外情报' },
|
||||
{ key: 'IntelligenceWithin', name: '社内情报' }
|
||||
{ key: 'IntelligenceOutside', name: '社外情报' },
|
||||
{ key: 'IntelligenceWithin', name: '社内情报' }
|
||||
]
|
||||
|
||||
const state = ref<any>({})
|
||||
async function getData() {
|
||||
const { id, flag } = route.params
|
||||
console.log(typeof flag)
|
||||
if (!id) return
|
||||
if (flag === 'true') {
|
||||
// 驳回&撤回
|
||||
const { data } = await getManagerDetail(id as string)
|
||||
data.tagColor = data.tag === '紧急' ? '#e60e0e' : '#2cba06'
|
||||
data.content = unescapeHTML(data.content)
|
||||
state.value = data
|
||||
} else {
|
||||
const { data } = await getArticleDetail(id as string)
|
||||
data.tagColor = data.tag === '紧急' ? '#e60e0e' : '#2cba06'
|
||||
const { id, flag } = route.params
|
||||
console.log(typeof flag)
|
||||
if (!id) return
|
||||
if (flag === 'true') {
|
||||
// 驳回&撤回
|
||||
const { data } = await getManagerDetail(id as string)
|
||||
data.tagColor = data.tag === '紧急' ? '#e60e0e' : '#2cba06'
|
||||
data.content = unescapeHTML(data.content)
|
||||
state.value = data
|
||||
} else {
|
||||
const { data } = await getArticleDetail(id as string)
|
||||
data.tagColor = data.tag === '紧急' ? '#e60e0e' : '#2cba06'
|
||||
|
||||
data.content = unescapeHTML(data.content)
|
||||
state.value = data
|
||||
}
|
||||
data.content = unescapeHTML(data.content)
|
||||
state.value = data
|
||||
}
|
||||
}
|
||||
function unescapeHTML(html: string) {
|
||||
const doc = new DOMParser().parseFromString(html, 'text/html')
|
||||
return doc.documentElement.textContent
|
||||
const doc = new DOMParser().parseFromString(html, 'text/html')
|
||||
return doc.documentElement.textContent
|
||||
}
|
||||
|
||||
async function getDatas(id: string) {
|
||||
if (!id) return
|
||||
const { data } = await getArticleDetail(id as string)
|
||||
data.content = unescapeHTML(data.content)
|
||||
state.value = data
|
||||
if (!id) return
|
||||
const { data } = await getArticleDetail(id as string)
|
||||
data.content = unescapeHTML(data.content)
|
||||
state.value = data
|
||||
}
|
||||
|
||||
async function toDetail2(n: { id: any }) {
|
||||
console.log(route, route.path, n.id)
|
||||
if (n.id === 0) return
|
||||
if (n.isSelect === 1) {
|
||||
getDatas(n.id)
|
||||
} else {
|
||||
message.info('您没有权限查看！')
|
||||
}
|
||||
console.log(route, route.path, n.id)
|
||||
if (n.id === 0) return
|
||||
if (n.isSelect === 1) {
|
||||
getDatas(n.id)
|
||||
} else {
|
||||
message.info('您没有权限查看！')
|
||||
}
|
||||
}
|
||||
|
||||
getData()
|
||||
|
|
@ -67,101 +63,96 @@ getPageLists(1)
|
|||
const neiScoll = ref<HTMLElement | null>(null)
|
||||
const waiScoll = ref<HTMLElement | null>(null)
|
||||
onMounted(() => {
|
||||
neiScoll.value?.addEventListener('scroll', handleNeiScoll)
|
||||
waiScoll.value?.addEventListener('scroll', handlewaiScoll)
|
||||
neiScoll.value?.addEventListener('scroll', handleNeiScoll)
|
||||
waiScoll.value?.addEventListener('scroll', handlewaiScoll)
|
||||
})
|
||||
|
||||
const listData = ref<any[]>([])
|
||||
let neiLength: number
|
||||
let neiPum = 1
|
||||
async function getPageList(page) {
|
||||
const pasr = {
|
||||
pageNum: page,
|
||||
pageSize: 5,
|
||||
type: 2,
|
||||
position: 'recommend'
|
||||
}
|
||||
const { rows, total } = await getArticlePage(pasr)
|
||||
neiLength = total / 6
|
||||
listData.value.push(...rows)
|
||||
console.log(listData.value)
|
||||
const pasr = {
|
||||
pageNum: page,
|
||||
pageSize: 5,
|
||||
type: 2,
|
||||
position: 'recommend'
|
||||
}
|
||||
const { rows, total } = await getArticlePage(pasr)
|
||||
neiLength = total / 6
|
||||
listData.value.push(...rows)
|
||||
console.log(listData.value)
|
||||
}
|
||||
|
||||
const listDatas = ref<any[]>([])
|
||||
let waiLength: number
|
||||
let waiPum = 1
|
||||
async function getPageLists(page) {
|
||||
const pasr = {
|
||||
pageNum: page,
|
||||
pageSize: 5,
|
||||
type: 1,
|
||||
position: 'recommend'
|
||||
}
|
||||
const { rows, total } = await getArticlePage(pasr)
|
||||
waiLength = total / 6
|
||||
listDatas.value.push(...rows)
|
||||
const pasr = {
|
||||
pageNum: page,
|
||||
pageSize: 5,
|
||||
type: 1,
|
||||
position: 'recommend'
|
||||
}
|
||||
const { rows, total } = await getArticlePage(pasr)
|
||||
waiLength = total / 6
|
||||
listDatas.value.push(...rows)
|
||||
}
|
||||
|
||||
const handleNeiScoll = () => {
|
||||
const container = neiScoll.value
|
||||
if (container) {
|
||||
const isAtBottom =
|
||||
container.scrollHeight - container.scrollTop === container.clientHeight
|
||||
if (isAtBottom) {
|
||||
if (neiPum < neiLength) {
|
||||
++neiPum
|
||||
getPageList(neiPum)
|
||||
}
|
||||
}
|
||||
}
|
||||
const container = neiScoll.value
|
||||
if (container) {
|
||||
const isAtBottom = container.scrollHeight - container.scrollTop === container.clientHeight
|
||||
if (isAtBottom) {
|
||||
if (neiPum < neiLength) {
|
||||
++neiPum
|
||||
getPageList(neiPum)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
const handlewaiScoll = () => {
|
||||
const container = waiScoll.value
|
||||
if (container) {
|
||||
const isAtBottom =
|
||||
container.scrollHeight - container.scrollTop === container.clientHeight
|
||||
if (isAtBottom) {
|
||||
if (waiPum < waiLength) {
|
||||
++waiPum
|
||||
getPageList(waiPum)
|
||||
}
|
||||
}
|
||||
}
|
||||
const container = waiScoll.value
|
||||
if (container) {
|
||||
const isAtBottom = container.scrollHeight - container.scrollTop === container.clientHeight
|
||||
if (isAtBottom) {
|
||||
if (waiPum < waiLength) {
|
||||
++waiPum
|
||||
getPageList(waiPum)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Layout>
|
||||
<div class="page-wrap h-834px">
|
||||
<div class="page-main">
|
||||
<AppBlock class="h-full">
|
||||
<div class="overflow-y-auto h-full">
|
||||
<div class="px46px py40px">
|
||||
<DetailNews
|
||||
:title="state.title"
|
||||
:content="state.content"
|
||||
:publishTime="state.publishTime"
|
||||
:tag="state.tag"
|
||||
:tagColor="state.tagColor"
|
||||
:source="state.source"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
<div class="page-side">
|
||||
<AppBlock class="h-400px">
|
||||
<div class="box h-full">
|
||||
<div
|
||||
class="box-title flex items-center"
|
||||
@click="push({ name: 'IntelligenceWithin' })"
|
||||
>
|
||||
<span class="flex-1">社内情报</span>
|
||||
<span>❯</span>
|
||||
</div>
|
||||
<div ref="neiScoll" class="box-content overflow-y-auto px22px">
|
||||
<div class="py13px line" v-for="i in listData" :key="i">
|
||||
<!-- <AppNewsBox @click="toDetail2(i)"
|
||||
<Layout>
|
||||
<div class="page-wrap h-834px">
|
||||
<div class="page-main">
|
||||
<AppBlock class="h-full">
|
||||
<div class="overflow-y-auto h-full">
|
||||
<div class="px46px py40px">
|
||||
<DetailNews
|
||||
:title="state.title"
|
||||
:content="state.content"
|
||||
:publishTime="state.publishTime"
|
||||
:tag="state.tag"
|
||||
:tagColor="state.tagColor"
|
||||
:source="state.source"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
<div class="page-side">
|
||||
<AppBlock class="h-400px">
|
||||
<div class="box h-full">
|
||||
<div class="box-title flex items-center" @click="push({ name: 'IntelligenceWithin' })">
|
||||
<span class="flex-1">社内情报</span>
|
||||
<span>❯</span>
|
||||
</div>
|
||||
<div ref="neiScoll" class="box-content overflow-y-auto px22px">
|
||||
<div class="py13px line" v-for="i in listData" :key="i">
|
||||
<!-- <AppNewsBox @click="toDetail2(i)"
|
||||
class="!lh-2em"
|
||||
:labelText="i.tag"
|
||||
labelColor="#2cba06"
|
||||
|
|
@ -169,40 +160,29 @@ const handlewaiScoll = () => {
|
|||
:date="i.publishTime"
|
||||
size="h20px"
|
||||
/> -->
|
||||
<div class="flex" @click="toDetail2(i)">
|
||||
<img
|
||||
v-if="i.tag === 'New'"
|
||||
src="../../../assets/images/NEW3.gif"
|
||||
class="h20px"
|
||||
/>
|
||||
<img
|
||||
v-if="i.tag === '紧急'"
|
||||
src="../../../assets/images/jj.gif"
|
||||
class="h20px"
|
||||
/>
|
||||
<div class="ml5px leading-4.5 max-w300px overflow-ellipsis">
|
||||
{{ i.title }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-#808696 text-right">{{ i.publishTime }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
<div class="page-side">
|
||||
<AppBlock class="h-400px">
|
||||
<div class="box h-full">
|
||||
<div
|
||||
class="box-title flex items-center"
|
||||
@click="push({ name: 'IntelligenceOutside' })"
|
||||
>
|
||||
<span class="flex-1">社外情报</span>
|
||||
<span>❯</span>
|
||||
</div>
|
||||
<div ref="waiScoll" class="box-content overflow-y-auto px22px">
|
||||
<div class="py13px line" v-for="i in listDatas" :key="i">
|
||||
<!-- <AppNewsBox @click="toDetail2(i)"
|
||||
<div class="flex" @click="toDetail2(i)">
|
||||
<img v-if="i.tag === 'New'" src="../../../assets/images/NEW3.gif" class="h20px" />
|
||||
<img v-if="i.tag === '紧急'" src="../../../assets/images/jj.gif" class="h20px" />
|
||||
<div class="ml5px leading-4.5 max-w300px overflow-ellipsis">
|
||||
{{ i.title }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-#808696 text-right">{{ i.publishTime }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
<div class="page-side">
|
||||
<AppBlock class="h-400px">
|
||||
<div class="box h-full">
|
||||
<div class="box-title flex items-center" @click="push({ name: 'IntelligenceOutside' })">
|
||||
<span class="flex-1">社外情报</span>
|
||||
<span>❯</span>
|
||||
</div>
|
||||
<div ref="waiScoll" class="box-content overflow-y-auto px22px">
|
||||
<div class="py13px line" v-for="i in listDatas" :key="i">
|
||||
<!-- <AppNewsBox @click="toDetail2(i)"
|
||||
class="!lh-2em"
|
||||
:labelText="i.tag"
|
||||
labelColor="#2cba06"
|
||||
|
|
@ -211,80 +191,72 @@ const handlewaiScoll = () => {
|
|||
size="h20px"
|
||||
/> -->
|
||||
|
||||
<div class="flex" @click="toDetail2(i)">
|
||||
<img
|
||||
v-if="i.tag === 'New'"
|
||||
src="../../../assets/images/NEW3.gif"
|
||||
class="h20px"
|
||||
/>
|
||||
<img
|
||||
v-if="i.tag === '紧急'"
|
||||
src="../../../assets/images/jj.gif"
|
||||
class="h20px"
|
||||
/>
|
||||
<div class="ml5px leading-4.5 max-w300px overflow-ellipsis">
|
||||
{{ i.title }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-#808696 text-right mt8px">
|
||||
{{ i.publishTime }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
<div class="flex" @click="toDetail2(i)">
|
||||
<img v-if="i.tag === 'New'" src="../../../assets/images/NEW3.gif" class="h20px" />
|
||||
<img v-if="i.tag === '紧急'" src="../../../assets/images/jj.gif" class="h20px" />
|
||||
<div class="ml5px leading-4.5 max-w300px overflow-ellipsis">
|
||||
{{ i.title }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-#808696 text-right mt8px">
|
||||
{{ i.publishTime }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</AppBlock>
|
||||
</div>
|
||||
</div>
|
||||
</Layout>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.overflow-ellipsis {
|
||||
white-space: nowrap; /* 防止换行 */
|
||||
overflow: hidden; /* 隐藏溢出部分 */
|
||||
text-overflow: ellipsis; /* 显示省略号 */
|
||||
white-space: nowrap; /* 防止换行 */
|
||||
overflow: hidden; /* 隐藏溢出部分 */
|
||||
text-overflow: ellipsis; /* 显示省略号 */
|
||||
}
|
||||
.page-wrap {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 314px;
|
||||
grid-template-rows: repeat(2, 1fr);
|
||||
grid-column-gap: 30px;
|
||||
grid-row-gap: 30px;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 314px;
|
||||
grid-template-rows: repeat(2, 1fr);
|
||||
grid-column-gap: 30px;
|
||||
grid-row-gap: 30px;
|
||||
|
||||
.page-main {
|
||||
height: 830px;
|
||||
grid-area: 1 / 1 / 3 / 2;
|
||||
width: 100%;
|
||||
}
|
||||
.page-side {
|
||||
height: 100%;
|
||||
grid-area: 1 / 2 / 2 / 3;
|
||||
&:last-of-type {
|
||||
height: 300px;
|
||||
grid-area: 2 / 2 / 3 / 3;
|
||||
}
|
||||
}
|
||||
.page-main {
|
||||
height: 830px;
|
||||
grid-area: 1 / 1 / 3 / 2;
|
||||
width: 100%;
|
||||
}
|
||||
.page-side {
|
||||
height: 100%;
|
||||
grid-area: 1 / 2 / 2 / 3;
|
||||
&:last-of-type {
|
||||
height: 300px;
|
||||
grid-area: 2 / 2 / 3 / 3;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.box {
|
||||
--title-h: 58px;
|
||||
--title-h: 58px;
|
||||
|
||||
border: 0;
|
||||
.box-title {
|
||||
height: var(--title-h);
|
||||
color: #fff;
|
||||
background-color: #537deb;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
padding: 0 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.box-content {
|
||||
height: 100%;
|
||||
max-height: calc(100% - var(--title-h));
|
||||
}
|
||||
border: 0;
|
||||
.box-title {
|
||||
height: var(--title-h);
|
||||
color: #fff;
|
||||
background-color: #537deb;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
padding: 0 24px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.box-content {
|
||||
height: 100%;
|
||||
max-height: calc(100% - var(--title-h));
|
||||
}
|
||||
}
|
||||
.line {
|
||||
border-bottom: 1px solid #eef3fb;
|
||||
border-bottom: 1px solid #eef3fb;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -9,6 +9,7 @@ import AppPagination from '@/components/AppPagination.vue'
|
|||
import { Navs, useData } from './ListPageData'
|
||||
import { NEmpty } from 'naive-ui'
|
||||
import { message } from '@/utils/message'
|
||||
import { report } from '@/api/daikin/base'
|
||||
|
||||
const { push } = useRouter()
|
||||
const route = useRoute()
|
||||
|
|
@ -18,12 +19,12 @@ const { state, list } = useData()
|
|||
const Type1 = [
|
||||
{ key: '1', name: '外部环境', route: 'IntelligenceOutside', icon: getImg('icon-1.svg') },
|
||||
{ key: '2', name: '竞争对手', route: 'IntelligenceOutside', icon: getImg('icon-2.svg') },
|
||||
{ key: '3', name: '供方动向', route: 'IntelligenceOutside', icon: getImg('icon-3.svg') },
|
||||
{ key: '3', name: '供方动向', route: 'IntelligenceOutside', icon: getImg('icon-3.svg') }
|
||||
]
|
||||
const Type2 = [
|
||||
{ key: '4', name: '大金集团', route: 'IntelligenceWithin', icon: getImg('icon-4.svg') },
|
||||
{ key: '5', name: '中国据点', route: 'IntelligenceWithin', icon: getImg('icon-5.svg') },
|
||||
{ key: '6', name: '调达本部', route: 'IntelligenceWithin', icon: getImg('icon-6.svg') },
|
||||
{ key: '6', name: '调达本部', route: 'IntelligenceWithin', icon: getImg('icon-6.svg') }
|
||||
]
|
||||
|
||||
const firstNew = ref<any>({})
|
||||
|
|
@ -39,19 +40,16 @@ watchEffect(() => {
|
|||
// push(`${route.path.replace('/Home','')}/${firstNew.id}`)
|
||||
// // push({name:route.name,params:{id:firstNew.id}})
|
||||
// }
|
||||
const toDetail2 =(item: { id: any })=>{
|
||||
console.log(route,route.path,item.id)
|
||||
const toDetail2 = (item: { id: any }) => {
|
||||
console.log(route, route.path, item.id)
|
||||
// push(`${route.path}/${item.id}`)
|
||||
if(item.isSelect===1){
|
||||
push(`${route.path.replace('/Home','')}/${item.id}`)
|
||||
if (item.isSelect === 1) {
|
||||
push(`${route.path.replace('/Home', '')}/${item.id}`)
|
||||
} else {
|
||||
message.error('没有访问权限')
|
||||
}
|
||||
else{
|
||||
message.error("没有访问权限")
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
report({ moduleCode: 'App_Article' })
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -93,8 +91,17 @@ const toDetail2 =(item: { id: any })=>{
|
|||
<section class="px44px mt44px">
|
||||
<!-- <AppAlert v-if="firstNew?.title" @click="push(`${route.path.replace('/Home','')}/${firstNew.id}`)">{{ firstNew.title }}</AppAlert> -->
|
||||
<div class="mt12px news-wrap max-h-467px mb32px overflow-y-auto">
|
||||
<div class="news-item" v-for="item in restNews" :key="item.id" @click="toDetail2(item)">
|
||||
<AppNewsBox class="!lh-2em" :isRead="item.isRead" :top="item.isTop" :labelText="item.tag" labelColor="#2cba06" :size="item.tag==='New'?'h20px':'h30px'" :text="item.title" :date="item.publishTime" />
|
||||
<div class="news-item" v-for="item in restNews" :key="item.id" @click="toDetail2(item)">
|
||||
<AppNewsBox
|
||||
class="!lh-2em"
|
||||
:isRead="item.isRead"
|
||||
:top="item.isTop"
|
||||
:labelText="item.tag"
|
||||
labelColor="#2cba06"
|
||||
:size="item.tag === 'New' ? 'h20px' : 'h30px'"
|
||||
:text="item.title"
|
||||
:date="item.publishTime"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center mt32px" v-if="state.total">
|
||||
|
|
|
|||
|
|
@ -1,103 +1,103 @@
|
|||
<!-- 外部情报 -->
|
||||
<script setup lang="tsx">
|
||||
import AppBlock from "@/components/AppBlock.vue";
|
||||
import Layout from "./components/Layout.vue";
|
||||
import OverviewBlock from "./OverviewBlock.vue";
|
||||
import { getImg } from "./images";
|
||||
import { useData } from "./OverviewData";
|
||||
import { getBannerList } from "@/api/daikin/base";
|
||||
const { data1,data2,data3,data4,data5,data6,data7 } = useData();
|
||||
import AppBlock from '@/components/AppBlock.vue'
|
||||
import Layout from './components/Layout.vue'
|
||||
import OverviewBlock from './OverviewBlock.vue'
|
||||
import { getImg } from './images'
|
||||
import { useData } from './OverviewData'
|
||||
import { getBannerList, report } from '@/api/daikin/base'
|
||||
const { data1, data2, data3, data4, data5, data6, data7 } = useData()
|
||||
|
||||
// console.log(data.value)
|
||||
const swipeActiveIndex = ref(0);
|
||||
const swipeActiveIndex = ref(0)
|
||||
function handleIndex(x: any) {
|
||||
swipeActiveIndex.value = x.realIndex;
|
||||
swipeActiveIndex.value = x.realIndex
|
||||
}
|
||||
|
||||
async function getBanner() {
|
||||
// 类型 1-社外 2-社内
|
||||
const {data} =await getBannerList({type:1})
|
||||
const {data:da} =await getBannerList({type:2})
|
||||
if(data&&data!='null'&&data.length>0){
|
||||
const { data } = await getBannerList({ type: 1 })
|
||||
const { data: da } = await getBannerList({ type: 2 })
|
||||
if (data && data != 'null' && data.length > 0) {
|
||||
imageList1.value = data
|
||||
}
|
||||
if(da&&da!='null'&&da.length>0){
|
||||
if (da && da != 'null' && da.length > 0) {
|
||||
imageList2.value = da
|
||||
}
|
||||
}
|
||||
getBanner()
|
||||
const imageList1 =ref([
|
||||
{ title: "三菱电机FY22年度方针说明会", bannerImg: getImg("swipe-1.svg") ,id:0},
|
||||
{ title: "23年度供应商大会热烈筹备中", bannerImg: getImg("swipe-2.svg") ,id:0},
|
||||
getBanner()
|
||||
report({ moduleCode: 'App_Article' })
|
||||
const imageList1 = ref([
|
||||
{ title: '三菱电机FY22年度方针说明会', bannerImg: getImg('swipe-1.svg'), id: 0 },
|
||||
{ title: '23年度供应商大会热烈筹备中', bannerImg: getImg('swipe-2.svg'), id: 0 }
|
||||
])
|
||||
const imageList2 =ref([
|
||||
{ title: "三菱电机FY22年度方针说明会", bannerImg: getImg("swipe-1.svg") ,id:0},
|
||||
{ title: "23年度供应商大会热烈筹备中", bannerImg: getImg("swipe-2.svg") ,id:0},
|
||||
const imageList2 = ref([
|
||||
{ title: '三菱电机FY22年度方针说明会', bannerImg: getImg('swipe-1.svg'), id: 0 },
|
||||
{ title: '23年度供应商大会热烈筹备中', bannerImg: getImg('swipe-2.svg'), id: 0 }
|
||||
])
|
||||
|
||||
const swipeImages = [
|
||||
{ title: "三菱电机FY22年度方针说明会", bannerImg: getImg("swipe-1.svg") },
|
||||
{ title: "23年度供应商大会热烈筹备中", bannerImg: getImg("swipe-2.svg") },
|
||||
];
|
||||
{ title: '三菱电机FY22年度方针说明会', bannerImg: getImg('swipe-1.svg') },
|
||||
{ title: '23年度供应商大会热烈筹备中', bannerImg: getImg('swipe-2.svg') }
|
||||
]
|
||||
const items1 = computed(() => [
|
||||
{
|
||||
key: "1",
|
||||
name: "外部环境",
|
||||
color: "#63BFB2",
|
||||
title: "全年原材料供应状况紧张",
|
||||
icon: getImg("icon-1.svg"),
|
||||
news:unref(data1), //.splice(0, 3),
|
||||
list:unref(data7)[1]?? [],
|
||||
key: '1',
|
||||
name: '外部环境',
|
||||
color: '#63BFB2',
|
||||
title: '全年原材料供应状况紧张',
|
||||
icon: getImg('icon-1.svg'),
|
||||
news: unref(data1), //.splice(0, 3),
|
||||
list: unref(data7)[1] ?? []
|
||||
},
|
||||
{
|
||||
key: "2",
|
||||
name: "竞争对手",
|
||||
color: "#F57E6E",
|
||||
title: "三菱召开年度方针说明会",
|
||||
icon: getImg("icon-2.svg"),
|
||||
key: '2',
|
||||
name: '竞争对手',
|
||||
color: '#F57E6E',
|
||||
title: '三菱召开年度方针说明会',
|
||||
icon: getImg('icon-2.svg'),
|
||||
news: unref(data2), //.splice(0, 3),
|
||||
list:unref(data7)[2]?? [],
|
||||
list: unref(data7)[2] ?? []
|
||||
},
|
||||
{
|
||||
key: "3",
|
||||
name: "供方动向",
|
||||
color: "#537DEB",
|
||||
title: "全年原材料供应状况紧张",
|
||||
icon: getImg("icon-3.svg"),
|
||||
news:unref(data3), //.splice(0, 3),
|
||||
list:unref(data7)[3]?? [],
|
||||
},
|
||||
]);
|
||||
key: '3',
|
||||
name: '供方动向',
|
||||
color: '#537DEB',
|
||||
title: '全年原材料供应状况紧张',
|
||||
icon: getImg('icon-3.svg'),
|
||||
news: unref(data3), //.splice(0, 3),
|
||||
list: unref(data7)[3] ?? []
|
||||
}
|
||||
])
|
||||
const items2 = computed(() => [
|
||||
{
|
||||
key: "4",
|
||||
name: "大金集团",
|
||||
color: "#5DCCFA",
|
||||
title: "23年度集团方针正式发行",
|
||||
icon: getImg("icon-4.svg"),
|
||||
key: '4',
|
||||
name: '大金集团',
|
||||
color: '#5DCCFA',
|
||||
title: '23年度集团方针正式发行',
|
||||
icon: getImg('icon-4.svg'),
|
||||
news: unref(data4), //.splice(0, 3),
|
||||
list:unref(data7)[4]?? [],
|
||||
list: unref(data7)[4] ?? []
|
||||
},
|
||||
{
|
||||
key: "5",
|
||||
name: "中国据点",
|
||||
color: "#E8A743",
|
||||
title: "惠州工厂稼动正式开始",
|
||||
icon: getImg("icon-6.svg"),
|
||||
key: '5',
|
||||
name: '中国据点',
|
||||
color: '#E8A743',
|
||||
title: '惠州工厂稼动正式开始',
|
||||
icon: getImg('icon-6.svg'),
|
||||
news: unref(data5), //.splice(0, 3),
|
||||
list:unref(data7)[5]?? [],
|
||||
list: unref(data7)[5] ?? []
|
||||
},
|
||||
{
|
||||
key: "6",
|
||||
name: "调达本部",
|
||||
color: "#926CE1",
|
||||
title: "23年度供应商大会热烈筹备中",
|
||||
icon: getImg("icon-5.svg"),
|
||||
news:unref(data6), //.splice(0, 3),
|
||||
list:unref(data7)[6]?? [],
|
||||
},
|
||||
]);
|
||||
|
||||
key: '6',
|
||||
name: '调达本部',
|
||||
color: '#926CE1',
|
||||
title: '23年度供应商大会热烈筹备中',
|
||||
icon: getImg('icon-5.svg'),
|
||||
news: unref(data6), //.splice(0, 3),
|
||||
list: unref(data7)[6] ?? []
|
||||
}
|
||||
])
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -134,7 +134,7 @@ const items2 = computed(() => [
|
|||
position: relative;
|
||||
padding-left: 24px;
|
||||
&::before {
|
||||
content: " ";
|
||||
content: ' ';
|
||||
display: block;
|
||||
width: 8px;
|
||||
height: 30px;
|
||||
|
|
|
|||
|
|
@ -7,16 +7,24 @@ import { useDate } from '@/views/home/hooks/useDate'
|
|||
import type { FormInst } from 'naive-ui'
|
||||
import { useMessage } from 'naive-ui'
|
||||
import { ref } from 'vue'
|
||||
import { NModal, NCard, NForm, NButton, NFormItem, NInput, NRadio, NSelect, NSpace, NRadioGroup } from 'naive-ui'
|
||||
import {
|
||||
NModal,
|
||||
NCard,
|
||||
NForm,
|
||||
NButton,
|
||||
NFormItem,
|
||||
NInput,
|
||||
NRadio,
|
||||
NSelect,
|
||||
NSpace,
|
||||
NRadioGroup
|
||||
} from 'naive-ui'
|
||||
import { saveArticle } from '@/api/daikin/base'
|
||||
import { useUserStore } from '@/stores/modules/user'
|
||||
|
||||
const store =useUserStore()
|
||||
console.log("🚀 ~ file: Layout.vue:15 ~ store:", store.user)
|
||||
const store = useUserStore()
|
||||
const { day, week } = useDate()
|
||||
const { push } = useRouter()
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -30,14 +38,35 @@ const { push } = useRouter()
|
|||
<div class="text-36px">外部情报</div>
|
||||
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
||||
<div class="text-18px flex-1">{{ week }}</div>
|
||||
<div style="margin-right: 8px" v-if="store.user.isPublish === 1 || store.user.roleCode === 'zhuxi'">
|
||||
<div class="add text-18px px13px py11px cursor-pointer" @click="push({ path: '/Home/Process' })">情报流程</div>
|
||||
<div
|
||||
style="margin-right: 8px"
|
||||
v-if="store.user.isPublish === 1 || store.user.roleCode === 'zhuxi'"
|
||||
>
|
||||
<div
|
||||
class="add text-18px px13px py11px cursor-pointer"
|
||||
@click="push({ path: '/Home/Process' })"
|
||||
>
|
||||
情报流程
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-right: 8px" v-if="store.user.isPublish ===1 || store.user.roleCode === 'zhuxi'">
|
||||
<div class="add text-18px px13px py11px cursor-pointer" @click="push({name:'messageSelect'})">留言板</div>
|
||||
<div
|
||||
style="margin-right: 8px"
|
||||
v-if="store.user.isPublish === 1 || store.user.roleCode === 'zhuxi'"
|
||||
>
|
||||
<div
|
||||
class="add text-18px px13px py11px cursor-pointer"
|
||||
@click="push({ name: 'messageSelect' })"
|
||||
>
|
||||
留言板
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="store.user.isPublish ===1">
|
||||
<div class="add text-18px px13px py11px cursor-pointer" @click="push({name:'InfosEdit'})">+ 新增</div>
|
||||
<div v-if="store.user.isPublish === 1">
|
||||
<div
|
||||
class="add text-18px px13px py11px cursor-pointer"
|
||||
@click="push({ name: 'InfosEdit' })"
|
||||
>
|
||||
+ 新增
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-1 mt30px text-#142142">
|
||||
|
|
@ -131,7 +160,7 @@ const { push } = useRouter()
|
|||
}
|
||||
|
||||
.add {
|
||||
border: 1px solid #FFFFFF;
|
||||
border: 1px solid #ffffff;
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
|
|
@ -139,10 +168,10 @@ const { push } = useRouter()
|
|||
width: 80px;
|
||||
height: 80px;
|
||||
border-radius: 20px;
|
||||
background-color: #C2C2C2;
|
||||
background-color: #c2c2c2;
|
||||
}
|
||||
|
||||
.img.yes {
|
||||
background-color: #63BFB2;
|
||||
background-color: #63bfb2;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,173 +1,184 @@
|
|||
<script setup lang="ts">
|
||||
import { deptTree, getGroupList,addGroup, getPage,deleteGroup } from '@/api/daikin/base'
|
||||
import { deptTree, getGroupList, addGroup, getPage, deleteGroup } from '@/api/daikin/base'
|
||||
import { message } from '@/utils/message'
|
||||
import { Search, Refresh } from '@element-plus/icons-vue'
|
||||
import {noticeld} from '@/stores/modules/noticeId'
|
||||
import { noticeld } from '@/stores/modules/noticeId'
|
||||
import { uniqBy, cloneDeep } from 'lodash-es'
|
||||
|
||||
const stores = noticeld()
|
||||
const treeData = ref<any>()
|
||||
const emit = defineEmits(['clickChild','CloseThis'])
|
||||
const emit = defineEmits(['clickChild', 'CloseThis'])
|
||||
const FlashOutline = ref('')
|
||||
const treeRef =ref()
|
||||
const treeRef = ref()
|
||||
const flag = ref(false)
|
||||
async function getTree() {
|
||||
const reviewSource =stores.article.reviewSource
|
||||
const { data } = await deptTree({reviewSource})
|
||||
if(data&&data!='null'&&data.length>0){
|
||||
treeData.value = data
|
||||
}
|
||||
|
||||
console.log(data)
|
||||
const reviewSource = stores.article.reviewSource
|
||||
const { data } = await deptTree({ reviewSource })
|
||||
if (data && data != 'null' && data.length > 0) {
|
||||
treeData.value = data
|
||||
}
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
const props = defineProps({
|
||||
userDataList: {
|
||||
userDataList: {
|
||||
type: Array as PropType<any[]>,
|
||||
default: () => [],
|
||||
},
|
||||
default: () => []
|
||||
}
|
||||
})
|
||||
|
||||
const da = reactive({
|
||||
pageNum: '1',
|
||||
pageSize: '1000',
|
||||
phonenumber: '',
|
||||
status: '',
|
||||
beingTime: '',
|
||||
endTime: '',
|
||||
deptId: '',
|
||||
nickName:''
|
||||
pageNum: '1',
|
||||
pageSize: '1000',
|
||||
phonenumber: '',
|
||||
status: '',
|
||||
beingTime: '',
|
||||
endTime: '',
|
||||
deptId: '',
|
||||
nickName: ''
|
||||
})
|
||||
const userData = ref<any>()
|
||||
async function getUserPage() {
|
||||
const reviewSource =stores.article.reviewSource
|
||||
const {pageNum,pageSize,phonenumber,status,beingTime,endTime,deptId,nickName} = unref(da)
|
||||
const { rows } = await getPage({pageNum,pageSize,phonenumber,status,beingTime,endTime,deptId,nickName,reviewSource})
|
||||
const rowsD = rows.map((i: any) => {
|
||||
if (i.loginDate) {
|
||||
i.loginDate = i.loginDate.slice(0, 10)
|
||||
}
|
||||
|
||||
return i
|
||||
})
|
||||
userData.value = rowsD
|
||||
|
||||
|
||||
|
||||
const reviewSource = stores.article.reviewSource
|
||||
const { pageNum, pageSize, phonenumber, status, beingTime, endTime, deptId, nickName } = unref(da)
|
||||
const { rows } = await getPage({
|
||||
pageNum,
|
||||
pageSize,
|
||||
phonenumber,
|
||||
status,
|
||||
beingTime,
|
||||
endTime,
|
||||
deptId,
|
||||
nickName,
|
||||
reviewSource
|
||||
})
|
||||
const rowsD = rows.map((i: any) => {
|
||||
if (i.loginDate) {
|
||||
i.loginDate = i.loginDate.slice(0, 10)
|
||||
}
|
||||
|
||||
return i
|
||||
})
|
||||
const data = cloneDeep(toRaw(multipleSelection.value))
|
||||
flag.value = false
|
||||
userData.value = rowsD
|
||||
setTimeout(() => {
|
||||
selection(data)
|
||||
}, 150)
|
||||
}
|
||||
|
||||
function selection(){
|
||||
const list = props.userDataList
|
||||
if(userData.value&&list){
|
||||
const commonItems = userData.value.filter((item1: { userId: any; }) =>
|
||||
list.some(item2 => item2.userId === item1.userId)
|
||||
);
|
||||
toggleSelection(commonItems)
|
||||
}
|
||||
|
||||
function selection(list = props.userDataList) {
|
||||
if (userData.value && list) {
|
||||
const commonItems = userData.value.filter((item1: { userId: any }) =>
|
||||
list.some((item2) => item2.userId === item1.userId)
|
||||
)
|
||||
toggleSelection(commonItems)
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
setTimeout(() => {
|
||||
setTimeout(() => {
|
||||
selection()
|
||||
}, 1000);
|
||||
}, 1000)
|
||||
})
|
||||
|
||||
const ss = computed(() => [da.deptId,da.nickName])
|
||||
watch(() => unref(ss),
|
||||
async (v) => {
|
||||
getUserPage()
|
||||
},
|
||||
{ immediate: true, deep: true },
|
||||
const ss = computed(() => [da.deptId, da.nickName])
|
||||
watch(
|
||||
() => unref(ss),
|
||||
async (v) => {
|
||||
getUserPage()
|
||||
},
|
||||
{ immediate: true, deep: true }
|
||||
)
|
||||
const thisClick = (e: { id: string }) => {
|
||||
da.deptId = e.id
|
||||
// console.log(e)
|
||||
da.deptId = e.id
|
||||
// console.log(e)
|
||||
}
|
||||
|
||||
const formInline = ref()
|
||||
const onSubmit = () => {
|
||||
// console.log(formInline.value)
|
||||
da.nickName= formInline.value
|
||||
// console.log(formInline.value)
|
||||
da.nickName = formInline.value
|
||||
}
|
||||
const resetForm = () => {
|
||||
formInline.value =''
|
||||
formInline.value = ''
|
||||
}
|
||||
|
||||
|
||||
const multipleTableRef = ref()
|
||||
const multipleSelection = ref<[]>([])
|
||||
const multipleSelectionObj: any = {}
|
||||
|
||||
const handleSelectionChange = (val) => {
|
||||
console.log(val)
|
||||
multipleSelection.value = val
|
||||
console.log(val)
|
||||
multipleSelectionObj[da.deptId] = val
|
||||
multipleSelection.value = uniqBy(Object.values(multipleSelectionObj).flat(), 'userId')
|
||||
}
|
||||
|
||||
const selet = (rows: any) => {
|
||||
multipleTableRef.value!.toggleRowSelection(rows, undefined)
|
||||
// console.log(unref(multipleSelection))
|
||||
multipleTableRef.value!.toggleRowSelection(rows, undefined)
|
||||
// console.log(unref(multipleSelection))
|
||||
}
|
||||
|
||||
const toggleSelection = (Data: any[]) => {
|
||||
// console.log(Data)
|
||||
if (Data) {
|
||||
Data.forEach((row: any) => {
|
||||
multipleTableRef.value!.toggleRowSelection(row, undefined)
|
||||
// console.log(multipleTableRef.value.data)
|
||||
})
|
||||
|
||||
}
|
||||
// console.log(Data)
|
||||
if (Data) {
|
||||
Data.forEach((row: any) => {
|
||||
multipleTableRef.value!.toggleRowSelection(row, undefined)
|
||||
// console.log(multipleTableRef.value.data)
|
||||
})
|
||||
}
|
||||
}
|
||||
const handleClose = (id: any) => {
|
||||
multipleSelection.value.filter(item => {
|
||||
|
||||
if (item.userId === id) {
|
||||
console.log(item.userId,id)
|
||||
multipleTableRef.value!.toggleRowSelection(item, undefined)
|
||||
}
|
||||
})
|
||||
multipleSelection.value = multipleSelection.value.filter((item) => {
|
||||
if (item.userId === id) {
|
||||
console.log(item.userId, id)
|
||||
multipleTableRef.value!.toggleRowSelection(item, undefined)
|
||||
return false
|
||||
}
|
||||
return item
|
||||
})
|
||||
}
|
||||
const showModal = ref()
|
||||
const handleChange = () => {
|
||||
emit('clickChild', { multipleSelection, showModal })
|
||||
emit('clickChild', { multipleSelection, showModal })
|
||||
}
|
||||
const CloseThis=()=>{
|
||||
|
||||
emit('CloseThis',false)
|
||||
const CloseThis = () => {
|
||||
emit('CloseThis', false)
|
||||
}
|
||||
const CloseT = ()=>{
|
||||
showModal2.value = false
|
||||
multipleSelection.value=[]
|
||||
const CloseT = () => {
|
||||
showModal2.value = false
|
||||
multipleSelection.value = []
|
||||
}
|
||||
getTree()
|
||||
|
||||
const asGroup = ref()
|
||||
async function getGroup(){
|
||||
const {data} = await getGroupList()
|
||||
asGroup.value = data
|
||||
async function getGroup() {
|
||||
const { data } = await getGroupList()
|
||||
asGroup.value = data
|
||||
}
|
||||
|
||||
getGroup()
|
||||
|
||||
const asGroupClick = (e: any)=>{
|
||||
multipleSelection.value = e.userList
|
||||
const asGroupClick = (e: any) => {
|
||||
multipleSelection.value = e.userList
|
||||
}
|
||||
const showModal2 =ref(false)
|
||||
const showModal2 = ref(false)
|
||||
const groupName = ref()
|
||||
const groupDeleteId = ref()
|
||||
let id = 0
|
||||
const modfify = (e)=>{
|
||||
console.log(e.id)
|
||||
groupDeleteId.value =e
|
||||
id = e.id
|
||||
showModal2.value = true
|
||||
groupName.value = e.name
|
||||
multipleSelection.value = e.userList
|
||||
const modfify = (e) => {
|
||||
console.log(e.id)
|
||||
groupDeleteId.value = e
|
||||
id = e.id
|
||||
showModal2.value = true
|
||||
groupName.value = e.name
|
||||
multipleSelection.value = e.userList
|
||||
|
||||
e.userList.forEach((row: any) => {
|
||||
multipleTableRef.value!.toggleRowSelection(row, undefined)
|
||||
})
|
||||
|
||||
e.userList.forEach((row: any) => {
|
||||
multipleTableRef.value!.toggleRowSelection(row, undefined)
|
||||
})
|
||||
}
|
||||
const changeGroup=()=>{
|
||||
changSave()
|
||||
const changeGroup = () => {
|
||||
changSave()
|
||||
}
|
||||
watch(FlashOutline, (val) => {
|
||||
treeRef.value!.filter(val)
|
||||
|
|
@ -178,162 +189,200 @@ const filterNode = (value: string, data: Tree) => {
|
|||
return data.label.includes(value)
|
||||
}
|
||||
|
||||
|
||||
|
||||
async function changSave(){
|
||||
let userIdList: any[] = []
|
||||
const name = groupName.value
|
||||
// console.log(multipleSelection.value)
|
||||
multipleSelection.value.forEach((i: { userId: any })=>{
|
||||
userIdList.push(i.userId)
|
||||
})
|
||||
console.log(id, groupName.value,userIdList)
|
||||
// if(!id) return
|
||||
let formdata = new FormData();
|
||||
formdata.append("id",id);
|
||||
formdata.append("name",name);
|
||||
formdata.append("userIdList",userIdList);
|
||||
const {msg} = await addGroup(formdata,{headers: {'Content-Type': 'application/form-data'}})
|
||||
message.success(msg)
|
||||
getGroup()
|
||||
async function changSave() {
|
||||
let userIdList: any[] = []
|
||||
const name = groupName.value
|
||||
// console.log(multipleSelection.value)
|
||||
multipleSelection.value.forEach((i: { userId: any }) => {
|
||||
userIdList.push(i.userId)
|
||||
})
|
||||
console.log(id, groupName.value, userIdList)
|
||||
// if(!id) return
|
||||
let formdata = new FormData()
|
||||
formdata.append('id', id)
|
||||
formdata.append('name', name)
|
||||
formdata.append('userIdList', userIdList)
|
||||
const { msg } = await addGroup(formdata, { headers: { 'Content-Type': 'application/form-data' } })
|
||||
message.success(msg)
|
||||
getGroup()
|
||||
}
|
||||
const addGroupList = () =>{
|
||||
showModal2.value = true
|
||||
const addGroupList = () => {
|
||||
showModal2.value = true
|
||||
}
|
||||
const deleteGroupp =(i: any)=>{
|
||||
console.log(i)
|
||||
deleteGroups(i.id)
|
||||
const deleteGroupp = (i: any) => {
|
||||
console.log(i)
|
||||
deleteGroups(i.id)
|
||||
}
|
||||
async function deleteGroups(id) {
|
||||
if(!id) return
|
||||
const {code} =await deleteGroup({id})
|
||||
getGroup()
|
||||
asGroup.value = []
|
||||
multipleSelection.value=[]
|
||||
groupName.value=''
|
||||
message.info("删除成功")
|
||||
if (!id) return
|
||||
const { code } = await deleteGroup({ id })
|
||||
getGroup()
|
||||
asGroup.value = []
|
||||
multipleSelection.value = []
|
||||
groupName.value = ''
|
||||
message.info('删除成功')
|
||||
}
|
||||
|
||||
function onSelect(params: any) {
|
||||
console.log('🚀 ~ file: UserPages.vue:230 ~ params:', params)
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<div>
|
||||
|
||||
<div class=" max-w95% h800px m-auto bg-#fff rounded-10px overflow-hidden">
|
||||
<div class="pl20px text-18px w100% h60px p15px" style="border-bottom:1px solid #dfdfdf ;font-weight: 700;">
|
||||
调达中心</div>
|
||||
<div class="p20px flex relative">
|
||||
<div class="min-w150px">
|
||||
<el-input v-model="FlashOutline" class="w-50 m-2" placeholder="搜索" suffix-icon="Calendar"
|
||||
:prefix-icon="Search" />
|
||||
<el-tree ref="treeRef" :data="treeData" :filter-node-method="filterNode" :default-expanded-keys="[2, 4]" @node-click="thisClick" class="max-h500px"/>
|
||||
|
||||
|
||||
<ul class="absolute max-h200px min-h100px bottom-0 list-none !p0 overflow-auto w190px" v-if="asGroup">
|
||||
<li v-for="i in asGroup" class="cursor-default w190px h32px" >
|
||||
<span @click="asGroupClick(i)" class="w100px h30px text-12px float-left block border border-solid border-#f5f5f5 leading-30px overflow-hidden" :title="i.name">{{i.name}}</span>
|
||||
<span class="text-12px text-#3E7DF0 leading-30px float-left block w38px text-center block border border-solid border-#f5f5f5 h32px" @click="modfify(i)">编辑</span>
|
||||
<el-icon @click="deleteGroupp(i)" class="mt7px ml5px"><Delete/></el-icon>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="ml20px max-w80%">
|
||||
|
||||
<div v-if="showModal2!=true">
|
||||
<el-form :inline="true" :model="formInline" label-width="80px" size="small"
|
||||
class="demo-form-inline">
|
||||
<el-form-item label="用户名称">
|
||||
<el-input v-model="formInline" placeholder="请输入用户名称" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit" :icon="Search">搜素</el-button>
|
||||
<el-button @click="resetForm()" :icon="Refresh">重置</el-button>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
|
||||
|
||||
</div>
|
||||
<div v-if="showModal2==true" class="w500px">
|
||||
|
||||
<!-- <el-form :inline="true" :model="formInline"
|
||||
class="demo-form-inline"> -->
|
||||
<el-form-item label="分组名称" label-width="80px" size="small">
|
||||
<el-input v-model="groupName" placeholder="请输入分组名称" clearable />
|
||||
</el-form-item>
|
||||
|
||||
|
||||
<!-- </el-form> -->
|
||||
|
||||
</div>
|
||||
<div v-if="showModal2!=true" class="float-left block">
|
||||
<el-button type="warning" size="small" @click="toggleSelection(userData)">@所有人</el-button>
|
||||
<el-button type="primary" color="#00A73A" size="small" @click="addGroupList">新增分组</el-button>
|
||||
</div>
|
||||
<div class="w100% h450px overflow-auto">
|
||||
<el-table ref="multipleTableRef" :data="userData" :header-cell-style="{ 'text-align': 'center' }"
|
||||
height="400" :cell-style="{ 'text-align': 'center' }" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column property="nickName" label="用户名称" width="220" />
|
||||
<el-table-column property="dept.deptName" label="科室" width="180" />
|
||||
<el-table-column property="dept.parentDeptName" label="部门" width="180" />
|
||||
<el-table-column property="positionName" label="职位" width="120" />
|
||||
|
||||
<el-table-column property="name" label="操作" width="220">
|
||||
<template #default="{ row, $index }">
|
||||
<el-button type="primary" size="small" @click="selet(row)">选择</el-button>
|
||||
</template>
|
||||
|
||||
</el-table-column>
|
||||
|
||||
</el-table>
|
||||
|
||||
|
||||
</div>
|
||||
<div class="h80px overflow-y-auto">
|
||||
<div v-if="showModal2===true && groupName" class="mb10px h32px">
|
||||
{{groupName}}：
|
||||
<span class="text-12px text-#959595 w30px" @click="deleteGroupp(groupDeleteId)">删除</span>
|
||||
<!-- <el-icon class="mt8px"><Delete /></el-icon> -->
|
||||
</div>
|
||||
<el-tag v-for="i in multipleSelection" :key="i" class="mx-1" closable :disable-transitions="false"
|
||||
@close="handleClose(i.userId)">
|
||||
{{ i.nickName }}
|
||||
</el-tag>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="w100% text-end float-right block h50px pt10px"
|
||||
style="border-top:1px solid #dfdfdf ;font-weight: 700;">
|
||||
<div class="pr30px" v-if="showModal2!=true">
|
||||
<el-button type="warning" color="#f1f1f1" size="small" @click="CloseThis">取消</el-button>
|
||||
<el-button type="primary" size="small" @click="handleChange">确认</el-button>
|
||||
</div>
|
||||
<div class="pr30px" v-if="showModal2==true">
|
||||
<el-button type="warning" color="#f1f1f1" size="small" @click="CloseT">取消</el-button>
|
||||
<el-button type="primary" size="small" @click="changeGroup">确认修改</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<div class="max-w95% h800px m-auto bg-#fff rounded-10px overflow-hidden">
|
||||
<div
|
||||
class="pl20px text-18px w100% h60px p15px"
|
||||
style="border-bottom: 1px solid #dfdfdf; font-weight: 700"
|
||||
>
|
||||
调达中心
|
||||
</div>
|
||||
<div class="p20px flex relative">
|
||||
<div class="min-w150px">
|
||||
<el-input
|
||||
v-model="FlashOutline"
|
||||
class="w-50 m-2"
|
||||
placeholder="搜索"
|
||||
suffix-icon="Calendar"
|
||||
:prefix-icon="Search"
|
||||
/>
|
||||
<el-tree
|
||||
ref="treeRef"
|
||||
:data="treeData"
|
||||
:filter-node-method="filterNode"
|
||||
:default-expanded-keys="[2, 4]"
|
||||
@node-click="thisClick"
|
||||
class="max-h500px"
|
||||
/>
|
||||
|
||||
<ul
|
||||
class="absolute max-h200px min-h100px bottom-0 list-none !p0 overflow-auto w190px"
|
||||
v-if="asGroup"
|
||||
>
|
||||
<li v-for="i in asGroup" class="cursor-default w190px h32px">
|
||||
<span
|
||||
@click="asGroupClick(i)"
|
||||
class="w100px h30px text-12px float-left block border border-solid border-#f5f5f5 leading-30px overflow-hidden"
|
||||
:title="i.name"
|
||||
>{{ i.name }}</span
|
||||
>
|
||||
<span
|
||||
class="text-12px text-#3E7DF0 leading-30px float-left block w38px text-center block border border-solid border-#f5f5f5 h32px"
|
||||
@click="modfify(i)"
|
||||
>编辑</span
|
||||
>
|
||||
<el-icon @click="deleteGroupp(i)" class="mt7px ml5px"><Delete /></el-icon>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ml20px max-w80%">
|
||||
<div v-if="showModal2 != true">
|
||||
<el-form
|
||||
:inline="true"
|
||||
:model="formInline"
|
||||
label-width="80px"
|
||||
size="small"
|
||||
class="demo-form-inline"
|
||||
>
|
||||
<el-form-item label="用户名称">
|
||||
<el-input v-model="formInline" placeholder="请输入用户名称" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="onSubmit" :icon="Search">搜素</el-button>
|
||||
<el-button @click="resetForm()" :icon="Refresh">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div v-if="showModal2 == true" class="w500px">
|
||||
<!-- <el-form :inline="true" :model="formInline"
|
||||
class="demo-form-inline"> -->
|
||||
<el-form-item label="分组名称" label-width="80px" size="small">
|
||||
<el-input v-model="groupName" placeholder="请输入分组名称" clearable />
|
||||
</el-form-item>
|
||||
|
||||
<!-- </el-form> -->
|
||||
</div>
|
||||
<div v-if="showModal2 != true" class="float-left block">
|
||||
<el-button type="warning" size="small" @click="toggleSelection(userData)"
|
||||
>@所有人</el-button
|
||||
>
|
||||
<el-button type="primary" color="#00A73A" size="small" @click="addGroupList"
|
||||
>新增分组</el-button
|
||||
>
|
||||
</div>
|
||||
<div class="w100% h450px overflow-auto">
|
||||
<el-table
|
||||
ref="multipleTableRef"
|
||||
:data="userData"
|
||||
:header-cell-style="{ 'text-align': 'center' }"
|
||||
height="400"
|
||||
:cell-style="{ 'text-align': 'center' }"
|
||||
@selection-change="handleSelectionChange"
|
||||
@select="onSelect"
|
||||
>
|
||||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column property="nickName" label="用户名称" width="220" />
|
||||
<el-table-column property="dept.deptName" label="科室" width="180" />
|
||||
<el-table-column property="dept.parentDeptName" label="部门" width="180" />
|
||||
<el-table-column property="positionName" label="职位" width="120" />
|
||||
|
||||
<el-table-column property="name" label="操作" width="220">
|
||||
<template #default="{ row, $index }">
|
||||
<el-button type="primary" size="small" @click="selet(row)">选择</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="h80px overflow-y-auto">
|
||||
<div v-if="showModal2 === true && groupName" class="mb10px h32px">
|
||||
{{ groupName }}：
|
||||
<span class="text-12px text-#959595 w30px" @click="deleteGroupp(groupDeleteId)"
|
||||
>删除</span
|
||||
>
|
||||
<!-- <el-icon class="mt8px"><Delete /></el-icon> -->
|
||||
</div>
|
||||
<el-tag
|
||||
v-for="i in multipleSelection"
|
||||
:key="i"
|
||||
class="mx-1"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleClose(i.userId)"
|
||||
>
|
||||
{{ i.nickName }}
|
||||
</el-tag>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="w100% text-end float-right block h50px pt10px"
|
||||
style="border-top: 1px solid #dfdfdf; font-weight: 700"
|
||||
>
|
||||
<div class="pr30px" v-if="showModal2 != true">
|
||||
<el-button type="warning" color="#f1f1f1" size="small" @click="CloseThis">取消</el-button>
|
||||
<el-button type="primary" size="small" @click="handleChange">确认</el-button>
|
||||
</div>
|
||||
<div class="pr30px" v-if="showModal2 == true">
|
||||
<el-button type="warning" color="#f1f1f1" size="small" @click="CloseT">取消</el-button>
|
||||
<el-button type="primary" size="small" @click="changeGroup">确认修改</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<style lang="less">
|
||||
.el-form--inline .el-input {
|
||||
width: 180px !important;
|
||||
width: 180px !important;
|
||||
}
|
||||
::-webkit-scrollbar{
|
||||
width: 1px;
|
||||
::-webkit-scrollbar {
|
||||
width: 1px;
|
||||
}
|
||||
.thList {
|
||||
td {
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
td {
|
||||
border-bottom: 1px solid #f5f5f5;
|
||||
line-height: 40px;
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ import AppBlock from '@/components/AppBlock.vue'
|
|||
import AppNewsBox from '@/components/AppNewsBox.vue'
|
||||
// import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
|
||||
import { useDate } from '@/views/home/hooks/useDate'
|
||||
import zhCn from "element-plus/lib/locale/lang/zh-cn";
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
import { getList ,marketPreADD,getMarketUser,saveMarketUser,MarketDownload,MarketPreview,getCurrencyList,getMetalList} from '@/api/daikin/base'
|
||||
import { NModal,NCard } from 'naive-ui'
|
||||
import {formatDate} from '@/utils/format'
|
||||
|
|
|
|||
|
|
@ -0,0 +1,293 @@
|
|||
<script setup lang="ts">
|
||||
import { useUserStore } from '@/stores/modules/user'
|
||||
import HomeHead from '@/views/home/components/HomeHead.vue'
|
||||
// import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
|
||||
import { useDate } from '@/views/home/hooks/useDate'
|
||||
import { getArticlePage, getSearchGlobal, newDataList } from '@/api/daikin/base'
|
||||
import { noticeld } from '@/stores/modules/noticeId'
|
||||
import { searchStore } from '@/stores/modules/search'
|
||||
import { message } from '@/utils/message'
|
||||
import dayjs from 'dayjs'
|
||||
|
||||
const searchS = searchStore()
|
||||
const { day, week } = useDate()
|
||||
const { push } = useRouter()
|
||||
const route = useRoute()
|
||||
|
||||
const listData = ref()
|
||||
const flg = ref()
|
||||
let keywords = ref()
|
||||
const pageInfo = reactive({
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
})
|
||||
// App_Article 外部情报模块，App_Market 市况汇率，App_data_platform 数据平台, App_BCP BCP模块, App_CSR 碳中和模块,App_Quality 品质模块,App_Lab Lab模块,App_Database DatabBase模块
|
||||
const codeType = {
|
||||
App_Article: '外部情报', //分内部情报 和 外部情报
|
||||
App_Market: '市况汇率', //返回下文件大小 fileCommon.fileSize
|
||||
App_data_platform: '数据平台', //返回文件大小 fileCommon.fileSize
|
||||
App_BCP: 'BCP模块', //返回文件大小 fileCommon.fileSize
|
||||
App_CSR: '碳中和模块', //返回文件大小 fileCommon.fileSize
|
||||
App_Quality: '品质模块', //返回文件大小 fileCommon.fileSize
|
||||
App_Lab: 'Lab模块', //返回文件大小 fileCommon.fileSize
|
||||
App_Database: 'DatabBase模块', //返回文件大小 fileCommon.fileSize
|
||||
App_News: '新闻模块'
|
||||
}
|
||||
const loading = ref(true)
|
||||
async function getSearchList() {
|
||||
loading.value = true
|
||||
const keyword = searchS.search.content
|
||||
// const { rows } = await getArticlePage({ pageNum: 1, pageSize: 100, type: 2, position: 'search', keyword } as any);
|
||||
const { rows, total } = await getSearchGlobal({
|
||||
pageNum: pageInfo.currentPage,
|
||||
pageSize: pageInfo.pageSize,
|
||||
keyword
|
||||
} as any).catch((e) => {
|
||||
loading.value = false
|
||||
listData.value = []
|
||||
})
|
||||
listData.value = rows
|
||||
setTimeout(() => {
|
||||
loading.value = false
|
||||
}, 300)
|
||||
pageInfo.total = total
|
||||
}
|
||||
|
||||
const newsData = ref<any>()
|
||||
const fetchNewDataList = async () => {
|
||||
const res = await newDataList({ pageNum: pageInfo.currentPage, pageSize: pageInfo.pageSize })
|
||||
pageInfo.total = res.total
|
||||
const data = groupDatesByWeek(res.rows || [])
|
||||
newsData.value = data
|
||||
}
|
||||
fetchNewDataList()
|
||||
|
||||
const num = ['', '第一周', '第二周', '第三周', '第四周', '第五周']
|
||||
// 将日期按照周分组
|
||||
function groupDatesByWeek(dates = [], weekStartDay = 1) {
|
||||
return dates.reduce((acc: any, item: any) => {
|
||||
const date = dayjs(item.createTime)
|
||||
const weekStart = date.startOf('week').add(weekStartDay, 'day').format('MM月DD日')
|
||||
item.date = date.format('YYYY-MM-DD')
|
||||
const weekEnd = date.endOf('week').add(weekStartDay, 'day').format('MM月DD日')
|
||||
const week = getWeekOfMonth(date)
|
||||
const month = date.format('MM')
|
||||
const key = `${+month}月 ${num[week]} （ ${weekStart} - ${weekEnd} ）`
|
||||
acc[key] = acc[key] || []
|
||||
acc[key].push(item)
|
||||
return acc
|
||||
}, {})
|
||||
}
|
||||
|
||||
function getWeekOfMonth(date) {
|
||||
const startOfMonth = date.startOf('month')
|
||||
const diff = date.diff(startOfMonth, 'day')
|
||||
return Math.ceil((diff + startOfMonth.day()) / 7)
|
||||
}
|
||||
// watchEffect(() => {
|
||||
// searchS.search.time
|
||||
// getSearchList(searchS.search.content)
|
||||
// })
|
||||
|
||||
const codePath = {
|
||||
App_Article: {
|
||||
path: '/intelligence/outside/',
|
||||
modulePath: '/Home/intelligence'
|
||||
},
|
||||
App_Market: {
|
||||
path: '/Home/market/',
|
||||
modulePath: '/Home/market'
|
||||
},
|
||||
App_data_platform: {
|
||||
path: '/Home/cd/',
|
||||
modulePath: '/Home/cd'
|
||||
},
|
||||
App_BCP: {
|
||||
path: '/Home/bcp/',
|
||||
modulePath: '/Home/bcp/'
|
||||
},
|
||||
// '碳中和模块',
|
||||
App_CSR: {
|
||||
path: '/Home/csr/',
|
||||
modulePath: '/Home/csr/'
|
||||
},
|
||||
// '品质模块',
|
||||
App_Quality: {
|
||||
path: '/Home/quality/',
|
||||
modulePath: '/Home/quality/'
|
||||
},
|
||||
// 'Lab模块',
|
||||
App_Lab: {
|
||||
path: '/Home/diffspace/',
|
||||
modulePath: '/Home/diffspace'
|
||||
},
|
||||
// 'DatabBase模块'
|
||||
App_Database: {
|
||||
path: '/DataBase?id=',
|
||||
modulePath: '/DataBase'
|
||||
}
|
||||
}
|
||||
|
||||
const goModule = (item, type) => {
|
||||
const { moduleCode, id, cateId } = item
|
||||
const { modulePath, path } = codePath[moduleCode]
|
||||
console.log('🚀 ~ file: News.vue:128 ~ modulePath, path:', modulePath, path)
|
||||
if (modulePath) {
|
||||
if (type === 'module') {
|
||||
push(modulePath)
|
||||
} else {
|
||||
push(path + (moduleCode === 'App_Database' ? cateId : id))
|
||||
}
|
||||
}
|
||||
}
|
||||
const clickItem = (item: any) => {
|
||||
const { id, filePath, isSelect, moduleCode, fileCommon = {} } = item
|
||||
if (isSelect == 1) {
|
||||
if (item.moduleCode === 'App_Article') {
|
||||
return push('/Home/intelligence/' + item.id)
|
||||
}
|
||||
if (['App_Database'].includes(moduleCode)) {
|
||||
goModule(item, 'path')
|
||||
} else {
|
||||
downloads({ fileCommon, filePath })
|
||||
}
|
||||
} else {
|
||||
message.info('您没有权限查看！')
|
||||
}
|
||||
}
|
||||
|
||||
const downloads = (data: any = {}) => {
|
||||
const { fileCommon, filePath } = data
|
||||
if ((fileCommon?.fileSize || 0) > 25 * 1024 * 1024) {
|
||||
message.info('正在下载中，请稍等～')
|
||||
downloadFile(filePath)
|
||||
return
|
||||
}
|
||||
if (filePath) {
|
||||
window.open(filePath, '_blank')
|
||||
} else {
|
||||
message.info('没有可预览文件！')
|
||||
}
|
||||
}
|
||||
function downloadFile(url: any) {
|
||||
fetch(url)
|
||||
.then((response) => response.blob())
|
||||
.then((blob) => {
|
||||
const downloadUrl = URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = downloadUrl
|
||||
link.download = getFileNameFromUrl(url)
|
||||
link.click()
|
||||
})
|
||||
}
|
||||
function getFileNameFromUrl(url: string) {
|
||||
const lastSlashIndex = url.lastIndexOf('/')
|
||||
if (lastSlashIndex !== -1) {
|
||||
return url.substring(lastSlashIndex + 1)
|
||||
} else {
|
||||
return 'Invalid URL'
|
||||
}
|
||||
}
|
||||
|
||||
const handleSizeChange = (e) => {
|
||||
pageInfo.pageSize = e
|
||||
pageInfo.currentPage = 1
|
||||
// getSearchList()
|
||||
fetchNewDataList()
|
||||
}
|
||||
|
||||
// const handleCurrentChange = (e) => {
|
||||
// pageInfo.currentPage = e
|
||||
// getSearchList()
|
||||
// }
|
||||
const fileSize = 24 * 1024 * 1024
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<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 class="q-wrapper flex-1 mt30px text-#142142 flex flex-col bg-#fff p30px">
|
||||
<div class="h-800px mt-0px relative" v-if="newsData">
|
||||
<div class="h-710px overflow-y-scroll">
|
||||
<div v-for="(val, key) of newsData" :key="key" class="w-94% mb-20px flex-1">
|
||||
<div class="text-#142142 text-20px font-bold mb20px mt40px">
|
||||
{{ key }}
|
||||
</div>
|
||||
<div v-for="(i, k) in val" :key="k" class="mb-20px flex items-center w-full">
|
||||
<div
|
||||
@click="clickItem(i)"
|
||||
class="w-[40%] no-underline truncate text-18px text-#142142 cursor-pointer hover:underline h-16px leading-16px"
|
||||
>
|
||||
{{ i.title || '' }}
|
||||
</div>
|
||||
<div class="text-#808696 text-16px ml30px flex flex-1 items-center justify-between">
|
||||
<div class="flex-1">发布科室: {{ i.departName }}</div>
|
||||
<div class="w-[36%]">发布人: {{ i.userName }}</div>
|
||||
<div class="w-[20%]">{{ i.createTime?.slice(0, 10) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="absolute bottom-0px left-50% translate-x-[-50%] z-11">
|
||||
<el-pagination
|
||||
background
|
||||
v-model:current-page="pageInfo.currentPage"
|
||||
v-model:page-size="pageInfo.pageSize"
|
||||
layout="prev, pager, next, total,jumper,->"
|
||||
:total="pageInfo.total"
|
||||
@current-change="fetchNewDataList"
|
||||
/>
|
||||
<!-- @size-change="handleSizeChange" -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
:deep(.el-empty__description) {
|
||||
p {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
.top {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.q-wrapper {
|
||||
border-radius: 18px;
|
||||
border: 1px solid #e7ebf5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: auto;
|
||||
&::after {
|
||||
content: ' ';
|
||||
background-image: url('@/assets/images/bg-card.svg');
|
||||
pointer-events: none;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 127px;
|
||||
background-repeat: no-repeat; /* 阻止图片平铺 */
|
||||
background-position: right top;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -8,49 +8,53 @@ import { useDate } from '@/views/home/hooks/useDate'
|
|||
const { day, week } = useDate()
|
||||
const { push } = useRouter()
|
||||
const array = ref<any[]>([
|
||||
{
|
||||
content1: '将扩大的机遇转为成果 更强更大地展翅飞翔',
|
||||
content2: 'ひろがるチャンスを 成果につなげ 強く大きく 羽ばたこう',
|
||||
year: '2023年'
|
||||
},
|
||||
{ content1: '领先时代的变化 开创崭新的未来', content2: '', year: '2022年' },
|
||||
{
|
||||
content1: '以“重大变化”为契机 向新课题发起挑战',
|
||||
content2: '',
|
||||
year: '2021年'
|
||||
},
|
||||
{
|
||||
content1: '加速推进三个协创 决胜于变化的时代',
|
||||
content2: '',
|
||||
year: '2020年'
|
||||
},
|
||||
{
|
||||
content1: '以三个协创为轴心 人人迅速果断行动',
|
||||
content2: '',
|
||||
year: '2016年'
|
||||
},
|
||||
{
|
||||
content1: '突破壁垒 集中优势 不断挑战新课题',
|
||||
content2: '',
|
||||
year: '2018年'
|
||||
},
|
||||
{
|
||||
content1: '坚持以人为轴心，融合新的力量',
|
||||
content2: '集团上下齐心协力提升企业价值',
|
||||
year: '2017年'
|
||||
},
|
||||
{ content1: '站稳脚跟 强化优势 大步迈进', content2: '', year: '2016年' },
|
||||
{ content1: '创造未来，决胜于变化的时代', content2: '', year: '2015年' }
|
||||
{
|
||||
content1: '将扩大的机遇转为成果 更强更大地展翅飞翔',
|
||||
content2: 'ひろがるチャンスを 成果につなげ 強く大きく 羽ばたこう',
|
||||
year: '2023年'
|
||||
},
|
||||
{ content1: '领先时代的变化 开创崭新的未来', content2: '', year: '2022年' },
|
||||
{
|
||||
content1: '以“重大变化”为契机 向新课题发起挑战',
|
||||
content2: '',
|
||||
year: '2021年'
|
||||
},
|
||||
{
|
||||
content1: '加速推进三个协创 决胜于变化的时代',
|
||||
content2: '',
|
||||
year: '2020年'
|
||||
},
|
||||
{
|
||||
content1: '以三个协创为轴心 人人迅速果断行动',
|
||||
content2: '',
|
||||
year: '2016年'
|
||||
},
|
||||
{
|
||||
content1: '突破壁垒 集中优势 不断挑战新课题',
|
||||
content2: '',
|
||||
year: '2018年'
|
||||
},
|
||||
{
|
||||
content1: '坚持以人为轴心，融合新的力量',
|
||||
content2: '集团上下齐心协力提升企业价值',
|
||||
year: '2017年'
|
||||
},
|
||||
{ content1: '站稳脚跟 强化优势 大步迈进', content2: '', year: '2016年' },
|
||||
{ content1: '创造未来，决胜于变化的时代', content2: '', year: '2015年' }
|
||||
])
|
||||
let flag = ref(false)
|
||||
const switchImg = () => {
|
||||
flag.value = !flag.value
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<HomeHead class="top">
|
||||
<template #content>
|
||||
<!-- <HomeHeadSearch /> -->
|
||||
</template>
|
||||
</HomeHead>
|
||||
<!-- <div class="h-full relative flex flex-col">
|
||||
<HomeHead class="top">
|
||||
<template #content>
|
||||
<!-- <HomeHeadSearch /> -->
|
||||
</template>
|
||||
</HomeHead>
|
||||
<!-- <div class="h-full relative flex flex-col">
|
||||
<div class="font-600 flex items-end mt27px">
|
||||
<div class="text-36px">集团方针</div>
|
||||
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
||||
|
|
@ -70,41 +74,55 @@ const array = ref<any[]>([
|
|||
</div>
|
||||
</div>
|
||||
</div> -->
|
||||
<div class="mt30px mr20px flex w100%">
|
||||
<img src="../../../assets/images/fzqiet3.png" class="w100%" />
|
||||
</div>
|
||||
<div class="mt30px mr20px flex w100% relative overflow-hidden">
|
||||
<!-- <img src="../../../assets/images/fzqiet3.png" class="w100%" /> -->
|
||||
<img
|
||||
src="../../../assets/images/jjllt.jpg"
|
||||
class="w100% transition-all duration-500"
|
||||
:class="flag ? '-translate-x-full' : ''"
|
||||
/>
|
||||
<img
|
||||
src="../../../assets/images/jjllt-right.jpg"
|
||||
class="w100% transition-all duration-500"
|
||||
:class="flag ? '-translate-x-full' : ''"
|
||||
/>
|
||||
<div
|
||||
@click="switchImg"
|
||||
class="absolute top-56px right-40px w-300px h50px z-10 cursor-pointer"
|
||||
></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.top {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
}
|
||||
|
||||
.g-wrapper {
|
||||
border-radius: 18px;
|
||||
border: 1px solid #e7ebf5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: hidden;
|
||||
border-radius: 18px;
|
||||
border: 1px solid #e7ebf5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: hidden;
|
||||
|
||||
.timeline {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #142142;
|
||||
.timeline {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #142142;
|
||||
|
||||
.one {
|
||||
position: relative;
|
||||
.year {
|
||||
left: -132px;
|
||||
top: -14px;
|
||||
color: #003cb7;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.one {
|
||||
position: relative;
|
||||
.year {
|
||||
left: -132px;
|
||||
top: -14px;
|
||||
color: #003cb7;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -3,76 +3,74 @@
|
|||
import HomeHead from '@/views/home/components/HomeHead.vue'
|
||||
// import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
|
||||
import { useDate } from '@/views/home/hooks/useDate'
|
||||
import {NForm,NFormItem,NInput,NModal,NButton,useMessage} from 'naive-ui'
|
||||
import zhCn from "element-plus/lib/locale/lang/zh-cn";
|
||||
import { NForm, NFormItem, NInput, NModal, NButton, useMessage } from 'naive-ui'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
import UserPage from '@/views/home/intelligence/process/UserPages.vue'
|
||||
import Editor from '@/views/home/intelligence/components/TinyECE.vue'
|
||||
import {addPageInv} from '@/api/daikin/base'
|
||||
import { addPageInv } from '@/api/daikin/base'
|
||||
const message = useMessage()
|
||||
const { day, week } = useDate()
|
||||
const { push } = useRouter()
|
||||
|
||||
let rules = {
|
||||
title: {
|
||||
required: false,
|
||||
message: '请输入标题',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actName:{
|
||||
required: false,
|
||||
message: '请输入名称',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actSTime: {
|
||||
required: false,
|
||||
message: '请选择开始',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actETime: {
|
||||
required: false,
|
||||
message: '请选择结束',
|
||||
trigger: 'blur'
|
||||
},
|
||||
position:{
|
||||
required: false,
|
||||
message: '请输入职务',
|
||||
trigger: 'blur'
|
||||
},
|
||||
|
||||
title: {
|
||||
required: false,
|
||||
message: '请输入标题',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actName: {
|
||||
required: false,
|
||||
message: '请输入名称',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actSTime: {
|
||||
required: false,
|
||||
message: '请选择开始',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actETime: {
|
||||
required: false,
|
||||
message: '请选择结束',
|
||||
trigger: 'blur'
|
||||
},
|
||||
position: {
|
||||
required: false,
|
||||
message: '请输入职务',
|
||||
trigger: 'blur'
|
||||
}
|
||||
}
|
||||
const showModals =ref(false)
|
||||
const showModals = ref(false)
|
||||
const showModal = ref(false)
|
||||
const dataList = ref()
|
||||
const handleChild = (data)=>{
|
||||
const { showModal: show, multipleSelection } = data
|
||||
showModal.value = unref(show)
|
||||
dataList.value = unref(multipleSelection)
|
||||
const handleChild = (data) => {
|
||||
const { showModal: show, multipleSelection } = data
|
||||
showModal.value = unref(show)
|
||||
dataList.value = unref(multipleSelection)
|
||||
}
|
||||
const CloseThis = (data)=>{
|
||||
showModal.value = data
|
||||
const CloseThis = (data) => {
|
||||
showModal.value = data
|
||||
}
|
||||
|
||||
const handleClose = (tag: any) => {
|
||||
|
||||
dataList.value.splice(dataList.value.indexOf(tag), 1)
|
||||
console.log( dataList.value)
|
||||
dataList.value.splice(dataList.value.indexOf(tag), 1)
|
||||
console.log(dataList.value)
|
||||
}
|
||||
|
||||
const formValue = ref({
|
||||
title:'',
|
||||
content:'',
|
||||
actName:'',
|
||||
actSTime:'',
|
||||
actETime:'',
|
||||
position:'',
|
||||
userIdList:[],
|
||||
title: '',
|
||||
content: '',
|
||||
actName: '',
|
||||
actSTime: '',
|
||||
actETime: '',
|
||||
position: '',
|
||||
userIdList: []
|
||||
})
|
||||
|
||||
const editorContent =ref()
|
||||
const editorContent = ref()
|
||||
function escapeHTML(html: string): string {
|
||||
const tempElement = document.createElement('div');
|
||||
tempElement.textContent = html;
|
||||
return tempElement.innerHTML;
|
||||
const tempElement = document.createElement('div')
|
||||
tempElement.textContent = html
|
||||
return tempElement.innerHTML
|
||||
}
|
||||
// 获取子组件传过来的值
|
||||
const handleChild2 = (data: string) => {
|
||||
|
|
@ -80,152 +78,184 @@ const handleChild2 = (data: string) => {
|
|||
}
|
||||
|
||||
async function sure() {
|
||||
const cont = editorContent.value
|
||||
const content = escapeHTML(cont)
|
||||
const {title, actName, actSTime, actETime,position } = formValue.value
|
||||
const cont = editorContent.value
|
||||
const content = escapeHTML(cont)
|
||||
const { title, actName, actSTime, actETime, position } = formValue.value
|
||||
|
||||
|
||||
const starTime = new Date(actSTime).getTime()
|
||||
const endTime = new Date(actETime).getTime()
|
||||
console.log(starTime,endTime)
|
||||
let userIdList: any[] =[]
|
||||
if(!dataList.value){
|
||||
message.success("请选择要提醒的对象")
|
||||
return
|
||||
}
|
||||
dataList.value.forEach((i: { userId: any })=>{
|
||||
userIdList.push(i.userId)
|
||||
})
|
||||
console.log(formValue.value,dataList,content)
|
||||
if(userIdList.length<0) return
|
||||
let formdata = new FormData();
|
||||
formdata.append("title",title);
|
||||
formdata.append("actName",actName);
|
||||
formdata.append("actSTime",starTime);
|
||||
formdata.append("actETime",endTime);
|
||||
formdata.append("content",content);
|
||||
formdata.append("position",position);
|
||||
formdata.append("userIdList",userIdList);
|
||||
const { msg, code } = await addPageInv(formdata,{headers: {'Content-Type': 'application/form-data'}})
|
||||
if (code === 200) {
|
||||
message.success("添加成功")
|
||||
}
|
||||
else { message.success(msg); }
|
||||
const starTime = new Date(actSTime).getTime()
|
||||
const endTime = new Date(actETime).getTime()
|
||||
console.log(starTime, endTime)
|
||||
let userIdList: any[] = []
|
||||
if (!dataList.value) {
|
||||
message.success('请选择要提醒的对象')
|
||||
return
|
||||
}
|
||||
dataList.value.forEach((i: { userId: any }) => {
|
||||
userIdList.push(i.userId)
|
||||
})
|
||||
console.log(formValue.value, dataList, content)
|
||||
if (userIdList.length < 0) return
|
||||
let formdata = new FormData()
|
||||
formdata.append('title', title)
|
||||
formdata.append('actName', actName)
|
||||
formdata.append('actSTime', starTime)
|
||||
formdata.append('actETime', endTime)
|
||||
formdata.append('content', content)
|
||||
formdata.append('position', position)
|
||||
formdata.append('userIdList', userIdList)
|
||||
const { msg, code } = await addPageInv(formdata, {
|
||||
headers: { 'Content-Type': 'application/form-data' }
|
||||
})
|
||||
if (code === 200) {
|
||||
message.success('添加成功')
|
||||
} else {
|
||||
message.success(msg)
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<HomeHead class="top">
|
||||
<template #content>
|
||||
<!-- <HomeHeadSearch /> -->
|
||||
</template>
|
||||
</HomeHead>
|
||||
<div class="h-full relative flex flex-col">
|
||||
<div class="font-600 flex items-end mt27px">
|
||||
<div class="text-36px">邀请</div>
|
||||
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
||||
<div class="text-18px">{{ week }}</div>
|
||||
</div>
|
||||
<div class="g-wrapper flex-1 mt30px p30px">
|
||||
<n-form ref="formRef" :label-width="300" :model="formValue" :rules="rules" size="medium"
|
||||
require-mark-placement="left">
|
||||
<n-form-item label="标题" path="title">
|
||||
<n-input v-model:value="formValue.title" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="活动名称" path="actName">
|
||||
<n-input v-model:value="formValue.actName" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="职位" path="position">
|
||||
<n-input v-model:value="formValue.position" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="开始时间" path="actSTime">
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker v-model="formValue.actSTime" type="datetime" placeholder="请选择时间" format="YYYY/MM/DD HH:mm:ss"/>
|
||||
</el-config-provider>
|
||||
</n-form-item>
|
||||
<n-form-item label="结束时间" path="actETime">
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker v-model="formValue.actETime" type="datetime" placeholder="请选择时间" format="YYYY/MM/DD HH:mm:ss"/>
|
||||
</el-config-provider>
|
||||
</n-form-item>
|
||||
<n-form-item label="内容" path="content" class="text-#000">
|
||||
<Editor @getChildData="handleChild2"></Editor>
|
||||
</n-form-item>
|
||||
|
||||
</n-form>
|
||||
|
||||
<n-form-item>
|
||||
<div>
|
||||
<n-button @click="showModals = true"> 文本内容预览</n-button>
|
||||
</div>
|
||||
</n-form-item>
|
||||
<n-button @click="showModal = true">
|
||||
情报公开范围
|
||||
</n-button>
|
||||
<div class="mt15px h100px overflow-y-auto">
|
||||
<el-tag v-for="i in dataList" :key="i" class="mx-1" closable :disable-transitions="false"
|
||||
@close="handleClose(i)" type="info" size="large">
|
||||
{{ i.nickName }}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
<n-button attr-type="button" @click="sure" style="background-color: #3870E5; border-radius: 5px; color: #fff;margin-left: 10px;margin-top: 20px; padding: 0 20px;">
|
||||
提交
|
||||
</n-button>
|
||||
</div>
|
||||
|
||||
<HomeHead class="top">
|
||||
<template #content>
|
||||
<!-- <HomeHeadSearch /> -->
|
||||
</template>
|
||||
</HomeHead>
|
||||
<div class="h-full relative flex flex-col">
|
||||
<div class="font-600 flex items-end mt27px">
|
||||
<div class="text-36px">邀请</div>
|
||||
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
||||
<div class="text-18px">{{ week }}</div>
|
||||
</div>
|
||||
<n-modal v-model:show="showModal">
|
||||
<UserPage @clickChild="handleChild" @CloseThis="CloseThis"></UserPage>
|
||||
</n-modal>
|
||||
<n-modal v-model:show="showModals">
|
||||
<div class=" flex w80% p30px bg-#fff my40px rounded-30px">
|
||||
<div class="g-wrapper flex-1 mt30px p30px">
|
||||
<n-form
|
||||
ref="formRef"
|
||||
:label-width="300"
|
||||
:model="formValue"
|
||||
:rules="rules"
|
||||
size="medium"
|
||||
require-mark-placement="left"
|
||||
>
|
||||
<n-form-item label="标题" path="title">
|
||||
<n-input v-model:value="formValue.title" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="活动名称" path="actName">
|
||||
<n-input v-model:value="formValue.actName" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="职位" path="position">
|
||||
<n-input v-model:value="formValue.position" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="开始时间" path="actSTime">
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker
|
||||
v-model="formValue.actSTime"
|
||||
type="datetime"
|
||||
placeholder="请选择时间"
|
||||
format="YYYY/MM/DD HH:mm:ss"
|
||||
/>
|
||||
</el-config-provider>
|
||||
</n-form-item>
|
||||
<n-form-item label="结束时间" path="actETime">
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker
|
||||
v-model="formValue.actETime"
|
||||
type="datetime"
|
||||
placeholder="请选择时间"
|
||||
format="YYYY/MM/DD HH:mm:ss"
|
||||
/>
|
||||
</el-config-provider>
|
||||
</n-form-item>
|
||||
<n-form-item label="内容" path="content" class="text-#000">
|
||||
<Editor @getChildData="handleChild2"></Editor>
|
||||
</n-form-item>
|
||||
</n-form>
|
||||
|
||||
<div class=" overflow-y-auto h800px container" v-html="editorContent"></div>
|
||||
</div>
|
||||
</n-modal>
|
||||
<n-form-item>
|
||||
<div>
|
||||
<n-button @click="showModals = true"> 文本内容预览</n-button>
|
||||
</div>
|
||||
</n-form-item>
|
||||
<n-button @click="showModal = true"> 情报公开范围 </n-button>
|
||||
<div class="mt15px h100px overflow-y-auto">
|
||||
<el-tag
|
||||
v-for="i in dataList"
|
||||
:key="i"
|
||||
class="mx-1"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleClose(i)"
|
||||
type="info"
|
||||
size="large"
|
||||
>
|
||||
{{ i.nickName }}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="absolute flex flex-col w-full h-full z-200 top-0 left-0 text-center bg-red justify-center items-center" style="background-color: rgba(255,255,255,0.8);">
|
||||
<img src="@/assets/images/chah.png"/>
|
||||
<br>
|
||||
<div class="text-#5683DB text-36px">【做成中,敬请期待】</div>
|
||||
<n-button
|
||||
attr-type="button"
|
||||
@click="sure"
|
||||
style="
|
||||
background-color: #3870e5;
|
||||
border-radius: 5px;
|
||||
color: #fff;
|
||||
margin-left: 10px;
|
||||
margin-top: 20px;
|
||||
padding: 0 20px;
|
||||
"
|
||||
>
|
||||
提交
|
||||
</n-button>
|
||||
</div>
|
||||
</div>
|
||||
<n-modal v-model:show="showModal">
|
||||
<UserPage @clickChild="handleChild" @CloseThis="CloseThis"></UserPage>
|
||||
</n-modal>
|
||||
<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
|
||||
class="absolute flex flex-col w-full h-full z-200 top-0 left-0 text-center bg-red justify-center items-center"
|
||||
style="background-color: rgba(255, 255, 255, 0.8)"
|
||||
>
|
||||
<img src="@/assets/images/chah.png" />
|
||||
<br />
|
||||
<div class="text-#5683DB text-36px">【做成中,敬请期待】</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
|
||||
.top {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
}
|
||||
|
||||
.g-wrapper {
|
||||
border-radius: 18px;
|
||||
border: 1px solid #E7EBF5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: auto;
|
||||
height: 800px;
|
||||
background-color: #fff;
|
||||
.timeline {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #142142;
|
||||
border-radius: 18px;
|
||||
border: 1px solid #e7ebf5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: auto;
|
||||
height: 800px;
|
||||
background-color: #fff;
|
||||
.timeline {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #142142;
|
||||
|
||||
.one {
|
||||
position: relative;
|
||||
.year{
|
||||
left: -132px;
|
||||
top: -14px;
|
||||
color: #003CB7;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
.one {
|
||||
position: relative;
|
||||
.year {
|
||||
left: -132px;
|
||||
top: -14px;
|
||||
color: #003cb7;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -3,233 +3,259 @@
|
|||
import HomeHead from '@/views/home/components/HomeHead.vue'
|
||||
// import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
|
||||
import { useDate } from '@/views/home/hooks/useDate'
|
||||
import {NForm,NFormItem,NInput,NModal,NButton,useMessage} from 'naive-ui'
|
||||
import zhCn from "element-plus/lib/locale/lang/zh-cn";
|
||||
import { NForm, NFormItem, NInput, NModal, NButton, useMessage } from 'naive-ui'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
import UserPage from '@/views/home/intelligence/process/UserPages.vue'
|
||||
import Editor from '@/views/home/intelligence/components/TinyECE.vue'
|
||||
import {addPageVisit} from '@/api/daikin/base'
|
||||
import { addPageVisit } from '@/api/daikin/base'
|
||||
const message = useMessage()
|
||||
const { day, week } = useDate()
|
||||
const { push } = useRouter()
|
||||
|
||||
let rules = {
|
||||
title: {
|
||||
required: false,
|
||||
message: '请输入标题',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actName:{
|
||||
required: false,
|
||||
message: '请输入名称',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actSTime: {
|
||||
required: false,
|
||||
message: '请选择开始',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actETime: {
|
||||
required: false,
|
||||
message: '请选择结束',
|
||||
trigger: 'blur'
|
||||
},
|
||||
position:{
|
||||
required: false,
|
||||
message: '请输入职务',
|
||||
trigger: 'blur'
|
||||
},
|
||||
|
||||
title: {
|
||||
required: false,
|
||||
message: '请输入标题',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actName: {
|
||||
required: false,
|
||||
message: '请输入名称',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actSTime: {
|
||||
required: false,
|
||||
message: '请选择开始',
|
||||
trigger: 'blur'
|
||||
},
|
||||
actETime: {
|
||||
required: false,
|
||||
message: '请选择结束',
|
||||
trigger: 'blur'
|
||||
},
|
||||
position: {
|
||||
required: false,
|
||||
message: '请输入职务',
|
||||
trigger: 'blur'
|
||||
}
|
||||
}
|
||||
const showModal = ref(false)
|
||||
const dataList = ref()
|
||||
const handleChild = (data)=>{
|
||||
const { showModal: show, multipleSelection } = data
|
||||
showModal.value = unref(show)
|
||||
dataList.value = unref(multipleSelection)
|
||||
const handleChild = (data) => {
|
||||
const { showModal: show, multipleSelection } = data
|
||||
showModal.value = unref(show)
|
||||
dataList.value = unref(multipleSelection)
|
||||
}
|
||||
const CloseThis = (data)=>{
|
||||
showModal.value = data
|
||||
const CloseThis = (data) => {
|
||||
showModal.value = data
|
||||
}
|
||||
|
||||
const handleClose = (tag: any) => {
|
||||
|
||||
dataList.value.splice(dataList.value.indexOf(tag), 1)
|
||||
console.log( dataList.value)
|
||||
dataList.value.splice(dataList.value.indexOf(tag), 1)
|
||||
console.log(dataList.value)
|
||||
}
|
||||
|
||||
const formValue = ref({
|
||||
title:'',
|
||||
content:'',
|
||||
actName:'',
|
||||
actSTime:'',
|
||||
actETime:'',
|
||||
position:'',
|
||||
userIdList:[],
|
||||
title: '',
|
||||
content: '',
|
||||
actName: '',
|
||||
actSTime: '',
|
||||
actETime: '',
|
||||
position: '',
|
||||
userIdList: []
|
||||
})
|
||||
|
||||
const editorContent =ref()
|
||||
const editorContent = ref()
|
||||
function escapeHTML(html: string): string {
|
||||
const tempElement = document.createElement('div');
|
||||
tempElement.textContent = html;
|
||||
return tempElement.innerHTML;
|
||||
const tempElement = document.createElement('div')
|
||||
tempElement.textContent = html
|
||||
return tempElement.innerHTML
|
||||
}
|
||||
const showModals =ref(false)
|
||||
const showModals = ref(false)
|
||||
// 获取子组件传过来的值
|
||||
const handleChild2 = (data: string) => {
|
||||
editorContent.value = data
|
||||
}
|
||||
|
||||
async function sure() {
|
||||
const cont = editorContent.value
|
||||
const content = escapeHTML(cont)
|
||||
const {title, actName, actSTime, actETime,position } = formValue.value
|
||||
const cont = editorContent.value
|
||||
const content = escapeHTML(cont)
|
||||
const { title, actName, actSTime, actETime, position } = formValue.value
|
||||
|
||||
|
||||
const starTime = new Date(actSTime).getTime()
|
||||
const endTime = new Date(actETime).getTime()
|
||||
console.log(starTime,endTime)
|
||||
let userIdList: any[] =[]
|
||||
if(!dataList.value){
|
||||
message.success("请选择要提醒的对象")
|
||||
return
|
||||
}
|
||||
dataList.value.forEach((i: { userId: any })=>{
|
||||
userIdList.push(i.userId)
|
||||
})
|
||||
console.log(formValue.value,dataList,content)
|
||||
if(userIdList.length<0) return
|
||||
let formdata = new FormData();
|
||||
formdata.append("title",title);
|
||||
formdata.append("actName",actName);
|
||||
formdata.append("actSTime",starTime);
|
||||
formdata.append("actETime",endTime);
|
||||
formdata.append("content",content);
|
||||
formdata.append("position",position);
|
||||
formdata.append("userIdList",userIdList);
|
||||
const { msg, code } = await addPageVisit(formdata,{headers: {'Content-Type': 'application/form-data'}})
|
||||
if (code === 200) {
|
||||
message.success("添加成功")
|
||||
}
|
||||
else { message.success(msg); }
|
||||
const starTime = new Date(actSTime).getTime()
|
||||
const endTime = new Date(actETime).getTime()
|
||||
console.log(starTime, endTime)
|
||||
let userIdList: any[] = []
|
||||
if (!dataList.value) {
|
||||
message.success('请选择要提醒的对象')
|
||||
return
|
||||
}
|
||||
dataList.value.forEach((i: { userId: any }) => {
|
||||
userIdList.push(i.userId)
|
||||
})
|
||||
console.log(formValue.value, dataList, content)
|
||||
if (userIdList.length < 0) return
|
||||
let formdata = new FormData()
|
||||
formdata.append('title', title)
|
||||
formdata.append('actName', actName)
|
||||
formdata.append('actSTime', starTime)
|
||||
formdata.append('actETime', endTime)
|
||||
formdata.append('content', content)
|
||||
formdata.append('position', position)
|
||||
formdata.append('userIdList', userIdList)
|
||||
const { msg, code } = await addPageVisit(formdata, {
|
||||
headers: { 'Content-Type': 'application/form-data' }
|
||||
})
|
||||
if (code === 200) {
|
||||
message.success('添加成功')
|
||||
} else {
|
||||
message.success(msg)
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<HomeHead class="top">
|
||||
<template #content>
|
||||
<!-- <HomeHeadSearch /> -->
|
||||
</template>
|
||||
</HomeHead>
|
||||
<div class="h-full relative flex flex-col">
|
||||
<div class="font-600 flex items-end mt27px">
|
||||
<div class="text-36px">拜访</div>
|
||||
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
||||
<div class="text-18px">{{ week }}</div>
|
||||
</div>
|
||||
<div class="g-wrapper flex-1 mt30px p30px">
|
||||
<n-form ref="formRef" :label-width="300" :model="formValue" :rules="rules" size="medium"
|
||||
require-mark-placement="left">
|
||||
<n-form-item label="标题" path="title">
|
||||
<n-input v-model:value="formValue.title" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="活动名称" path="actName">
|
||||
<n-input v-model:value="formValue.actName" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="职位" path="position">
|
||||
<n-input v-model:value="formValue.position" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="开始时间" path="actSTime">
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker v-model="formValue.actSTime" type="datetime" placeholder="请选择时间" format="YYYY/MM/DD HH:mm:ss"/>
|
||||
</el-config-provider>
|
||||
</n-form-item>
|
||||
<n-form-item label="结束时间" path="actETime">
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker v-model="formValue.actETime" type="datetime" placeholder="请选择时间" format="YYYY/MM/DD HH:mm:ss"/>
|
||||
</el-config-provider>
|
||||
</n-form-item>
|
||||
<n-form-item label="内容" path="content" class="text-#000">
|
||||
<Editor @getChildData="handleChild2"></Editor>
|
||||
</n-form-item>
|
||||
|
||||
</n-form>
|
||||
|
||||
|
||||
<n-form-item>
|
||||
<div>
|
||||
<n-button @click="showModals = true"> 文本内容预览</n-button>
|
||||
</div>
|
||||
</n-form-item>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<n-button @click="showModal = true">
|
||||
情报公开范围
|
||||
</n-button>
|
||||
<div class="mt15px h100px overflow-y-auto">
|
||||
<el-tag v-for="i in dataList" :key="i" class="mx-1" closable :disable-transitions="false"
|
||||
@close="handleClose(i)" type="info" size="large">
|
||||
{{ i.nickName }}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
<n-button attr-type="button" @click="sure" style="background-color: #3870E5; border-radius: 5px; color: #fff;margin-left: 10px;margin-top: 20px; padding: 0 20px;">
|
||||
提交
|
||||
</n-button>
|
||||
</div>
|
||||
|
||||
<HomeHead class="top">
|
||||
<template #content>
|
||||
<!-- <HomeHeadSearch /> -->
|
||||
</template>
|
||||
</HomeHead>
|
||||
<div class="h-full relative flex flex-col">
|
||||
<div class="font-600 flex items-end mt27px">
|
||||
<div class="text-36px">拜访</div>
|
||||
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
||||
<div class="text-18px">{{ week }}</div>
|
||||
</div>
|
||||
<n-modal v-model:show="showModal">
|
||||
<UserPage @clickChild="handleChild" @CloseThis="CloseThis"></UserPage>
|
||||
</n-modal>
|
||||
<n-modal v-model:show="showModals">
|
||||
<div class=" flex w80% p30px bg-#fff my40px rounded-30px">
|
||||
<div class="g-wrapper flex-1 mt30px p30px">
|
||||
<n-form
|
||||
ref="formRef"
|
||||
:label-width="300"
|
||||
:model="formValue"
|
||||
:rules="rules"
|
||||
size="medium"
|
||||
require-mark-placement="left"
|
||||
>
|
||||
<n-form-item label="标题" path="title">
|
||||
<n-input v-model:value="formValue.title" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="活动名称" path="actName">
|
||||
<n-input v-model:value="formValue.actName" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="职位" path="position">
|
||||
<n-input v-model:value="formValue.position" placeholder="" />
|
||||
</n-form-item>
|
||||
<n-form-item label="开始时间" path="actSTime">
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker
|
||||
v-model="formValue.actSTime"
|
||||
type="datetime"
|
||||
placeholder="请选择时间"
|
||||
format="YYYY/MM/DD HH:mm:ss"
|
||||
/>
|
||||
</el-config-provider>
|
||||
</n-form-item>
|
||||
<n-form-item label="结束时间" path="actETime">
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker
|
||||
v-model="formValue.actETime"
|
||||
type="datetime"
|
||||
placeholder="请选择时间"
|
||||
format="YYYY/MM/DD HH:mm:ss"
|
||||
/>
|
||||
</el-config-provider>
|
||||
</n-form-item>
|
||||
<n-form-item label="内容" path="content" class="text-#000">
|
||||
<Editor @getChildData="handleChild2"></Editor>
|
||||
</n-form-item>
|
||||
</n-form>
|
||||
|
||||
<div class=" overflow-y-auto h800px container" v-html="editorContent"></div>
|
||||
</div>
|
||||
</n-modal>
|
||||
<div class="absolute flex flex-col w-full h-full z-200 top-0 left-0 text-center bg-red justify-center items-center" style="background-color: rgba(255,255,255,0.8);">
|
||||
<img src="@/assets/images/chah.png"/>
|
||||
<br>
|
||||
<div class="text-#5683DB text-36px">【做成中,敬请期待】</div>
|
||||
<n-form-item>
|
||||
<div>
|
||||
<n-button @click="showModals = true"> 文本内容预览</n-button>
|
||||
</div>
|
||||
</n-form-item>
|
||||
|
||||
<n-button @click="showModal = true"> 情报公开范围 </n-button>
|
||||
<div class="mt15px h100px overflow-y-auto">
|
||||
<el-tag
|
||||
v-for="i in dataList"
|
||||
:key="i"
|
||||
class="mx-1"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleClose(i)"
|
||||
type="info"
|
||||
size="large"
|
||||
>
|
||||
{{ i.nickName }}
|
||||
</el-tag>
|
||||
</div>
|
||||
|
||||
<n-button
|
||||
attr-type="button"
|
||||
@click="sure"
|
||||
style="
|
||||
background-color: #3870e5;
|
||||
border-radius: 5px;
|
||||
color: #fff;
|
||||
margin-left: 10px;
|
||||
margin-top: 20px;
|
||||
padding: 0 20px;
|
||||
"
|
||||
>
|
||||
提交
|
||||
</n-button>
|
||||
</div>
|
||||
</div>
|
||||
<n-modal v-model:show="showModal">
|
||||
<UserPage @clickChild="handleChild" @CloseThis="CloseThis"></UserPage>
|
||||
</n-modal>
|
||||
<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
|
||||
class="absolute flex flex-col w-full h-full z-200 top-0 left-0 text-center bg-red justify-center items-center"
|
||||
style="background-color: rgba(255, 255, 255, 0.8)"
|
||||
>
|
||||
<img src="@/assets/images/chah.png" />
|
||||
<br />
|
||||
<div class="text-#5683DB text-36px">【做成中,敬请期待】</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
|
||||
.top {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
}
|
||||
|
||||
.g-wrapper {
|
||||
border-radius: 18px;
|
||||
border: 1px solid #E7EBF5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: auto;
|
||||
height: 800px;
|
||||
background-color: #fff;
|
||||
.timeline {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #142142;
|
||||
border-radius: 18px;
|
||||
border: 1px solid #e7ebf5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: auto;
|
||||
height: 800px;
|
||||
background-color: #fff;
|
||||
.timeline {
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
color: #142142;
|
||||
|
||||
.one {
|
||||
position: relative;
|
||||
.year{
|
||||
left: -132px;
|
||||
top: -14px;
|
||||
color: #003CB7;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
.one {
|
||||
position: relative;
|
||||
.year {
|
||||
left: -132px;
|
||||
top: -14px;
|
||||
color: #003cb7;
|
||||
font-size: 26px;
|
||||
font-weight: normal;
|
||||
text-align: center;
|
||||
line-height: 50px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,105 @@
|
|||
<script setup lang="ts">
|
||||
import { useUserStore } from '@/stores/modules/user'
|
||||
import HomeHead from '@/views/home/components/HomeHead.vue'
|
||||
// import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
|
||||
import { useDate } from '@/views/home/hooks/useDate'
|
||||
import { getArticlePage } from '@/api/daikin/base'
|
||||
import { noticeld } from '@/stores/modules/noticeId'
|
||||
import { searchStore } from '@/stores/modules/search'
|
||||
import { message } from '@/utils/message'
|
||||
const store = noticeld()
|
||||
const store2 = useUserStore()
|
||||
const searchS = searchStore()
|
||||
const { day, week } = useDate()
|
||||
const { push } = useRouter()
|
||||
const route = useRoute()
|
||||
|
||||
const listData = ref()
|
||||
const flg =ref()
|
||||
let keywords =ref()
|
||||
async function getSearchList() {
|
||||
const keyword = keywords.value
|
||||
const { rows } = await getArticlePage({ pageNum: 1, pageSize: 100, type: 2, position: 'search', keyword } as any);
|
||||
listData.value = rows
|
||||
}
|
||||
watchSyncEffect(()=>{
|
||||
keywords.value = searchS.search.content
|
||||
// console.log(keywords.value)
|
||||
getSearchList()
|
||||
})
|
||||
onMounted(() => {
|
||||
getSearchList()
|
||||
flg.value = store2.user.isReview > 0
|
||||
console.log(flg.value,store2.user.isReview)
|
||||
})
|
||||
const clickTo=(obj)=>{
|
||||
// console.log(obj)
|
||||
if(obj.isSelect===1){
|
||||
push(`${route.path}/${obj.id}`)
|
||||
}
|
||||
else{
|
||||
message.info("您没有权限查看！")
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<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 class="q-wrapper flex-1 mt30px text-#142142 flex flex-col bg-#fff p30px">
|
||||
|
||||
|
||||
<div v-if="listData&&listData.length>0" v-for="i in listData" :key="i"
|
||||
class="mt8px cursor-pointer flex items-center p15px pl20px text-18px max-w-805px">
|
||||
<span class="truncate flex-1 w0 text-#142142 hover:underline " @click=" clickTo(i)">{{ i.title }}</span>
|
||||
<span class="shrink-0 ml38px text-#808696">{{ i.createTime }}</span>
|
||||
<!-- <span v-if="flg" class="ml20px text-#808696 text-16px">来自: {{ i.publishName }}</span> -->
|
||||
</div>
|
||||
<div v-else class="w-full h-hull">
|
||||
<el-empty :image-size="200" />
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.top {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.q-wrapper {
|
||||
border-radius: 18px;
|
||||
border: 1px solid #E7EBF5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: auto;
|
||||
&::after {
|
||||
content: ' ';
|
||||
background-image: url('@/assets/images/bg-card.svg');
|
||||
pointer-events: none;
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 127px;
|
||||
background-repeat: no-repeat; /* 阻止图片平铺 */
|
||||
background-position: right top;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
}</style>
|
||||
|
|
@ -3,10 +3,12 @@ import { useUserStore } from '@/stores/modules/user'
|
|||
import HomeHead from '@/views/home/components/HomeHead.vue'
|
||||
// import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
|
||||
import { useDate } from '@/views/home/hooks/useDate'
|
||||
import { getArticlePage } from '@/api/daikin/base'
|
||||
import { getArticlePage, getSearchGlobal } from '@/api/daikin/base'
|
||||
import { noticeld } from '@/stores/modules/noticeId'
|
||||
import { searchStore } from '@/stores/modules/search'
|
||||
import { message } from '@/utils/message'
|
||||
import { NPopover } from 'naive-ui'
|
||||
|
||||
const store = noticeld()
|
||||
const store2 = useUserStore()
|
||||
const searchS = searchStore()
|
||||
|
|
@ -15,81 +17,282 @@ const { push } = useRouter()
|
|||
const route = useRoute()
|
||||
|
||||
const listData = ref()
|
||||
const flg =ref()
|
||||
let keywords =ref()
|
||||
const flg = ref()
|
||||
let keywords = ref()
|
||||
const pageInfo = reactive({
|
||||
currentPage: 1,
|
||||
pageSize: 10,
|
||||
total: 0
|
||||
})
|
||||
// App_Article 外部情报模块，App_Market 市况汇率，App_data_platform 数据平台, App_BCP BCP模块, App_CSR 碳中和模块,App_Quality 品质模块,App_Lab Lab模块,App_Database DatabBase模块
|
||||
const codeType = {
|
||||
App_Article: '外部情报', //分内部情报 和 外部情报
|
||||
App_Market: '市况汇率', //返回下文件大小 fileCommon.fileSize
|
||||
App_data_platform: '数据平台', //返回文件大小 fileCommon.fileSize
|
||||
App_BCP: 'BCP模块', //返回文件大小 fileCommon.fileSize
|
||||
App_CSR: '碳中和模块', //返回文件大小 fileCommon.fileSize
|
||||
App_Quality: '品质模块', //返回文件大小 fileCommon.fileSize
|
||||
App_Lab: 'Lab模块', //返回文件大小 fileCommon.fileSize
|
||||
App_Database: 'DatabBase模块', //返回文件大小 fileCommon.fileSize
|
||||
App_News: '新闻模块'
|
||||
}
|
||||
const loading = ref(true)
|
||||
async function getSearchList() {
|
||||
const keyword = keywords.value
|
||||
const { rows } = await getArticlePage({ pageNum: 1, pageSize: 100, type: 2, position: 'search', keyword } as any);
|
||||
listData.value = rows
|
||||
loading.value = true
|
||||
const keyword = searchS.search.content
|
||||
// const { rows } = await getArticlePage({ pageNum: 1, pageSize: 100, type: 2, position: 'search', keyword } as any);
|
||||
const { rows, total } = await getSearchGlobal({
|
||||
pageNum: pageInfo.currentPage,
|
||||
pageSize: pageInfo.pageSize,
|
||||
keyword
|
||||
} as any).catch((e) => {
|
||||
loading.value = false
|
||||
listData.value = []
|
||||
})
|
||||
listData.value = rows
|
||||
setTimeout(() => {
|
||||
loading.value = false
|
||||
}, 300)
|
||||
pageInfo.total = total
|
||||
}
|
||||
watchSyncEffect(()=>{
|
||||
keywords.value = searchS.search.content
|
||||
// console.log(keywords.value)
|
||||
getSearchList()
|
||||
watchEffect(() => {
|
||||
searchS.search.time
|
||||
getSearchList(searchS.search.content)
|
||||
})
|
||||
onMounted(() => {
|
||||
getSearchList()
|
||||
flg.value = store2.user.isReview > 0
|
||||
console.log(flg.value,store2.user.isReview)
|
||||
})
|
||||
const clickTo=(obj)=>{
|
||||
// console.log(obj)
|
||||
if(obj.isSelect===1){
|
||||
push(`${route.path}/${obj.id}`)
|
||||
}
|
||||
else{
|
||||
message.info("您没有权限查看！")
|
||||
}
|
||||
|
||||
const codePath = {
|
||||
App_Article: {
|
||||
path: '/intelligence/outside/',
|
||||
modulePath: '/Home/intelligence'
|
||||
},
|
||||
App_Market: {
|
||||
path: '/Home/market',
|
||||
modulePath: '/Home/market'
|
||||
},
|
||||
App_data_platform: {
|
||||
path: '/Home/cd',
|
||||
modulePath: '/Home/cd'
|
||||
},
|
||||
App_BCP: {
|
||||
path: '/Home/bcp',
|
||||
modulePath: '/Home/bcp'
|
||||
},
|
||||
// '碳中和模块',
|
||||
App_CSR: {
|
||||
path: '/Home/csr',
|
||||
modulePath: '/Home/csr'
|
||||
},
|
||||
// '品质模块',
|
||||
App_Quality: {
|
||||
path: '/Home/quality',
|
||||
modulePath: '/Home/quality'
|
||||
},
|
||||
// 'Lab模块',
|
||||
App_Lab: {
|
||||
path: '/Home/diffspace',
|
||||
modulePath: '/Home/diffspace'
|
||||
},
|
||||
// 'DatabBase模块'
|
||||
App_Database: {
|
||||
path: '/DataBase',
|
||||
modulePath: '/DataBase'
|
||||
}
|
||||
}
|
||||
|
||||
const clickItem = (item) => {
|
||||
const { id, filePath, isSelect, moduleCode, fileCommon = {} } = item
|
||||
console.log('🚀 ~ file: index.vue:104 ~ item:', item)
|
||||
|
||||
if (isSelect === 1) {
|
||||
downloads({ fileCommon, filePath })
|
||||
} else {
|
||||
message.info('您没有权限查看！')
|
||||
}
|
||||
}
|
||||
|
||||
const downloads = (data: any = {}) => {
|
||||
const { fileCommon, filePath } = data
|
||||
if ((fileCommon?.fileSize || 0) > 25 * 1024 * 1024) {
|
||||
message.info('正在下载中，请稍等～')
|
||||
downloadFile(filePath)
|
||||
return
|
||||
}
|
||||
if (filePath) {
|
||||
window.open(filePath, '_blank')
|
||||
} else {
|
||||
message.info('没有可预览文件！')
|
||||
}
|
||||
}
|
||||
function downloadFile(url: any) {
|
||||
fetch(url)
|
||||
.then((response) => response.blob())
|
||||
.then((blob) => {
|
||||
const downloadUrl = URL.createObjectURL(blob)
|
||||
const link = document.createElement('a')
|
||||
link.href = downloadUrl
|
||||
link.download = getFileNameFromUrl(url)
|
||||
link.click()
|
||||
})
|
||||
}
|
||||
function getFileNameFromUrl(url: string) {
|
||||
console.log(
|
||||
'🚀 ~ file: index.vue:107 ~ getFileNameFromUrl ~ getFileNameFromUrl:',
|
||||
getFileNameFromUrl
|
||||
)
|
||||
const lastSlashIndex = url.lastIndexOf('/')
|
||||
if (lastSlashIndex !== -1) {
|
||||
return url.substring(lastSlashIndex + 1)
|
||||
} else {
|
||||
return 'Invalid URL'
|
||||
}
|
||||
}
|
||||
|
||||
const goModule = (item, type) => {
|
||||
const { moduleCode, id } = item
|
||||
const { modulePath, path } = codePath[moduleCode]
|
||||
if (modulePath) {
|
||||
if (type === 'module') {
|
||||
push(modulePath)
|
||||
} else {
|
||||
push(path + id)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const handleSizeChange = (e) => {
|
||||
pageInfo.pageSize = e
|
||||
pageInfo.currentPage = 1
|
||||
getSearchList()
|
||||
}
|
||||
|
||||
// const handleCurrentChange = (e) => {
|
||||
// pageInfo.currentPage = e
|
||||
// getSearchList()
|
||||
// }
|
||||
const fileSize = 24 * 1024 * 1024
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<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 class="q-wrapper flex-1 mt30px text-#142142 flex flex-col bg-#fff p30px">
|
||||
|
||||
|
||||
<div v-if="listData&&listData.length>0" v-for="i in listData" :key="i"
|
||||
class="mt8px cursor-pointer flex items-center p15px pl20px text-18px max-w-805px">
|
||||
<span class="truncate flex-1 w0 text-#142142 hover:underline " @click=" clickTo(i)">{{ i.title }}</span>
|
||||
<span class="shrink-0 ml38px text-#808696">{{ i.createTime }}</span>
|
||||
<!-- <span v-if="flg" class="ml20px text-#808696 text-16px">来自: {{ i.publishName }}</span> -->
|
||||
</div>
|
||||
<div v-else class="w-full h-hull">
|
||||
<el-empty :image-size="200" />
|
||||
</div>
|
||||
|
||||
|
||||
</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 class="q-wrapper flex-1 mt30px text-#142142 flex flex-col bg-#fff p30px">
|
||||
<div class="h-800px mt-30px relative" v-if="listData && listData.length > 0">
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="listData"
|
||||
style="width: 100%; margin-bottom: 20px"
|
||||
row-key="id"
|
||||
border
|
||||
default-expand-all
|
||||
:header-cell-style="{
|
||||
background: '#2A7BF7',
|
||||
color: '#fff',
|
||||
height: '70px',
|
||||
lineHeight: '60px',
|
||||
textAlign: 'center',
|
||||
'font-size': '24px'
|
||||
}"
|
||||
:cell-style="{
|
||||
'text-align': 'center',
|
||||
'overflow-y': 'auto',
|
||||
height: '60px'
|
||||
}"
|
||||
>
|
||||
<el-table-column prop="moduleName" label="模块名称" width="150">
|
||||
<template #default="{ row }">
|
||||
<span class="text-16px">{{ codeType[row.moduleCode] }}</span>
|
||||
<!-- <n-popover trigger="hover" placement="top-start">
|
||||
<template #trigger>
|
||||
</template>
|
||||
<span>点击进入 {{ codeType[row.moduleCode] }}</span>
|
||||
</n-popover> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="title" label="标题" show-overflow-tooltip> </el-table-column>
|
||||
<el-table-column label="部门" prop="departName" show-overflow-tooltip width="150" />
|
||||
<el-table-column prop="userName" label="发布人" show-overflow-tooltip width="150" />
|
||||
<el-table-column label="发布日期" prop="createTime" show-overflow-tooltip width="220" />
|
||||
<el-table-column label="操作" width="270">
|
||||
<template #default="{ row }">
|
||||
<div class="">
|
||||
<div class="inline-block">
|
||||
<el-button
|
||||
v-if="row.moduleCode === 'App_Article'"
|
||||
style="color: #000"
|
||||
@click="goModule(row, 'path')"
|
||||
>详情
|
||||
</el-button>
|
||||
<template v-else>
|
||||
<n-popover
|
||||
v-if="(row.fileCommon?.fileSize || 0) > fileSize"
|
||||
trigger="hover"
|
||||
placement="top-start"
|
||||
>
|
||||
<template #trigger>
|
||||
<el-button style="color: #000" @click="clickItem(row)">预览</el-button>
|
||||
</template>
|
||||
<span>该文件超过25MB，无法进行预览，点击进行下载！</span>
|
||||
</n-popover>
|
||||
<el-button v-else style="color: #000" @click="clickItem(row)">预览</el-button>
|
||||
</template>
|
||||
</div>
|
||||
<el-button type="primary" class="ml-16px" @click="goModule(row, 'module')">
|
||||
进入模块</el-button
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="absolute bottom-20px left-50% translate-x-[-50%] z-11">
|
||||
<el-pagination
|
||||
background
|
||||
v-model:current-page="pageInfo.currentPage"
|
||||
v-model:page-size="pageInfo.pageSize"
|
||||
layout="prev, pager, next, total,jumper,->"
|
||||
:total="pageInfo.total"
|
||||
@current-change="getSearchList"
|
||||
/>
|
||||
<!-- @size-change="handleSizeChange" -->
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="w-full h-hull">
|
||||
<el-empty :image-size="300" description="搜索结果为空～" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
:deep(.el-empty__description) {
|
||||
p {
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
.top {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 1px;
|
||||
width: 1px;
|
||||
}
|
||||
|
||||
.q-wrapper {
|
||||
border-radius: 18px;
|
||||
border: 1px solid #E7EBF5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: auto;
|
||||
&::after {
|
||||
border-radius: 18px;
|
||||
border: 1px solid #e7ebf5;
|
||||
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
|
||||
overflow: auto;
|
||||
&::after {
|
||||
content: ' ';
|
||||
background-image: url('@/assets/images/bg-card.svg');
|
||||
pointer-events: none;
|
||||
|
|
@ -102,4 +305,5 @@ const clickTo=(obj)=>{
|
|||
left: 0;
|
||||
top: 0;
|
||||
}
|
||||
}</style>
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -15,435 +15,394 @@ const { toggle } = inject<any>('fullscreen')
|
|||
const activeMenuKey = ref('Home')
|
||||
let idx = ref(0)
|
||||
const Menus = ref([
|
||||
// 首页 集团部门方针 年度活动日程表 其他链接…
|
||||
{
|
||||
key: 'Home',
|
||||
name: '首页',
|
||||
icon: getImg('home.png'),
|
||||
icon1: getImg('home1.png'),
|
||||
link: '',
|
||||
path: '/Home',
|
||||
other: 'Top Page'
|
||||
},
|
||||
{
|
||||
key: 'Group',
|
||||
name: '集团部门方针',
|
||||
icon: getImg('company.png'),
|
||||
icon1: getImg('company1.png'),
|
||||
link: '',
|
||||
path: '/Home/group'
|
||||
// children: [
|
||||
// { key: 'Group', name: '-集团方针' },
|
||||
// { key: 'Company', name: '-公司方针' },
|
||||
// { key: 'HeadQuarters', name: '-调达本部方针' }
|
||||
// ]
|
||||
},
|
||||
// { key: 'company', name: '本部长通达', icon: getImg('icon-company.svg') },
|
||||
{
|
||||
key: 'User',
|
||||
name: '年度活动日程表',
|
||||
icon: getImg('book.png'),
|
||||
icon1: getImg('book1.png'),
|
||||
link: '',
|
||||
path: '/Home/User'
|
||||
// children: [
|
||||
// { key: '', name: '调达Database' },
|
||||
// ]
|
||||
},
|
||||
// { key: 'database', name: '调达Database', icon: getImg('shuju.png'),icon1: getImg('shuju1.png'),link:'https://procurement.daikin.net.cn/scripts/cbgrn/grn.exe/' },
|
||||
{
|
||||
key: 'DataBase',
|
||||
name: '调达Database',
|
||||
icon: getImg('shuju.png'),
|
||||
icon1: getImg('shuju1.png'),
|
||||
link: ''
|
||||
},
|
||||
{
|
||||
key: 'link',
|
||||
name: '其他链接',
|
||||
icon: getImg('link.png'),
|
||||
icon1: getImg('link1.png'),
|
||||
link: '',
|
||||
other: 'Other Links',
|
||||
children: [
|
||||
{
|
||||
key: 'YCWZ',
|
||||
name: '调达本部才望子',
|
||||
link: 'http://172.31.119.37/scripts/cbgrn/grn.exe/portal/index'
|
||||
},
|
||||
{
|
||||
key: 'GCDB',
|
||||
name: 'GCDB全球比价系统',
|
||||
link: 'http://10.219.11.13/gcdb/'
|
||||
},
|
||||
{
|
||||
key: 'DJ',
|
||||
name: '大金空调官方网站',
|
||||
link: 'https://www.daikin-china.com.cn'
|
||||
},
|
||||
{ key: 'CODE', name: '大金空调中国相关' }
|
||||
]
|
||||
},
|
||||
{
|
||||
key: 'phone',
|
||||
name: '紧急联络体制表',
|
||||
icon: getImg('phone.png'),
|
||||
icon1: getImg('phone1.png'),
|
||||
link: '',
|
||||
path: '/Home/phone'
|
||||
// children: [
|
||||
// { key: 'inv', name: '邀请' },
|
||||
// { key: 'visit', name: '拜访' },
|
||||
// ]
|
||||
}
|
||||
// 首页 集团部门方针 年度活动日程表 其他链接…
|
||||
{
|
||||
key: 'Home',
|
||||
name: '首页',
|
||||
icon: getImg('home.png'),
|
||||
icon1: getImg('home1.png'),
|
||||
link: '',
|
||||
path: '/Home',
|
||||
other: 'Top Page'
|
||||
},
|
||||
{
|
||||
key: 'Group',
|
||||
name: '集团部门方针',
|
||||
icon: getImg('company.png'),
|
||||
icon1: getImg('company1.png'),
|
||||
link: '',
|
||||
path: '/Home/group'
|
||||
// children: [
|
||||
// { key: 'Group', name: '-集团方针' },
|
||||
// { key: 'Company', name: '-公司方针' },
|
||||
// { key: 'HeadQuarters', name: '-调达本部方针' }
|
||||
// ]
|
||||
},
|
||||
// { key: 'company', name: '本部长通达', icon: getImg('icon-company.svg') },
|
||||
{
|
||||
key: 'User',
|
||||
name: '年度活动日程表',
|
||||
icon: getImg('book.png'),
|
||||
icon1: getImg('book1.png'),
|
||||
link: '',
|
||||
path: '/Home/User'
|
||||
// children: [
|
||||
// { key: '', name: '调达Database' },
|
||||
// ]
|
||||
},
|
||||
// { key: 'database', name: '调达Database', icon: getImg('shuju.png'),icon1: getImg('shuju1.png'),link:'https://procurement.daikin.net.cn/scripts/cbgrn/grn.exe/' },
|
||||
{
|
||||
key: 'DataBase',
|
||||
name: '调达Database',
|
||||
icon: getImg('shuju.png'),
|
||||
icon1: getImg('shuju1.png'),
|
||||
link: ''
|
||||
},
|
||||
{
|
||||
key: 'link',
|
||||
name: '其他链接',
|
||||
icon: getImg('link.png'),
|
||||
icon1: getImg('link1.png'),
|
||||
link: '',
|
||||
other: 'Other Links',
|
||||
children: [
|
||||
{
|
||||
key: 'YCWZ',
|
||||
name: '调达本部才望子',
|
||||
link: 'http://172.31.119.37/scripts/cbgrn/grn.exe/portal/index'
|
||||
},
|
||||
{
|
||||
key: 'GCDB',
|
||||
name: 'GCDB全球比价系统',
|
||||
link: 'http://10.219.11.13/gcdb/'
|
||||
},
|
||||
{
|
||||
key: 'DJ',
|
||||
name: '大金空调官方网站',
|
||||
link: 'https://www.daikin-china.com.cn'
|
||||
},
|
||||
{ key: 'CODE', name: '大金空调中国相关' }
|
||||
]
|
||||
},
|
||||
{
|
||||
key: 'phone',
|
||||
name: '紧急联络体制表',
|
||||
icon: getImg('phone.png'),
|
||||
icon1: getImg('phone1.png'),
|
||||
link: '',
|
||||
path: '/Home/phone',
|
||||
// children: [
|
||||
// { key: 'inv', name: '邀请' },
|
||||
// { key: 'visit', name: '拜访' },
|
||||
// ]
|
||||
children: [{ key: 'DataBase', name: '公司内线', params: { id: 267 } }]
|
||||
}
|
||||
])
|
||||
|
||||
async function getDbTree() {
|
||||
const { data = [] } = await treeDbList({})
|
||||
Menus.value[3].children = data.map((item: any) => {
|
||||
return {
|
||||
key: 'DataBase',
|
||||
name: item.name,
|
||||
params: { id: item.id }
|
||||
}
|
||||
})
|
||||
const { data = [] } = await treeDbList({})
|
||||
Menus.value[3].children = data.map((item: any) => {
|
||||
return {
|
||||
key: 'DataBase',
|
||||
name: item.name,
|
||||
params: { id: item.id }
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
getDbTree()
|
||||
let flag = false
|
||||
function menuHandler(menu: any, index: number) {
|
||||
activeMenuKey.value = menu.key
|
||||
console.log(menu, index)
|
||||
if (menu.key === 'DataBase' && idx.value === index) {
|
||||
report({ moduleCode: 'App_Database' })
|
||||
push({ name: menu.key })
|
||||
return
|
||||
}
|
||||
idx.value = index
|
||||
console.log(menu.key, 'key')
|
||||
if (!menu.key) return
|
||||
// if (menu.key === 'DataBase') {
|
||||
// if (flag) {
|
||||
// push({ name: menu.key })
|
||||
// flag = false
|
||||
// return
|
||||
// }
|
||||
// flag = true
|
||||
// setTimeout(() => {
|
||||
// flag = false
|
||||
// }, 300)
|
||||
// }
|
||||
if (menu.children) return
|
||||
if (menu.key === 'DataBase') {
|
||||
report({ moduleCode: 'App_Database' })
|
||||
}
|
||||
push({ name: menu.key })
|
||||
activeMenuKey.value = menu.key
|
||||
console.log(menu, index)
|
||||
if (menu.key === 'DataBase' && idx.value === index) {
|
||||
report({ moduleCode: 'App_Database' })
|
||||
push({ name: menu.key })
|
||||
return
|
||||
}
|
||||
if (menu.key === 'phone' && idx.value === index) {
|
||||
push(menu.path)
|
||||
return
|
||||
}
|
||||
idx.value = index
|
||||
if (!menu.key) return
|
||||
// if (menu.key === 'DataBase') {
|
||||
// if (flag) {
|
||||
// push({ name: menu.key })
|
||||
// flag = false
|
||||
// return
|
||||
// }
|
||||
// flag = true
|
||||
// setTimeout(() => {
|
||||
// flag = false
|
||||
// }, 300)
|
||||
// }
|
||||
if (menu.children) return
|
||||
if (menu.key === 'DataBase') {
|
||||
report({ moduleCode: 'App_Database' })
|
||||
}
|
||||
push({ name: menu.key })
|
||||
}
|
||||
const shorm = ref(false)
|
||||
|
||||
const { path } = useRoute()
|
||||
watchEffect(() => {
|
||||
setTimeout(() => {
|
||||
const index = Menus.value.findIndex((item: any) => item.path === path)
|
||||
if (index > -1 && idx.value !== index) {
|
||||
const menu = Menus.value[index]
|
||||
menuHandler(menu, index)
|
||||
}
|
||||
}, 0)
|
||||
setTimeout(() => {
|
||||
const index = Menus.value.findIndex((item: any) => item.path === path)
|
||||
if (index > -1 && idx.value !== index) {
|
||||
const menu = Menus.value[index]
|
||||
menuHandler(menu, index)
|
||||
}
|
||||
}, 0)
|
||||
})
|
||||
function goChild(menu: any) {
|
||||
activeItem = menu.key
|
||||
if (menu.key === 'CODE') {
|
||||
shorm.value = true
|
||||
return
|
||||
}
|
||||
if (menu.link) {
|
||||
} else {
|
||||
push({ name: menu.key, query: menu.params || {} })
|
||||
}
|
||||
activeItem = menu.key
|
||||
if (menu.key === 'CODE') {
|
||||
shorm.value = true
|
||||
return
|
||||
}
|
||||
if (menu.link) {
|
||||
} else {
|
||||
push({ name: menu.key, query: menu.params || {} })
|
||||
}
|
||||
}
|
||||
var activeItem = 0
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="page w-1920px h-1080px p30px flex">
|
||||
<div class="w300px -mr-1px flex flex-col shrink-0 overflow-auto">
|
||||
<!-- @dblclick="toggle" -->
|
||||
<img src="@/assets/images/logo.png" class="w197px h44px mt14px" />
|
||||
<div class="text-20px text-#fff font-600 mt6px">
|
||||
大金中国调达本部 HOMEPAGE
|
||||
</div>
|
||||
<div class="page w-1920px h-1080px p30px flex">
|
||||
<div class="w300px -mr-1px flex flex-col shrink-0 overflow-auto">
|
||||
<!-- @dblclick="toggle" -->
|
||||
<img src="@/assets/images/logo.png" class="w197px h44px mt14px" />
|
||||
<div class="text-20px text-#fff font-600 mt6px">大金中国调达本部 HOMEPAGE</div>
|
||||
|
||||
<div
|
||||
class="mt34px w270px min-h80px rd-35px b-4px bg-#fff/16 b-4px b-solid b-#fff/23 overflow-hidden relative"
|
||||
>
|
||||
<Searchs></Searchs>
|
||||
</div>
|
||||
<div class="pt10px pb10px flex-1 max-h-636px">
|
||||
<div
|
||||
class="nav pl36px pr16px py24px m10px mr0 rd-32px rd-r-0 flex flex-col text-#fff cursor-pointer hover:underline"
|
||||
v-for="(m, index) in Menus"
|
||||
:key="m.key"
|
||||
:class="
|
||||
activeMenuKey === m.key ? (m.children ? 'actives' : 'active') : ''
|
||||
"
|
||||
@click="() => menuHandler(m, index)"
|
||||
>
|
||||
<div :class="activeMenuKey === m.key && 'onActive'">
|
||||
<img
|
||||
v-if="activeMenuKey === m.key"
|
||||
:src="m.icon1"
|
||||
class="w22px h22px mr16px mt--5px"
|
||||
/>
|
||||
<img v-else :src="m.icon" class="w22px h22px mr16px mt--5px" />
|
||||
<span
|
||||
class="text-22px font-900 leading-22px"
|
||||
:class="
|
||||
(m.key === 'link' || m.key === 'DataBase') &&
|
||||
'underline border-b-0px border-b-solid'
|
||||
"
|
||||
>
|
||||
<a v-if="m.link" class="no-underline text-#fff" :href="m.link">
|
||||
{{ m.name }}</a
|
||||
>
|
||||
<span v-else>
|
||||
<a
|
||||
v-if="m.key === 'link' || m.key === 'DataBase'"
|
||||
class="text-#fff"
|
||||
>
|
||||
{{ m.name }}</a
|
||||
>
|
||||
<span v-else>{{ m.name }}</span>
|
||||
</span>
|
||||
<span class="text-18px italic font-500" v-if="m.other">{{
|
||||
m.other
|
||||
}}</span>
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
class="mt34px w270px min-h80px rd-35px b-4px bg-#fff/16 b-4px b-solid b-#fff/23 overflow-hidden relative"
|
||||
>
|
||||
<Searchs></Searchs>
|
||||
</div>
|
||||
<!-- max-h-636px -->
|
||||
<div class="pt10px pb10px flex-1 max-h-836px">
|
||||
<div
|
||||
class="nav pl36px pr16px py24px m10px mr0 rd-32px rd-r-0 flex flex-col text-#fff cursor-pointer hover:underline"
|
||||
v-for="(m, index) in Menus"
|
||||
:key="m.key"
|
||||
:class="activeMenuKey === m.key ? (m.children ? 'actives' : 'active') : ''"
|
||||
@click="() => menuHandler(m, index)"
|
||||
>
|
||||
<div :class="activeMenuKey === m.key && 'onActive'">
|
||||
<img v-if="activeMenuKey === m.key" :src="m.icon1" class="w22px h22px mr16px mt--5px" />
|
||||
<img v-else :src="m.icon" class="w22px h22px mr16px mt--5px" />
|
||||
<span
|
||||
class="text-22px font-900 leading-22px"
|
||||
:class="
|
||||
(m.key === 'link' || m.key === 'DataBase') &&
|
||||
'underline border-b-0px border-b-solid'
|
||||
"
|
||||
>
|
||||
<a v-if="m.link" class="no-underline text-#fff" :href="m.link"> {{ m.name }}</a>
|
||||
<span v-else>
|
||||
<a v-if="m.key === 'link' || m.key === 'DataBase'" class="text-#fff">
|
||||
{{ m.name }}</a
|
||||
>
|
||||
<span v-else>{{ m.name }}</span>
|
||||
</span>
|
||||
<span class="text-18px italic font-500" v-if="m.other">{{ m.other }}</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div v-if="m.children && idx == index" class="pl40px">
|
||||
<div
|
||||
class="my16px pl30px text-#fff activeChildren text-20px"
|
||||
v-for="(item, ind) in m.children"
|
||||
:key="item.key"
|
||||
@click.stop="goChild(item)"
|
||||
@click="activeItem = ind"
|
||||
>
|
||||
<a
|
||||
v-if="item.link"
|
||||
class="no-underline !text-#fff flex"
|
||||
:href="item.link"
|
||||
><span
|
||||
class="w7px h7px rd-7px bg-#fff block mr-8px mt4px"
|
||||
></span
|
||||
>{{ item.name }}</a
|
||||
>
|
||||
<span v-else class="flex"
|
||||
><span
|
||||
class="w7px h7px rd-7px bg-#fff block mr-8px mt4px"
|
||||
></span
|
||||
>{{ item.name }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="w270px py14px my20px px24px flex rd-20px bg-#003cb7 hover:underline hover:cursor-pointer"
|
||||
style="box-shadow: 0 2rpx 14rpx 0 #00000069"
|
||||
>
|
||||
<div
|
||||
class="flex items-center text-18px"
|
||||
@click="push({ name: 'DataBase', query: { id: 267 } })"
|
||||
>
|
||||
<img
|
||||
src="@/assets/images/dianhhh@2x.png"
|
||||
class="w22px h22px mr10px"
|
||||
/>
|
||||
公司内线
|
||||
</div>
|
||||
</div>
|
||||
<n-popover
|
||||
v-if="false"
|
||||
trigger="hover"
|
||||
placement="top"
|
||||
:style="{ '--n-border-radius': '8px' }"
|
||||
>
|
||||
<template #trigger> </template>
|
||||
<div
|
||||
class="text-14px text-#285FE9 flex items-center hover:underline cursor-pointer"
|
||||
>
|
||||
<img
|
||||
src="@/assets/images/wjqq@2x.png"
|
||||
class="w14px h18px mr4px object-contain"
|
||||
/>
|
||||
<span>{{ '公司内线公司内线公司内线' }}</span>
|
||||
</div>
|
||||
</n-popover>
|
||||
<div
|
||||
class="p20px w270px rd-20px b-4px bg-#fff/4 b-4px b-solid b-#fff/23 text-14px relative"
|
||||
>
|
||||
<a
|
||||
href="http://172.31.119.37/scripts/cbgrn/grn.exe/portal/index"
|
||||
target="_blank"
|
||||
class="no-underline text-#fff"
|
||||
>
|
||||
<div class="flex items-center text-18px hover:underline">
|
||||
<img
|
||||
src="@/assets/images/icon-book.svg"
|
||||
class="w22px h22px mr10px"
|
||||
/>
|
||||
个人日程
|
||||
</div>
|
||||
<!-- <div class="mt18px">9:00-10:00</div>
|
||||
<div v-if="m.children && idx == index" class="pl40px">
|
||||
<div
|
||||
class="my16px pl30px text-#fff activeChildren text-20px"
|
||||
v-for="(item, ind) in m.children"
|
||||
:key="item.key"
|
||||
@click.stop="goChild(item)"
|
||||
@click="activeItem = ind"
|
||||
>
|
||||
<a v-if="item.link" class="no-underline !text-#fff flex" :href="item.link"
|
||||
><span class="w7px h7px rd-7px bg-#fff block mr-8px mt4px"></span>{{ item.name }}</a
|
||||
>
|
||||
<span v-else class="flex"
|
||||
><span class="w7px h7px rd-7px bg-#fff block mr-8px mt4px"></span
|
||||
>{{ item.name }}</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
v-if="false"
|
||||
class="w270px py14px my20px px24px flex rd-20px bg-#003cb7 hover:underline hover:cursor-pointer"
|
||||
style="box-shadow: 0 2rpx 14rpx 0 #00000069"
|
||||
>
|
||||
<div
|
||||
class="flex items-center text-18px"
|
||||
@click="push({ name: 'DataBase', query: { id: 267 } })"
|
||||
>
|
||||
<img src="@/assets/images/dianhhh@2x.png" class="w22px h22px mr10px" />
|
||||
公司内线
|
||||
</div>
|
||||
</div>
|
||||
<n-popover
|
||||
v-if="false"
|
||||
trigger="hover"
|
||||
placement="top"
|
||||
:style="{ '--n-border-radius': '8px' }"
|
||||
>
|
||||
<template #trigger> </template>
|
||||
<div class="text-14px text-#285FE9 flex items-center hover:underline cursor-pointer">
|
||||
<img src="@/assets/images/wjqq@2x.png" class="w14px h18px mr4px object-contain" />
|
||||
<span>{{ '公司内线公司内线公司内线' }}</span>
|
||||
</div>
|
||||
</n-popover>
|
||||
<div class="p20px w270px rd-20px b-4px bg-#fff/4 b-4px b-solid b-#fff/23 text-14px relative">
|
||||
<a
|
||||
href="http://172.31.119.37/scripts/cbgrn/grn.exe/portal/index"
|
||||
target="_blank"
|
||||
class="no-underline text-#fff"
|
||||
>
|
||||
<div class="flex items-center text-18px hover:underline">
|
||||
<img src="@/assets/images/icon-book.svg" class="w22px h22px mr10px" />
|
||||
个人日程
|
||||
</div>
|
||||
<!-- <div class="mt18px">9:00-10:00</div>
|
||||
<div class="mt8px">召集部门成员召开项目启动会</div>
|
||||
<div class="mt16px">10:01-11:00</div>
|
||||
<div class="mt8px">召集部门成员召开项目启动会</div> -->
|
||||
<img
|
||||
src="@/assets/images/zhulj@2x.png"
|
||||
class="absolute w22px h22px mr10px top--15px right--20px"
|
||||
/>
|
||||
</a>
|
||||
<div
|
||||
class="mt10px ml-30px opacity-70"
|
||||
@click="(e) => e.stopPropagation()"
|
||||
>
|
||||
请点击上方链接登录cybouzu
|
||||
</div>
|
||||
</div>
|
||||
<img
|
||||
src="@/assets/images/zhulj@2x.png"
|
||||
class="absolute w22px h22px mr10px top--15px right--20px"
|
||||
/>
|
||||
</a>
|
||||
<div class="mt10px ml-30px opacity-70" @click="(e) => e.stopPropagation()">
|
||||
请点击上方链接登录cybouzu
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- <div class="p20px w270px rd-20px b-4px bg-#fff/16 b-4px b-solid b-#fff/23 text-14px mt22px">
|
||||
<!-- <div class="p20px w270px rd-20px b-4px bg-#fff/16 b-4px b-solid b-#fff/23 text-14px mt22px">
|
||||
<div class="flex items-center text-18px">
|
||||
<img src="@/assets/images/icon-memo.svg" class="w22px h22px mr10px" />
|
||||
memo
|
||||
</div>
|
||||
<div class="mt18px lh-24px">新年方针:领先时代的变化开创崭新的 未来</div>
|
||||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="main flex-1 rd-32px p30px pb15px pt0px mt62px relative">
|
||||
<!-- <Home /> -->
|
||||
<RouterView />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="fixed bottom-4px text-#fff text-12px ml38px"
|
||||
style="margin: 0; width: 100%; text-align: center"
|
||||
>
|
||||
今日访问人数：{{
|
||||
store.user.appLoginToDayCount
|
||||
}} 累计访问人数：{{ store.user.appLoginCount }}
|
||||
</div>
|
||||
<NModal v-model:show="shorm" :mask-closable="false">
|
||||
<div class="w700px h430px bg-#fff rd-15px">
|
||||
<div
|
||||
class="py5px px15px"
|
||||
style="
|
||||
border-bottom: 1px solid #dadada;
|
||||
font-weight: bold;
|
||||
color: #494a63;
|
||||
"
|
||||
>
|
||||
大金空调中国相关
|
||||
<img
|
||||
@click="shorm = false"
|
||||
src="@/assets/images/chac@2x.png"
|
||||
class="w15px float-right mt5px mr5px"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex mt70px text-center">
|
||||
<div class="w-full text-center">
|
||||
<img src="@/assets/images/ewm1@2x.png" class="w200px" />
|
||||
<div
|
||||
class="py10px bg-#377CFF text-#fff w200px rd-20px mt35px mx-auto"
|
||||
>
|
||||
大金空调中国视频号
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<img src="@/assets/images/ewm2@2x.png" class="w200px" />
|
||||
<div
|
||||
class="py10px bg-#377CFF text-#fff w200px rd-20px mt35px mx-auto"
|
||||
>
|
||||
大金空调抖音号
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</NModal>
|
||||
<div class="main flex-1 rd-32px p30px pb15px pt0px mt62px relative">
|
||||
<!-- <Home /> -->
|
||||
<RouterView />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="fixed bottom-4px text-#fff text-12px ml38px"
|
||||
style="margin: 0; width: 100%; text-align: center"
|
||||
>
|
||||
今日访问人数：{{ store.user.appLoginToDayCount }} 累计访问人数：{{
|
||||
store.user.appLoginCount
|
||||
}}
|
||||
</div>
|
||||
<NModal v-model:show="shorm" :mask-closable="false">
|
||||
<div class="w700px h430px bg-#fff rd-15px">
|
||||
<div
|
||||
class="py5px px15px"
|
||||
style="border-bottom: 1px solid #dadada; font-weight: bold; color: #494a63"
|
||||
>
|
||||
大金空调中国相关
|
||||
<img
|
||||
@click="shorm = false"
|
||||
src="@/assets/images/chac@2x.png"
|
||||
class="w15px float-right mt5px mr5px"
|
||||
/>
|
||||
</div>
|
||||
<div class="flex mt70px text-center">
|
||||
<div class="w-full text-center">
|
||||
<img src="@/assets/images/ewm1@2x.png" class="w200px" />
|
||||
<div class="py10px bg-#377CFF text-#fff w200px rd-20px mt35px mx-auto">
|
||||
大金空调中国视频号
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<img src="@/assets/images/ewm2@2x.png" class="w200px" />
|
||||
<div class="py10px bg-#377CFF text-#fff w200px rd-20px mt35px mx-auto">
|
||||
大金空调抖音号
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</NModal>
|
||||
</template>
|
||||
|
||||
<style scoped lang="less">
|
||||
.page {
|
||||
font-family: 'PingFang SC';
|
||||
user-select: none;
|
||||
font-family: 'PingFang SC';
|
||||
user-select: none;
|
||||
|
||||
// background-image: url('@/assets/images/bg.jpg');
|
||||
// background-color: #000;
|
||||
background-position: 0 0;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
color: #fff;
|
||||
// background-image: url('@/assets/images/bg.jpg');
|
||||
// background-color: #000;
|
||||
background-position: 0 0;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
color: #fff;
|
||||
|
||||
line-height: 1;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.nav {
|
||||
position: relative;
|
||||
position: relative;
|
||||
|
||||
&::before {
|
||||
top: -48px;
|
||||
}
|
||||
.activeChildren:hover {
|
||||
a,
|
||||
span {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
&::after {
|
||||
bottom: -49px;
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
&::before {
|
||||
top: -48px;
|
||||
}
|
||||
.activeChildren:hover {
|
||||
a,
|
||||
span {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
&::after {
|
||||
bottom: -49px;
|
||||
transform: rotate(-90deg);
|
||||
}
|
||||
|
||||
&.active {
|
||||
color: #002fa7;
|
||||
background-color: #fff;
|
||||
a {
|
||||
color: #002fa7;
|
||||
}
|
||||
&::before,
|
||||
&::after {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&.actives {
|
||||
padding: 0px !important;
|
||||
color: #002fa7;
|
||||
background-color: rgba(255, 255, 255, 0.3);
|
||||
a {
|
||||
color: #002fa7;
|
||||
}
|
||||
&::before,
|
||||
&::after {
|
||||
opacity: 1;
|
||||
}
|
||||
.onActive {
|
||||
background-color: #fff;
|
||||
border-radius: 32px 0 0 32px;
|
||||
&.active {
|
||||
color: #002fa7;
|
||||
background-color: #fff;
|
||||
a {
|
||||
color: #002fa7;
|
||||
}
|
||||
&::before,
|
||||
&::after {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&.actives {
|
||||
padding: 0px !important;
|
||||
color: #002fa7;
|
||||
background-color: rgba(255, 255, 255, 0.3);
|
||||
a {
|
||||
color: #002fa7;
|
||||
}
|
||||
&::before,
|
||||
&::after {
|
||||
opacity: 1;
|
||||
}
|
||||
.onActive {
|
||||
background-color: #fff;
|
||||
border-radius: 32px 0 0 32px;
|
||||
|
||||
padding: 24px 16px 24px 36px;
|
||||
}
|
||||
}
|
||||
padding: 24px 16px 24px 36px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main {
|
||||
background-image: url('@/assets/images/bg-rs-main.svg');
|
||||
background-position: 0 0;
|
||||
background-repeat: repeat-x;
|
||||
background-size: auto;
|
||||
background-image: url('@/assets/images/bg-rs-main.svg');
|
||||
background-position: 0 0;
|
||||
background-repeat: repeat-x;
|
||||
background-size: auto;
|
||||
}
|
||||
&::-webkit-scrollbar {
|
||||
display: none;
|
||||
scrollbar-width: none;
|
||||
display: none;
|
||||
scrollbar-width: none;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
108
vite.config.ts
108
vite.config.ts
|
|
@ -13,59 +13,59 @@ import PurgeIcons from 'vite-plugin-purge-icons'
|
|||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
server: {
|
||||
proxy: {
|
||||
'/test-api': {
|
||||
target: 'http://admin.echo.mteam01.com/openApi/',
|
||||
changeOrigin: true,
|
||||
rewrite: (path) => path.replace(/^\/test-api/, '') // 设置重写的路径
|
||||
}
|
||||
}
|
||||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
}
|
||||
},
|
||||
server: {
|
||||
proxy: {
|
||||
'/test-api': {
|
||||
target: 'http://admin.echo.mteam01.com/openApi/',
|
||||
changeOrigin: true,
|
||||
rewrite: (path) => path.replace(/^\/test-api/, '') // 设置重写的路径
|
||||
}
|
||||
}
|
||||
},
|
||||
resolve: {
|
||||
alias: {
|
||||
'@': fileURLToPath(new URL('./src', import.meta.url))
|
||||
}
|
||||
},
|
||||
|
||||
plugins: [
|
||||
vue(),
|
||||
vueJsx(),
|
||||
Unocss({
|
||||
presets: [presetUno()]
|
||||
}),
|
||||
AutoImport({
|
||||
imports: ['vue', 'vue-router', '@vueuse/core'], // 自动导入vue和vue-router相关函数
|
||||
dts: 'src/types/auto-import.d.ts',
|
||||
// eslint报错解决 https://blog.csdn.net/sayUonly/article/details/123482912
|
||||
eslintrc: {
|
||||
enabled: false, // Default `false`
|
||||
filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
|
||||
globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
|
||||
},
|
||||
resolvers: [ElementPlusResolver()]
|
||||
}),
|
||||
Components({
|
||||
resolvers: [ElementPlusResolver()]
|
||||
}),
|
||||
PurgeIcons(),
|
||||
ViteCompression({
|
||||
algorithm: 'gzip', // 选择压缩算法，支持 'gzip' 或 'brotli'
|
||||
ext: '.gz', // 压缩后文件的扩展名
|
||||
verbose: false
|
||||
})
|
||||
],
|
||||
build: {
|
||||
chunkSizeWarningLimit: 4000,
|
||||
sourcemap: false, // Builds sourcemaps for better debugging but could be disabled for performance
|
||||
minify: 'esbuild', // Use 'terser' for minimizing your codes, it could be 'esbuild' but 'terser' is more accurate
|
||||
rollupOptions: {
|
||||
treeshake: true // Enable tree-shaking
|
||||
},
|
||||
terserOptions: {
|
||||
compress: {
|
||||
// pure_funcs: ['console.log', 'console.info'] // Remove console.log and console.info from production build
|
||||
}
|
||||
}
|
||||
}
|
||||
plugins: [
|
||||
vue(),
|
||||
vueJsx(),
|
||||
Unocss({
|
||||
presets: [presetUno()]
|
||||
}),
|
||||
AutoImport({
|
||||
imports: ['vue', 'vue-router', '@vueuse/core'], // 自动导入vue和vue-router相关函数
|
||||
dts: 'src/types/auto-import.d.ts',
|
||||
// eslint报错解决 https://blog.csdn.net/sayUonly/article/details/123482912
|
||||
eslintrc: {
|
||||
enabled: false, // Default `false`
|
||||
filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
|
||||
globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
|
||||
},
|
||||
resolvers: [ElementPlusResolver()]
|
||||
}),
|
||||
Components({
|
||||
resolvers: [ElementPlusResolver()]
|
||||
}),
|
||||
PurgeIcons(),
|
||||
ViteCompression({
|
||||
algorithm: 'gzip', // 选择压缩算法，支持 'gzip' 或 'brotli'
|
||||
ext: '.gz', // 压缩后文件的扩展名
|
||||
verbose: false
|
||||
})
|
||||
],
|
||||
build: {
|
||||
chunkSizeWarningLimit: 6300,
|
||||
sourcemap: false, // Builds sourcemaps for better debugging but could be disabled for performance
|
||||
minify: 'esbuild', // Use 'terser' for minimizing your codes, it could be 'esbuild' but 'terser' is more accurate
|
||||
rollupOptions: {
|
||||
treeshake: true // Enable tree-shaking
|
||||
},
|
||||
terserOptions: {
|
||||
compress: {
|
||||
// pure_funcs: ['console.log', 'console.info'] // Remove console.log and console.info from production build
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue