wwl
/
daikins
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update

main
王文龙 2024-01-29 18:02:58 +08:00
parent 14fec77952
commit 4a4ac0c29f
37 changed files with 6944 additions and 4820 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
components.d.ts vendored
View File

@ -37,6 +37,7 @@ declare module 'vue' {
ElRadio: typeof import('element-plus/es')['ElRadio'] ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup'] ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow'] ElRow: typeof import('element-plus/es')['ElRow']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElSelect: typeof import('element-plus/es')['ElSelect'] ElSelect: typeof import('element-plus/es')['ElSelect']
ElTable: typeof import('element-plus/es')['ElTable'] ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn'] ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
@ -50,4 +51,7 @@ declare module 'vue' {
RouterView: typeof import('vue-router')['RouterView'] RouterView: typeof import('vue-router')['RouterView']
Search: typeof import('./src/components/search.vue')['default'] Search: typeof import('./src/components/search.vue')['default']
} }
export interface ComponentCustomProperties {
vLoading: typeof import('element-plus/es')['ElLoadingDirective']
}
} }

1
package.json
View File

@ -30,6 +30,7 @@
"pinia": "^2.0.32", "pinia": "^2.0.32",
"swiper": "^9.3.2", "swiper": "^9.3.2",
"tinymce": "^6.6.0", "tinymce": "^6.6.0",
"v-scale-screen": "^2.2.0",
"vue": "^3.2.47", "vue": "^3.2.47",
"vue-demi": "^0.14.5", "vue-demi": "^0.14.5",
"vue-echarts": "^6.5.4", "vue-echarts": "^6.5.4",

167
src/App.vue
View File

@ -1,82 +1,127 @@
<script setup lang="ts"> <script setup lang="ts">
import { RouterView } from "vue-router"; import { RouterView } from 'vue-router'
import { useFullscreen, useFavicon, useTitle } from "@vueuse/core"; 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'
import FitScreen from "@fit-screen/vue"; import FitScreen from '@fit-screen/vue'
import { NMessageProvider } from "naive-ui"; import { NMessageProvider } from 'naive-ui'
import { useUserStore } from "@/stores/modules/user"; import { useUserStore } from '@/stores/modules/user'
import { NConfigProvider } from 'naive-ui' import { NConfigProvider } from 'naive-ui'
import { zhCN as NZhCN, dateZhCN } from 'naive-ui' import { zhCN as NZhCN, dateZhCN } from 'naive-ui'
import VScaleScreen from 'v-scale-screen'
import img from '@/assets/images/bg.jpg'
// 全屏 // 全屏
const fitscreenRef = ref<HTMLElement | null>(null); const fitscreenRef = ref<HTMLElement | null>(null)
const { toggle } = useFullscreen(fitscreenRef); const { toggle } = useFullscreen(fitscreenRef)
// console.log(RouterView) // console.log(RouterView)
provide("fullscreen", { toggle }); provide('fullscreen', { toggle })
// const screenWidth = window.screen.width; // const screenWidth = window.screen.width
// const screenHeight = window.screen.height; // const screenHeight = window.screen.height
// console.log('🚀 ~ screenWidth:', screenWidth)
// console.log('🚀 ~ screenHeight:', screenHeight)
const screenWidth = 1920 const screenWidth = 1920
const screenHeight =1080 const screenHeight = 1080
const store = useUserStore(); const store = useUserStore()
store.getUser(); store.getUser()
console.log(screenWidth,screenHeight) // console.log(screenWidth, screenHeight)
const route = useRoute(); // 获取当前的路由信息 const route = useRoute() // 获取当前的路由信息
const pageClass = computed(() => { const pageClass = computed(() => {
// console.log(route.name) // console.log(route.name)
// if (navigator.userAgent.match(/iPad|Android Tablet/i)) { // if (navigator.userAgent.match(/iPad|Android Tablet/i)) {
// // 这是一个平板设备 // // 这是一个平板设备
// console.log("平板",navigator.userAgent) // console.log("平板",navigator.userAgent)
// } else { // } else {
// // 这不是一个平板设备 // // 这不是一个平板设备
// console.log("电脑") // console.log("电脑")
// } // }
// 根据路由信息返回不同的页面类名 // 根据路由信息返回不同的页面类名
if (route.name === "Entry") { if (route.name === 'Entry') {
return "bg-#fff"; // 假设关于页的类名为 page-about return 'bg-#fff' // 假设关于页的类名为 page-about
} } else if (route.name === 'DataBase') {
else if(route.name==='DataBase'){ return 'bg-#fff'
return 'bg-#fff' } else if (route.name === 'ExternalLogin' || route.name === 'Login') {
} return 'bg-#f3f3f3' // 假设关于页的类名为 page-about
else if (route.name === "ExternalLogin"||route.name === "Login") { }
return "bg-#f3f3f3"; // 假设关于页的类名为 page-about return 'page' // 默认类名
} })
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'
} // 默认类名
})
const locale = computed(() => zhCn) const locale = computed(() => zhCn)
const scaleChange = ({
widthRatio,
heightRatio
}: {
widthRatio: number
heightRatio: number
}) => {
console.log('scaleChange', widthRatio, heightRatio)
}
const beforeCalculate = (scale) => {
console.log('🚀 ~ scale:', scale)
return false
}
// ref="fitscreenRef"
// :width="screenWidth"
// :height="screenHeight"
// mode="fit"
// :class="pageClass"
// executeMode="debounce"
// waitTime="300"
// @scaleChange="scaleChange"
// :beforeCalculate="beforeCalculate"
</script> </script>
<template> <template>
<NMessageProvider> <NMessageProvider>
<FitScreen <VScaleScreen
ref="fitscreenRef" ref="fitscreenRef"
:width="screenWidth" :width="screenWidth"
:height="screenHeight" :height="screenHeight"
mode="fit" mode="fit"
:class="pageClass" :box-style="pageStyle"
> >
<n-config-provider :locale="NZhCN" :date-locale="dateZhCN"> <!-- <div :class="pageClass"> -->
<el-config-provider :locale="locale"> <n-config-provider :locale="NZhCN" :date-locale="dateZhCN">
<RouterView /> <el-config-provider :locale="locale">
</el-config-provider> <RouterView />
</n-config-provider> </el-config-provider>
</FitScreen> </n-config-provider>
</NMessageProvider> <!-- </div> -->
</VScaleScreen>
</NMessageProvider>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
.page { .fit-screen {
text-rendering: optimizeLegibility !important;
background-image: url('@/assets/images/bg.jpg');
background-position: 0 0;
background-repeat: no-repeat;
background-size: cover;
} }
.pages{ .page,
background-color: #fff; .v-screen-box {
// background-image: url('@/assets/images/bg.jpg') !important;
// background-position: 0 0;
// background-repeat: no-repeat;
// background-size: cover;
} }
.pagess{ .pages {
background-color: #f3f3f3; background-color: #fff;
}
.pagess {
background-color: #f3f3f3;
} }
</style> </style>

27
src/api/daikin/base.ts
View File

@ -1235,6 +1235,33 @@ export async function externalTimeStat(data: any) {
return http.post(`/moduleStat/externalTimeStat`, data) return http.post(`/moduleStat/externalTimeStat`, data)
} }
/**
* 网站外部足迹 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=32575a43-0b66-4e39-a681-68ef295b2b37
*/
export async function userDetailExport(data: any) {
return http.post(`/moduleStat/userDetailExport`, data, {
responseType: 'blob'
})
}
/**
* 图表2-科室表格数据 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=32575a43-0b66-4e39-a681-68ef295b2b37
*/
export async function getDepartData(params: any) {
return http.get(`/moduleStat/getDepartData`, { params })
}
/**
* 图表1-饼状图统计数据 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=32575a43-0b66-4e39-a681-68ef295b2b37
*/
export async function getPieChartData(params: any) {
return http.get(`/moduleStat/getPieChartData`, { params })
}
/**
* 图表3-各科室柱状折线图 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=32575a43-0b66-4e39-a681-68ef295b2b37
*/
export async function getDepartChart(params: any) {
return http.get(`/moduleStat/getDepartChart`, { params })
}
/** /**
* csr供应商月份列表 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb * csr供应商月份列表 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
*/ */

BIN
src/assets/images/NEW.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
src/assets/images/NEW2.gif Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 19 KiB

BIN
src/assets/images/dianhhh@2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.2 KiB

BIN
src/assets/images/fzqiet.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 501 KiB

BIN
src/assets/images/fzqiet2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 189 KiB

BIN
src/assets/images/wjqq@2x.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.4 KiB

7
src/components/AppHeadUserInfo.vue
View File

@ -14,7 +14,6 @@ const userCode = ref(false)
async function getNoticeList() { async function getNoticeList() {
const { data } = await getAllNoticeList() const { data } = await getAllNoticeList()
noticeData.value = data noticeData.value = data
console.log('🚀 ~ file: AppHeadUserInfo.vue:18 ~ data:', data)
} }
onMounted(() => { onMounted(() => {
getNoticeList() getNoticeList()
@ -22,9 +21,11 @@ onMounted(() => {
// console.log( flgs.value,flg) // console.log( flgs.value,flg)
}) })
watchEffect(() => { watchEffect(() => {
// console.log( flgs.value,store.user.type) // console.log( flgs.value,store.user.type, 'tech_service')
flgs.value = [1, 2, 3, 4].includes(store.user.type) flgs.value = [1, 2, 3, 4].includes(store.user.type)
userCode.value = ['admin', 'tech_service'].includes(store.user.roleCode) userCode.value = ['admin', 'tech_service', 'footprint_dandang'].includes(
store.user.roleCode
)
}) })
const options = [ const options = [
{ label: '个人中心', key: 'ucenter' }, { label: '个人中心', key: 'ucenter' },

14
src/router/index.ts
View File

@ -1,11 +1,11 @@
import { createRouter, createWebHistory } from "vue-router"; import { createRouter, createWebHistory } from 'vue-router'
const NewsDetail = { const NewsDetail = {
path: "/intelligence/:id", path: '/intelligence/:id',
meta: { title: "情报详情" }, meta: { title: '情报详情' },
name: "IntelligenceDetail", name: 'IntelligenceDetail',
component: () => import("@/views/home/intelligence/Detail.vue"), component: () => import('@/views/home/intelligence/Detail.vue')
}; }
const router = createRouter({ const router = createRouter({
history: createWebHistory(import.meta.env.BASE_URL), history: createWebHistory(import.meta.env.BASE_URL),
routes: [ routes: [
@ -548,4 +548,4 @@ const router = createRouter({
} }
] ]
}) })
export default router; export default router

272
src/utils/http.ts
View File

@ -1,26 +1,26 @@
import axios from 'axios' import axios from 'axios'
// import type { AxiosRequestConfig } from 'axios'; // import type { AxiosRequestConfig } from 'axios';
import { token } from "@/stores/modules/user"; import { token } from '@/stores/modules/user'
import { message } from "./message"; import { message } from './message'
import router from '@/router'; import router from '@/router'
export const TOKEN_KEY = 'token' export const TOKEN_KEY = 'token'
declare module 'axios' { declare module 'axios' {
export interface AxiosRequestConfig { export interface AxiosRequestConfig {
showLoading?: boolean showLoading?: boolean
// [自定义属性声明] // [自定义属性声明]
} }
} }
// const { createMessage, createWarningModal } = useMessage() // const { createMessage, createWarningModal } = useMessage()
// 创建axios实例 // 创建axios实例
const service = axios.create({ const service = axios.create({
// 服务接口请求 // 服务接口请求
baseURL: "/test-api", baseURL: '/test-api',
// 超时设置 // 超时设置
timeout: 15000, timeout: 15000,
headers: { 'Content-Type': 'application/json;charset=utf-8;' }, headers: { 'Content-Type': 'application/json;charset=utf-8;' },
showLoading: false showLoading: false
}) })
// let loading: any; // let loading: any;
@ -31,145 +31,143 @@ const service = axios.create({
let requestCount: number = 0 let requestCount: number = 0
//显示loading //显示loading
const showLoading = () => { const showLoading = () => {
if (requestCount === 0) { if (requestCount === 0) {
//加载中显示样式可以自行修改 //加载中显示样式可以自行修改
// loading = ElLoading.service({ // loading = ElLoading.service({
// text: "拼命加载中，请稍后...", // text: "拼命加载中，请稍后...",
// background: 'rgba(0, 0, 0, 0.7)', // background: 'rgba(0, 0, 0, 0.7)',
// spinner: 'el-icon-loading', // spinner: 'el-icon-loading',
// }) // })
message.loading('请求中...') message.loading('请求中...')
} }
requestCount++ requestCount++
} }
//隐藏loading //隐藏loading
const hideLoading = () => { const hideLoading = () => {
requestCount-- requestCount--
if (requestCount == 0) { if (requestCount == 0) {
// loading.close() // loading.close()
message.destroyAll() message.destroyAll()
} }
} }
// 请求拦截 // 请求拦截
service.interceptors.request.use( service.interceptors.request.use(
(config) => { (config) => {
// config.showLoading // config.showLoading
if (config.showLoading) { if (config.showLoading) {
showLoading() showLoading()
} }
if (token) config.headers[TOKEN_KEY] = unref(token); if (token) config.headers[TOKEN_KEY] = unref(token)
// if (getToken()) { // if (getToken()) {
// // 是否需要设置 token放在请求头 // // 是否需要设置 token放在请求头
// config.headers['token'] = getToken() // 让每个请求携带自定义token 请根据实际情况自行修改 // config.headers['token'] = getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
// } // }
// get请求映射params参数 // get请求映射params参数
if (config.method === 'get' && config.params) { if (config.method === 'get' && config.params) {
let url = config.url + '?' let url = config.url + '?'
for (const propName of Object.keys(config.params)) { for (const propName of Object.keys(config.params)) {
const value = config.params[propName] const value = config.params[propName]
const part = encodeURIComponent(propName) + '=' const part = encodeURIComponent(propName) + '='
if (value !== null && typeof value !== 'undefined') { if (value !== null && typeof value !== 'undefined') {
// 对象处理 // 对象处理
if (typeof value === 'object') { if (typeof value === 'object') {
for (const key of Object.keys(value)) { for (const key of Object.keys(value)) {
const params = propName + '[' + key + ']' const params = propName + '[' + key + ']'
const subPart = encodeURIComponent(params) + '=' const subPart = encodeURIComponent(params) + '='
url += subPart + encodeURIComponent(value[key]) + '&' url += subPart + encodeURIComponent(value[key]) + '&'
} }
} else { } else {
url += part + encodeURIComponent(value) + '&' url += part + encodeURIComponent(value) + '&'
} }
} }
} }
url = url.slice(0, -1) url = url.slice(0, -1)
config.params = {} config.params = {}
config.url = url config.url = url
} }
return config return config
}, },
(error) => { (error) => {
// console.log(error) // console.log(error)
Promise.reject(error) Promise.reject(error)
} }
) )
// 响应拦截器 // 响应拦截器
service.interceptors.response.use( service.interceptors.response.use(
async (response: any) => { async (response: any) => {
// console.log('响应拦截器res', response) // console.log('响应拦截器res', response)
// if (res.config.showLoading) { // if (res.config.showLoading) {
// showLoading() // showLoading()
// } // }
hideLoading() hideLoading()
// 未设置状态码则默认成功状态 // 未设置状态码则默认成功状态
const { data, status } = response; const { data, status } = response
if (data instanceof Blob || data instanceof ArrayBuffer) { if (data instanceof Blob || data instanceof ArrayBuffer) {
if (response.headers["content-disposition"]) { return {
const fileName = response.headers["content-disposition"] data,
?.split(";")[1] code: 200
?.split("=")[1]; }
return { if (response.headers['content-disposition']) {
data, const fileName = response.headers['content-disposition']
fileName, ?.split(';')[1]
}; ?.split('=')[1]
} } else {
else { return Promise.reject('没有访问权限')
return Promise.reject("没有访问权限"); }
} }
} const { errCode, code, msg } = data || {}
const { errCode, code, msg } = data || {}; const errMsg = data?.errMsg || data?.message || msg
const errMsg = data?.errMsg || data?.message || msg; // console.log(11, code, errMsg)
// console.log(11, code, errMsg)
if(code === 2000){
await router.push('/');
}
if (![0, 200].includes(code)) {
// if(errMsg==='用户未登录') if (code === 2000) {
// { message.error(errMsg);} await router.push('/')
// else if(errMsg==='密码不正确'){ }
// message.error(errMsg);
// }
// else if(errMsg==="账户信息查找为空"){
// message.error(errMsg);
// }
// else{ message.error("服务器升级维护中，请稍后重试！")}\
message.error(errMsg);
return Promise.reject(errMsg);
}
if (/^[4|5].*/.test(code || errCode || status)) { if (![0, 200].includes(code)) {
// console.error('> axios(interceptors.response): ', errMsg); // if(errMsg==='用户未登录')
message.error(errMsg); // { message.error(errMsg);}
// message.error("服务器访问过多，请稍后重试！"); // else if(errMsg==='密码不正确'){
// 处理未登录，token过期等 情况 // message.error(errMsg);
// if (code !== 404 && /^[4].*/.test(code || errCode || status)) { // }
// await app.fedLogout(); // else if(errMsg==="账户信息查找为空"){
// } // message.error(errMsg);
// }
return Promise.reject(data); // else{ message.error("服务器升级维护中，请稍后重试！")}\
} message.error(errMsg)
return data; return Promise.reject(errMsg)
}, }
(error) => {
// console.log('err' + error) if (/^[4|5].*/.test(code || errCode || status)) {
hideLoading() // console.error('> axios(interceptors.response): ', errMsg);
let { message } = error message.error(errMsg)
if (message == 'Network Error') { // message.error("服务器访问过多，请稍后重试！");
message = '后端接口连接异常' // 处理未登录，token过期等 情况
} else if (message.includes('timeout')) { // if (code !== 404 && /^[4].*/.test(code || errCode || status)) {
message = '系统接口请求超时' // await app.fedLogout();
} else if (message.includes('Request failed with status code')) { // }
message = '系统接口' + message.substr(message.length - 3) + '异常'
} return Promise.reject(data)
message.err("服务器升级维护中，请稍后重试！") }
return Promise.reject(error) return data
} },
(error) => {
// console.log('err' + error)
hideLoading()
let { message } = error
if (message == 'Network Error') {
message = '后端接口连接异常'
} else if (message.includes('timeout')) {
message = '系统接口请求超时'
} else if (message.includes('Request failed with status code')) {
message = '系统接口' + message.substr(message.length - 3) + '异常'
}
message.err('服务器升级维护中，请稍后重试！')
return Promise.reject(error)
}
) )
export default service export default service

13
src/utils/index.ts Normal file
View File

@ -0,0 +1,13 @@
import dayjs from 'dayjs'
import isSameOrAfter from 'dayjs/plugin/isSameOrAfter'
dayjs.extend(isSameOrAfter)
// dayjs.extend(isBefore)
function isNotOneWeekAgo(date: any) {
if (!date) return false
const oneWeekAgo = dayjs().subtract(1, 'week')
// console.log('🚀 ~ oneWeekAgo:', oneWeekAgo.format('YYYY-MM-DD'))
return dayjs(date).isSameOrAfter(oneWeekAgo, 'day')
}
export { isNotOneWeekAgo }

144
src/views/company/index.vue
View File

@ -4,29 +4,79 @@ import HomeHead from '@/views/home/components/HomeHead.vue'
// import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue' // import HomeHeadSearch from '@/views/home/components/HomeHeadSearch.vue'
import { useDate } from '@/views/home/hooks/useDate' import { useDate } from '@/views/home/hooks/useDate'
// import { NTimeline, NTimelineItem } from 'naive-ui' // import { NTimeline, NTimelineItem } from 'naive-ui'
import { useMessage } from 'naive-ui'
import { cateFileList } from '@/api/daikin/base'
const { day, week } = useDate() const { day, week } = useDate()
const { push } = useRouter() const { push } = useRouter()
const array = ref<any[]>([ const array = ref<any[]>([
{ content1: '将扩大的机遇转为成果 更强更大地展翅飞翔', content2: 'ひろがるチャンスを 成果につなげ 強く大きく 羽ばたこう', year: '2023年' }, {
{ content1: '领先时代的变化 开创崭新的未来', content2: '', year: '2022年' }, content1: '将扩大的机遇转为成果 更强更大地展翅飞翔',
{ content1: '以“重大变化”为契机 向新课题发起挑战', content2: '', year: '2021年' }, content2: 'ひろがるチャンスを 成果につなげ 強く大きく 羽ばたこう',
{ content1: '加速推进三个协创 决胜于变化的时代', content2: '', year: '2020年' }, year: '2023年'
{ content1: '以三个协创为轴心 人人迅速果断行动', content2: '', year: '2016年' }, },
{ content1: '突破壁垒 集中优势 不断挑战新课题', content2: '', year: '2018年' }, { content1: '领先时代的变化 开创崭新的未来', content2: '', year: '2022年' },
{ content1: '坚持以人为轴心，融合新的力量', content2: '集团上下齐心协力提升企业价值', year: '2017年' }, {
{ content1: '站稳脚跟 强化优势 大步迈进', content2: '', year: '2016年' }, content1: '以“重大变化”为契机 向新课题发起挑战',
{ content1: '创造未来，决胜于变化的时代', content2: '', year: '2015年' }, 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 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 goFile = () => {
const { isSelect, filePath } = fileItem.value
if (!isSelect || isSelect === 2) {
message.info('没有访问权限!')
return
}
if (!filePath) {
message.info('暂无文件')
}
window.open(filePath)
}
getFile()
</script> </script>
<template> <template>
<HomeHead class="top"> <HomeHead class="top">
<template #content> <template #content>
<!-- <HomeHeadSearch /> --> <!-- <HomeHeadSearch /> -->
</template> </template>
</HomeHead> </HomeHead>
<!-- <div class="h-full relative flex flex-col"> <!-- <div class="h-full relative flex flex-col">
<div class="font-600 flex items-end mt27px"> <div class="font-600 flex items-end mt27px">
<div class="text-36px">集团方针</div> <div class="text-36px">集团方针</div>
<div class="text-18px ml40px mr25px">{{ day }}</div> <div class="text-18px ml40px mr25px">{{ day }}</div>
@ -46,41 +96,49 @@ const array = ref<any[]>([
</div> </div>
</div> </div>
</div> --> </div> -->
<div class="mt30px mr20px flex w100%"> <div class="mt30px mr20px flex w100% relative">
<img src="../../assets/images/fangz.png" class="w100%"/> <!-- <img src="../../assets/images/fangz.png" class="w100%"/> -->
</div> <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>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
.top { .top {
position: absolute; position: absolute;
right: 30px; right: 30px;
top: -92px; top: -92px;
} }
.g-wrapper { .g-wrapper {
border-radius: 18px; border-radius: 18px;
border: 1px solid #E7EBF5; border: 1px solid #e7ebf5;
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32); box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
overflow: hidden; overflow: hidden;
.timeline { .timeline {
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
color: #142142; color: #142142;
.one { .one {
position: relative; position: relative;
.year{ .year {
left: -132px; left: -132px;
top: -14px; top: -14px;
color: #003CB7; color: #003cb7;
font-size: 26px; font-size: 26px;
font-weight: normal; font-weight: normal;
text-align: center; text-align: center;
line-height: 50px; line-height: 50px;
} }
} }
} }
} }
</style> </style>

14
src/views/extermal/ExternalHome.vue
View File

@ -589,6 +589,7 @@ const demandWithdraws = async (obj) => {
<img src="@/assets/images/logo.png" class="w197px h44px mt14px" /> <img src="@/assets/images/logo.png" class="w197px h44px mt14px" />
</div> </div>
<div <div
v-if="false"
class="beijing absolute flex left-[45%] translate-x-[-50%] top-11 text-[22px] items-center justify-center font-bold" class="beijing absolute flex left-[45%] translate-x-[-50%] top-11 text-[22px] items-center justify-center font-bold"
> >
<img src="./images/laba@2x.png" class="w-[48px] h-[45px] mr-4" alt="" /> <img src="./images/laba@2x.png" class="w-[48px] h-[45px] mr-4" alt="" />
@ -633,8 +634,7 @@ const demandWithdraws = async (obj) => {
" "
class="mr15px mt17px flex px5px pt6px" class="mr15px mt17px flex px5px pt6px"
@click="toList(7)" @click="toList(7)"
>更多<el-icon> >更多<el-icon> <DArrowRight class="" /> </el-icon
<DArrowRight class="" /> </el-icon
></span> ></span>
<div class="absolute right-25px top-20px"> <div class="absolute right-25px top-20px">
@ -713,8 +713,7 @@ const demandWithdraws = async (obj) => {
" "
class="mr15px mt2px flex px5px pt6px" class="mr15px mt2px flex px5px pt6px"
@click="toList(8)" @click="toList(8)"
>更多<el-icon> >更多<el-icon> <DArrowRight class="" /> </el-icon
<DArrowRight class="" /> </el-icon
></span> ></span>
</div> </div>
@ -1252,10 +1251,9 @@ const demandWithdraws = async (obj) => {
alt="" alt=""
style="margin-right: 50px" style="margin-right: 50px"
/> />
<p <p style="text-align: center; color: #dde5fd">
style="text-align: center; color: #dde5fd" 暂无供方留言
>暂无供方留言</p </p>
>
</div> </div>
<div <div
v-else v-else

1620
src/views/home/Home.vue
View File

File diff suppressed because it is too large Load Diff

428
src/views/home/components/New.vue
View File

@ -1,26 +1,30 @@
<script setup lang="ts"> <script setup lang="ts">
import { getArticlePage,report } from '@/api/daikin/base' import { getArticlePage, report } from '@/api/daikin/base'
import { message } from '@/utils/message' import { message } from '@/utils/message'
import { Swiper, SwiperSlide } from 'swiper/vue' import { Swiper, SwiperSlide } from 'swiper/vue'
import { Autoplay, Navigation, Pagination, A11y } from 'swiper' import { Autoplay, Navigation, Pagination, A11y } from 'swiper'
import { NCarousel } from 'naive-ui'; import { NCarousel } from 'naive-ui'
const route = useRoute() const route = useRoute()
const { push } = useRouter() const { push } = useRouter()
const listData = ref<any[]>([]) const listData = ref<any[]>([])
async function getPageList() { async function getPageList() {
const { code } = report({ moduleCode:'App_Article' }) const { code } = report({ moduleCode: 'App_Article' })
const { rows } = await getArticlePage({ pageNum: 1, pageSize: 10, type: 2, position: 'homePage' } as any); const { rows } = await getArticlePage({
// console.log(rows) pageNum: 1,
// for (let index = 0; index < 50; index++) { pageSize: 10,
listData.value.push(...rows) type: 2,
position: 'homePage'
// } } as any)
console.log(listData.value.length) // console.log(rows)
// for (let index = 0; index < 50; index++) {
listData.value = rows
// }
console.log(listData.value.length)
} }
onMounted(getPageList) onMounted(getPageList)
// console.log(listData) // console.log(listData)
// const toDetail2 =(n: { id: any; })=>{ // const toDetail2 =(n: { id: any; })=>{
@ -33,40 +37,82 @@ onMounted(getPageList)
// message.info("您没有权限查看！") // message.info("您没有权限查看！")
// } // }
// } // }
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('没有访问权限')
}
}
const modules = [Autoplay, Pagination, Navigation, A11y] const modules = [Autoplay, Pagination, Navigation, A11y]
</script> </script>
<template> <template>
<div class="card news cursor-pointer"> <div class="card news relative">
<div class="card_title" @click="push({ name: 'Intelligence' })">外部情报</div> <div
<div class="card_sub-title">责任者：调达研究院 研究企画T</div> class="card_title cursor-pointer hover:underline"
<div class="card_content"> @click="push({ name: 'Intelligence' })"
<div class="news_card w-437px flex items-end gap-12px text-#fff/80"> >
<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>
<div class="news_card_item i1 flex-1 w0 h100px p10px pt56px flex flex-col justify-around"> <div class="card_sub-title">责任者：调达研究院 研究企画T</div>
<img src="@/assets/images/WATCHING@2x.png" <div class="card_content px-20px pt-30px pb-0">
class="w41px h47px absolute left-40px top-25px animate__animated animate__infinite animate__heartBeat" /> <div
<img src="@/assets/images/WATCHING2@2x.png" class="w80px left-10px top-10px" /> class="news_card w-437px flex items-end gap-12px text-#fff/80 !absolute right--20% top--38% scale-50"
<!-- <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> <img
<div class="news_card_item i2 flex-1 w0 h120px p10px pt56px flex flex-col justify-around"> src="@/assets/images/bg-card6-text.svg"
<img src="@/assets/images/ALARM@2x.png" class="h26px absolute left-16px top-16px animate__animated animate__zoomIn animate__delay-2s animate__slower animate__repeat-2"
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" /> <div
<!-- <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> --> class="news_card_item i1 flex-1 w0 h100px p10px pt56px flex flex-col justify-around"
</div> >
<div class="news_card_item i3 w140px h160px p10px pt70px flex flex-col justify-around"> <img
<img src="@/assets/images/WARNING@2x.png" src="@/assets/images/WATCHING@2x.png"
class="w82px h66px absolute left-30px top-45px animate__animated animate__infinite animate__flipOutY" /> class="w41px h47px absolute left-40px top-25px animate__animated animate__infinite animate__heartBeat"
<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> --> <img
</div> src="@/assets/images/WATCHING2@2x.png"
</div> class="w80px left-10px top-10px"
<div class="card_title !pl0 !pt0" @click="push({ name: 'News' })">最新News</div> />
<div class="font-16px h-100px overflow-y-auto mt10px"> <!-- <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> -->
<!-- <n-carousel direction="vertical" dot-placement="right" style="width: 100%; height: 100px" autoplay :interval="1200" </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"
:slides-per-view="2" :space-between="0" :loop="false" mousewheel> :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" <div class="mt-10px" v-if="listData && Array.isArray(listData) && listData.length > 0" v-for="i in listData"
:key="i"> :key="i">
@ -77,178 +123,188 @@ const modules = [Autoplay, Pagination, Navigation, A11y]
</div> </div>
</n-carousel> --> </n-carousel> -->
<swiper id="swiperList2" v-if="listData" :slides-per-view="2" <swiper
:autoplay="{ delay: 1000, disableOnInteraction: false }" :speed="500" :space-between="0" :direction="'vertical'" id="swiperList2"
:scrollbar="{ draggable: false }" :loop="true" :modules="modules" style="height: 100px"> v-if="listData"
<swiper-slide v-for="(i, index) in listData" :key="index"> :slides-per-view="4"
<div class="mt-10px" > :autoplay="{ delay: 1000, disableOnInteraction: false }"
<div class="text-#142142 truncate text-16px"> :speed="500"
<a :href="i.url" class="no-underline text-#142142">{{ i.title}}</a> :space-between="10"
</div> :direction="'vertical'"
<div class="text-#808696 mt-8px text-14px"> :scrollbar="{ draggable: false }"
<span>来源于: {{ i.source }}</span> &nbsp;&nbsp;&nbsp;<span>{{i.publishTime }}</span> :loop="true"
</div> :modules="modules"
</div> style="height: 230px"
>
</swiper-slide> <swiper-slide v-for="(i, index) in listData" :key="index">
</swiper> <div class="mt-10px">
<div class="text-#142142 truncate text-16px">
<a
@click="toDetail2(i)"
</div> :href="i.url"
</div> class="no-underline text-#142142 cursor-pointer hover:underline"
</div> >{{ i.title }}</a
>
</div>
<div class="text-#808696 mt-8px text-14px">
<span>来源于: {{ i.source }}</span> &nbsp;&nbsp;&nbsp;<span>{{
i.publishTime
}}</span>
</div>
</div>
</swiper-slide>
</swiper>
</div>
</div>
</div>
</template> </template>
<style lang="less"> <style lang="less">
::-webkit-scrollbar { ::-webkit-scrollbar {
width: 1px; width: 1px;
} }
.card { .card {
// width: 480px; // width: 480px;
// height: 428px; // height: 428px;
width: 480px; width: 480px;
height: 395px; height: 395px;
border-radius: 18px; border-radius: 18px;
overflow: hidden; overflow: hidden;
background-color: #fff; background-color: #fff;
// border: 1px solid #e7ebf5; // border: 1px solid #e7ebf5;
box-shadow: 1px 2px 12px rgba(14, 86, 221, 0.32); box-shadow: 1px 2px 12px rgba(14, 86, 221, 0.32);
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
position: relative; position: relative;
&::after { &::after {
content: ' '; content: ' ';
background-image: url('@/assets/images/bg-card.svg'); background-image: url('@/assets/images/bg-card.svg');
pointer-events: none; pointer-events: none;
display: block; display: block;
width: 100%; width: 100%;
height: 127px; height: 127px;
background-size: cover; background-size: cover;
position: absolute; position: absolute;
left: 0; left: 0;
top: 0; top: 0;
} }
.card_title {
flex-shrink: 0;
font-size: 28px;
color: #142142;
padding: 20px;
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_title {
flex-shrink: 0;
font-size: 28px;
color: #142142;
padding: 20px;
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;
}
} }
.topics { .topics {
.item { .item {
border-radius: 8px; border-radius: 8px;
width: 210px; width: 210px;
height: 155px; height: 155px;
box-shadow: inset 1.4px 1.4px 0px 0px rgba(255, 255, 255, 0.004); box-shadow: inset 1.4px 1.4px 0px 0px rgba(255, 255, 255, 0.004);
overflow: hidden; overflow: hidden;
background-image: url('@/assets/images/bg-card4.svg'); background-image: url('@/assets/images/bg-card4.svg');
background-position: -2px -2px; background-position: -2px -2px;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: 215px 165px; background-size: 215px 165px;
position: relative; position: relative;
.item_title { .item_title {
padding-left: 16px; padding-left: 16px;
padding-top: 22px; padding-top: 22px;
color: #002fa7; color: #002fa7;
position: relative; position: relative;
// z-index: 9; // z-index: 9;
} }
.item_sub-title { .item_sub-title {
color: rgba(128, 134, 150, 0.8); color: rgba(128, 134, 150, 0.8);
font-size: 12px; font-size: 12px;
font-weight: normal; font-weight: normal;
padding: 0 16px; padding: 0 16px;
padding-bottom: 0; padding-bottom: 0;
margin-top: 10px; margin-top: 10px;
z-index: 9; z-index: 9;
} }
.item_img { .item_img {
position: absolute; position: absolute;
bottom: -10px; bottom: -10px;
right: 0; right: 0;
// z-index: 5; // z-index: 5;
transition: transform 0.3s; transition: transform 0.3s;
&:hover { &:hover {
transform: scale(1.2); transform: scale(1.2);
} }
} }
} }
} }
.news { .news {
.card_content { .card_content {
padding: 20px; // padding: 20px;
padding-top: 0; // padding-top: 0;
} }
.news_card { .news_card {
// width: 442px; // width: 442px;
height: 180px; height: 180px;
padding: 16px; padding: 16px;
font-size: 14px; font-size: 14px;
// background-image: url('./images/bg-card6.png'); // background-image: url('./images/bg-card6.png');
background-repeat: no-repeat; background-repeat: no-repeat;
// background-position: 0 0; // background-position: 0 0;
// background-size: cover; // background-size: cover;
background-size: 100% 100%; background-size: 100% 100%;
// border: 0px solid; // border: 0px solid;
// // padding: 0; // // padding: 0;
// border-width: 4px; // border-width: 4px;
// border-image-outset: 4px; // border-image-outset: 4px;
// // box-sizing: content-box; // // box-sizing: content-box;
// border-image-source: url('@/assets/images/bg-card6.svg'); // border-image-source: url('@/assets/images/bg-card6.svg');
// border-image-slice: 4 4 4 4; // border-image-slice: 4 4 4 4;
// border-image-repeat: round repeat; // border-image-repeat: round repeat;
position: relative; position: relative;
} }
.news_card_item { .news_card_item {
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
position: relative; position: relative;
border-radius: 10px; border-radius: 10px;
background-position: 0 4px; background-position: 0 4px;
&.i1 { &.i1 {
background-image: url('@/assets/images/bg-card6-11.svg'); background-image: url('@/assets/images/bg-card6-11.svg');
} }
&.i2 { &.i2 {
background-image: url('@/assets/images/bg-card6-21.svg'); background-image: url('@/assets/images/bg-card6-21.svg');
} }
&.i3 { &.i3 {
background-image: url('@/assets/images/bg-card6-31.svg'); background-image: url('@/assets/images/bg-card6-31.svg');
background-position: 0 10px; background-position: 0 10px;
} }
} }
} }
</style> </style>

219
src/views/home/csr/CSRContent2.vue
View File

@ -6,7 +6,8 @@ import AppBlock from '@/components/AppBlock.vue'
import { NIcon, useMessage, NCarousel } from 'naive-ui' import { NIcon, useMessage, NCarousel } from 'naive-ui'
import { ChevronBack, ChevronForward } from '@vicons/ionicons5' import { ChevronBack, ChevronForward } from '@vicons/ionicons5'
import { ElCarousel, ElCarouselItem } from 'element-plus' import { ElCarousel, ElCarouselItem } from 'element-plus'
import { NPopover } from 'naive-ui' import { NPopover } from 'naive-ui'
import { isNotOneWeekAgo } from '@/utils'
import { getFootprintList } from '@/api/daikin/base' import { getFootprintList } from '@/api/daikin/base'
@ -64,11 +65,11 @@ onMounted(async () => {
// }; // };
// }); // });
// } // }
swiperList.value = rows swiperList.value = rows
// if(rows.length>5 || rows.length < 3){ // if(rows.length>5 || rows.length < 3){
// }else{ // }else{
// swiperList.value = [...rows,...rows] // swiperList.value = [...rows,...rows]
// } // }
} }
// 碳足迹 // 碳足迹
getZu(1) getZu(1)
@ -194,6 +195,15 @@ const handleVisitsScoll = () => {
} }
} }
} }
const scroll = ({ scrollTop }: any) => {
const isAtBottom = scrollTop >= 400
if (isAtBottom) {
if (pageNum < maxMsgLingth) {
++pageNum
getZu(pageNum)
}
}
}
</script> </script>
<template> <template>
@ -232,24 +242,20 @@ const handleVisitsScoll = () => {
</div> </div>
<AppBlock class="w-full h325px box !b-0" style="box-shadow: none"> <AppBlock class="w-full h325px box !b-0" style="box-shadow: none">
<div class="w1200px px68px relative"> <div class="w1200px px68px relative">
<div <div class="swipe-nav nav-prev">
class="swipe-nav nav-prev"
>
<NIcon size="40" color="#537deb"> <NIcon size="40" color="#537deb">
<ChevronBack /> <ChevronBack />
</NIcon> </NIcon>
</div> </div>
<div <div class="swipe-nav nav-next">
class="swipe-nav nav-next"
>
<NIcon size="40" color="#537deb"> <NIcon size="40" color="#537deb">
<ChevronForward /> <ChevronForward />
</NIcon> </NIcon>
</div> </div>
<!-- :slides-per-group="3" --> <!-- :slides-per-group="3" -->
<!-- :autoplay="{delay: 3000, disableOnInteraction: false, pauseOnMouseEnter: true,stopOnLastSlide: false}" -->
<Swiper <Swiper
ref="swipeRef" ref="swipeRef"
:autoplay="{delay: 3000, disableOnInteraction: false, pauseOnMouseEnter: true,stopOnLastSlide: false}"
@swiper="setSwiperRef" @swiper="setSwiperRef"
class="h325px" class="h325px"
:slides-per-view="3" :slides-per-view="3"
@ -262,28 +268,34 @@ const handleVisitsScoll = () => {
:loop="true" :loop="true"
:navigation="{ :navigation="{
nextEl: '.nav-next', nextEl: '.nav-next',
prevEl: '.nav-prev', prevEl: '.nav-prev'
}" }"
> >
<template v-for="(i, index) in swiperList" :key="i"> <template v-for="(i, index) in swiperList" :key="index">
<SwiperSlide > <SwiperSlide>
<div
class="w340px h300px overflow-hidden bg-#F6F8FF mt10px relative rd-25px"
style="box-shadow: 0px 7px 12px 0px #e7e7e7"
>
<div <div
class="!bg-gradient-to-r !from-#5C87F5/90 !to-#466CCD/70 text-#fff px20px py15px text-18px truncates" class="w340px h300px overflow-hidden bg-#F6F8FF mt10px relative rd-25px"
style="box-shadow: 0px 7px 12px 0px #e7e7e7"
> >
活动{{ index + 1 }}： <div
{{ i.title }} class="flex items-center !bg-gradient-to-r !from-#5C87F5/90 !to-#466CCD/70 text-#fff font-[500] font-bold px20px py15px text-18px truncates"
>
<img
v-if="isNotOneWeekAgo(i.createTime)"
src="@/assets/images/NEW.gif"
class="h-20px"
alt=""
/>
活动{{ index + 1 }}:
<span>{{ i.title }}</span>
<!-- <span class="float-right"><el-icon> <!-- <span class="float-right"><el-icon>
<ArrowRightBold /> <ArrowRightBold />
</el-icon></span> --> </el-icon></span> -->
</div> </div>
<div class="overflow-hidden w-full h-196px z-10"> <div class="overflow-hidden w-full h-206px z-10">
<!-- <el-carousel <!-- <el-carousel
autoplay autoplay
indicator-position="none" indicator-position="none"
arrow="never" arrow="never"
@ -300,64 +312,70 @@ const handleVisitsScoll = () => {
/> />
</el-carousel-item> </el-carousel-item>
</el-carousel> --> </el-carousel> -->
<n-carousel <n-carousel
draggable draggable
autoplay autoplay
trigger="hover" trigger="hover"
mousewheel mousewheel
effect="fade" effect="fade"
:interval="5000" :interval="5000"
:loop="true" :loop="true"
> class="overflow-hidden box-border"
<img
v-if="i.imgUrl"
v-for="ite in i.imgUrl"
:src="ite.url"
class="p10px w-full max-h-200px image-container overflow-hidden"
/>
</n-carousel>
</div>
<!-- <img :src="i.imgPath" class="p10px w-full max-h-180px rd-10px" @click="toDetail(i)" /> -->
<div
class="left-0 right-0 bottom-0 text-#000 text-left px16px py6px z-100"
>
<div class="max-w500px text-12px flex flex-col">
<div class="flex items-center">
<img
src="../../../assets/images/lvbiao@2x.png"
class="mr-5px"
/>
<n-popover trigger="hover" placement="top-start" >
<template #trigger>
<span
class="truncate text-16px"
@click="toDetail(i)"
> {{ i.filePath[0]?.originalFileName }}
</span>
</template>
<div class="text-18px leading-40px">
{{ i.filePath[0]?.originalFileName }}
</div>
</n-popover>
</div>
<div
v-if="i.filePath.length > 1"
title="查看更多"
@click="toDetail(i)"
class="cursor-pointer right--20px top-0px w60px pt-6px flex items-center ml-auto text-right"
style="
color: #4d7ee8;
text-align: center;
font-size: 14px;
"
> >
更多<el-icon> <div
<DArrowRight class="" /> class="w-full h-200px overflow-hidden p10px"
</el-icon> v-if="i.imgUrl"
</div> v-for="ite in i.imgUrl"
<!-- <el-dropdown max-height="100px" @command="down"> >
<img
:src="ite.url"
class="w-full max-h-200px image-container overflow-hidden"
/>
</div>
</n-carousel>
</div>
<!-- <img :src="i.imgPath" class="p10px w-full max-h-180px rd-10px" @click="toDetail(i)" /> -->
<div
class="absolute left-0 right-0 bottom-14px text-#000 text-18px text-left px16px py6px z-100 transition-none"
>
<div class="max-w500px text-16px flex flex-col">
<div class="flex items-center max-w-[84%]">
<img
src="../../../assets/images/lvbiao@2x.png"
class="mr-5px"
/>
<n-popover trigger="hover" placement="top-start">
<template #trigger>
<span
class="truncate text-18px !min-w-[auto]"
@click="toDetail(i)"
>
{{ i.filePath[0]?.originalFileName }}
</span>
</template>
<div class="text-18px leading-40px">
{{ i.filePath[0]?.originalFileName }}
</div>
</n-popover>
</div>
<div
v-if="i.filePath.length >= 1"
title="查看更多"
@click="toDetail(i)"
class="absolute cursor-pointer right--14px top-0px w60px pt-3px flex items-center ml-auto text-right"
style="
color: #4d7ee8;
text-align: center;
font-size: 16px;
"
>
更多<el-icon>
<DArrowRight class="" />
</el-icon>
</div>
<!-- <el-dropdown max-height="100px" @command="down">
<el-icon size="25"> <el-icon size="25">
<CaretBottom /> <CaretBottom />
</el-icon> </el-icon>
@ -372,11 +390,11 @@ const handleVisitsScoll = () => {
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
</el-dropdown> --> </el-dropdown> -->
</div>
</div> </div>
</div> </div>
</div> </SwiperSlide>
</SwiperSlide> </template>
</template>
</Swiper> </Swiper>
</div> </div>
</AppBlock> </AppBlock>
@ -414,25 +432,42 @@ const handleVisitsScoll = () => {
>更多<el-icon> <DArrowRight class="" /> </el-icon >更多<el-icon> <DArrowRight class="" /> </el-icon
></span> ></span>
<!-- <div ref="msgScoll" class="px20px h280px cent_box overflow-y-scroll "> --> <!-- <div ref="msgScoll" class="px20px h280px cent_box overflow-y-scroll "> -->
<div ref="msgScoll" class="px20px h280px cent_box overflow-y-scroll"> <!-- <div
ref="msgScoll"
class="px20px h280px cent_box overflow-y-scroll"
> -->
<el-scrollbar
class="px20px"
ref=""
height="280px"
always
@scroll="scroll"
>
<!-- <div class="text-#808696 bg-#F4F8FF py10px rd-5px mt10px" v-for="(i, key) in dataList" :key="i"> --> <!-- <div class="text-#808696 bg-#F4F8FF py10px rd-5px mt10px" v-for="(i, key) in dataList" :key="i"> -->
<div <div
class="text-#808696 bg-#F4F8FF py10px rd-5px mt10px" class="text-#808696 bg-#F4F8FF py10px rd-5px mt10px"
v-for="(i, key) in dataList" v-for="(i, key) in dataList"
:key="i" :key="i"
> >
<div class="truncate2" @click="toDetail(i)"> <div class="truncate2 flex items-center" @click="toDetail(i)">
<span <span
class="text-#fff bg-#407DF1 px5px text-18px rounded-20px mr-5px inlineFlex" class="text-#fff bg-#407DF1 px5px text-18px rounded-20px mr-5px inlineFlex"
>{{ ++key }}</span >{{ ++key }}</span
> >
<span class="text-18px">{{ i.title }}</span> <span class="text-18px mr-2">{{ i.title }}</span>
<img
v-if="isNotOneWeekAgo(i.createTime)"
src="@/assets/images/NEW.gif"
class="h-20px"
alt=""
/>
</div> </div>
<span class="absolute right-10px top-24px text-18px">{{ <span class="absolute right-10px top-24px text-18px">{{
i.createTime i.createTime
}}</span> }}</span>
</div> </div>
</div> </el-scrollbar>
<!-- </div> -->
</div> </div>
<div class="w-50% h-375px bg-#fff float-left ml-1%"> <div class="w-50% h-375px bg-#fff float-left ml-1%">
<div class="text-24px font-bold p20px">碳足迹平台</div> <div class="text-24px font-bold p20px">碳足迹平台</div>

694
src/views/home/csr/CSRContent23.vue
View File

@ -1,289 +1,493 @@
<script setup lang="ts"> <script setup lang="ts">
// import {message} from '@/utils/message' // import {message} from '@/utils/message'
import {fetchCsrSupplier,fetchCsrSupplierList,fetchCsrSupplierTopList,fetchCsrSupplierTaskInfo} from '@/api/daikin/base' import {
fetchCsrSupplier,
fetchCsrSupplierList,
fetchCsrSupplierTopList,
fetchCsrSupplierTaskInfo
} from '@/api/daikin/base'
const query = ref<any>({ const query = ref<any>({
year: '', year: '',
supplierName:'' supplierName: ''
}) })
query.value.year = new Date().getFullYear() + '' const year = new Date().getFullYear()
const calendar = [4,5,6,7,8,9,10,11,12,1,2,3] const month = new Date().getMonth()
const jpMonth = (month < 3 ? year - 1 : year) + ''
query.value.year = jpMonth
const calendar = [4, 5, 6, 7, 8, 9, 10, 11, 12, 1, 2, 3]
const calendarShow = new Date().getMonth() + 1 const calendarShow = new Date().getMonth() + 1
const nowIndexMonth = calendar.indexOf(calendarShow) const nowIndexMonth = calendar.indexOf(calendarShow)
const updateTime = ref(''); const updateTime = ref('')
const handleChange = () => { const handleChange = () => {
getCsrSupplier() getCsrSupplier()
getCsrSupplierList() getCsrSupplierList()
} }
const isDateDisabled = (date:any) => { const isDateDisabled = (date: any) => {
return date > new Date() return date > new Date()
} }
const csrSupplier = ref<any>([]) const csrSupplier = ref<any>([])
const csrSupplierObj = ref<any>({}); const csrSupplierObj = ref<any>({})
const months = ['04','05','06','07','08','09','10','11','12','01','02','03'] const months = [
'04',
const getCsrSupplier = ()=>{ '05',
months.forEach((item:any)=>{ '06',
csrSupplierObj.value[item] = {month:item} '07',
}) '08',
const req = {...query.value} '09',
fetchCsrSupplier(req).then(({data={}})=>{ '10',
const resData = Object.keys(data) || [] '11',
try { '12',
csrSupplier.value = resData.length ? resData.map(key => { '01',
const obj = data[key] || {} '02',
const month = String(key).split('-')?.[1] || '' '03'
Object.assign(csrSupplierObj.value[month], obj) ]
return { const loading = ref(false)
key, const getCsrSupplier = () => {
month, loading.value = true
data: obj, months.forEach((item: any) => {
} csrSupplierObj.value[item] = { month: item }
}) : [] })
} catch (error) { const req = { ...query.value }
} fetchCsrSupplier(req).then(({ data = {} }) => {
console.log("🚀 ~ file: CSRContent23.vue:50 ~ csrSupplierObj:", csrSupplierObj) const resData = Object.keys(data) || []
if(!csrSupplier.value.length) { try {
// message.warning('暂无数据') csrSupplier.value = resData.length
csrSupplierObj.value = {} ? 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 csrSupplierList = ref<any>([])
const selMonth = ref('') const selMonth = ref('')
const getCsrSupplierList = (index?:any) => { const getCsrSupplierList = (index?: any) => {
const month = (index || index=== 0) ? query.value.year +'-'+ months[index] : '' const month =
csrSupplierList.value = [] index || index === 0 ? query.value.year + '-' + months[index] : ''
selMonth.value = '' csrSupplierList.value = []
const req = {pageNum:1,pageSize:10,...query.value,month} selMonth.value = ''
req.supplierName ? fetchCsrSupplierList(req).then((res : any)=>{ const req = { pageNum: 1, pageSize: 10, ...query.value, month }
csrSupplierList.value = (res.rows || []).filter((item:any) => item.submitunCount > 0) req.supplierName
}) : fetchCsrSupplierTopList(req).then((res : any)=>{ ? fetchCsrSupplierList(req).then((res: any) => {
csrSupplierList.value = (res.rows || []).filter((item:any) => item.submitunCount > 0) csrSupplierList.value = (res.rows || []).filter(
}); (item: any) => item.submitunCount > 0
selMonth.value = month ? +months[index] + '月' : '' )
})
: fetchCsrSupplierTopList(req).then((res: any) => {
csrSupplierList.value = (res.rows || []).filter(
(item: any) => item.submitunCount > 0
)
})
selMonth.value = month ? +months[index] + '月' : ''
} }
const getCsrSupplierTaskInfo = ()=>{ const getCsrSupplierTaskInfo = () => {
fetchCsrSupplierTaskInfo().then((res)=>{ fetchCsrSupplierTaskInfo().then((res) => {
updateTime.value = res.data?.updateTime updateTime.value = res.data?.updateTime
}) })
} }
const handleMonth = (index:number) => { const handleMonth = (index: number) => {
getCsrSupplierList(index) getCsrSupplierList(index)
} }
getCsrSupplier() getCsrSupplier()
getCsrSupplierList() getCsrSupplierList()
getCsrSupplierTaskInfo() getCsrSupplierTaskInfo()
</script> </script>
<template> <template>
<div class="flex w-full rounded-18px"> <div class="flex w-full rounded-18px">
<!-- <AppBlock> --> <!-- <AppBlock> -->
<!-- <img src="./images/goudongxi2.png" class="w-full h-full" /> --> <!-- <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
<div class="relative overflow-hidden w-full bg-#f4f4f4 flex flex-wrap justify-between h-full rd-25px"
v-if="false" >
class="absolute flex flex-col w-full h-full z-100 top-0 left-0 text-center bg-red justify-center items-center" <div class="cards">
style="background-color: rgba(255, 255, 255, 0.8)" <div class="cards_title">供方月度碳排放数据提交情况</div>
> <div class="!text-18px right-20 pt30px text-#4E7EE8">
<img src="@/assets/images/chah.png" class="h-300px object-contain" /> <a
<br /> href="https://procurement.daikin.net.cn/mingdao/portal/app/7abea528-f7b4-4437-84bb-6b6b169bad3d"
<div class="text-#5683DB text-46px mt-10">【做成中,敬请期待】</div> class="no-underline text-#4E7EE8"
</div> ><img src="./images/yuny@2x.png" class="w25px mr5px mt--4px" /><span
<div class="cards"> >明道云</span
<div class="cards_title">供方月度碳排放数据提交情况</div> ></a
<div class="!text-18px right-20 pt30px text-#4E7EE8 "> >
<a href="https://procurement.daikin.net.cn/mingdao/portal/app/7abea528-f7b4-4437-84bb-6b6b169bad3d" </div>
class="no-underline text-#4E7EE8 "><img src="./images/yuny@2x.png" <div class="flex w-full h-80px p20px items-center mt10px">
class="w25px mr5px mt--4px" /><span>明道云</span></a> <div>
</div> <el-date-picker
<div class="flex w-full h-80px p20px items-center mt10px"> v-model="query.year"
<div> type="year"
<el-date-picker v-model="query.year" type="year" @change="handleChange" placeholder="" :disabled-date="isDateDisabled" :clearable="false" value-format="YYYY" /> @change="handleChange"
</div> placeholder=""
<el-input v-model.trim="query.supplierName" class="w-50 m-2" placeholder="供方名" prefix-icon="Search" width="150px"/> :disabled-date="isDateDisabled"
<el-button type="primary" @click="handleChange">查询</el-button> :clearable="false"
</div> value-format="YYYY"
<div class="w-full h-730px p20px"> />
<el-row :gutter="10" v-if="false"> </div>
<el-col :span="8"><div class="times" > <el-input
<div class="text-#fff text-18px font-bold absolute left-40% top-18px"><span class="text-30px">1</span>月</div> v-model.trim="query.supplierName"
<div class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15%">已提交：45</div> class="w-50 m-2"
<div class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15%">未提交：100</div> placeholder="供方名"
</div></el-col> prefix-icon="Search"
<el-col :span="8"><div class="time" > width="150px"
<div class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"><span class="text-60px">2</span>月</div> />
</div></el-col> <el-button type="primary" @click="handleChange">查询</el-button>
<el-col :span="8"><div class="time"> </div>
<div class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"><span class="text-60px">3</span>月</div> <div class="w-full h-730px p20px" v-loading="loading">
</div></el-col> <el-row :gutter="10" v-if="false">
</el-row> <el-col :span="8"
<el-row :gutter="10"> ><div class="times">
<el-col :span="8" v-for="(it,i) in months" :key="i"> <div
<div :class=" i <= nowIndexMonth ? 'times' : 'time'" @click="handleMonth(i)" > class="text-#fff text-18px font-bold absolute left-40% top-18px"
<div v-if="i > nowIndexMonth" class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"><span class="text-60px">{{ +it }}</span>月</div> >
<template v-if="i <= nowIndexMonth"> <span class="text-30px">1</span>月
<div class="text-#fff text-18px font-bold absolute left-40% top-24px"><span class="text-24px">{{ +it }}</span>月</div> </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
<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> class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15%"
</template> >
</div> 已提交：45
</el-col> </div>
<el-col :span="8" v-if="false"><div class="time" > <div
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">5</span>月</div> class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15%"
<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> 未提交：100
<div class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15% rounded-xl">未提交：100</div> </div>
</template> </div></el-col
</div></el-col> >
<el-col :span="8" v-if="false"><div class="time"> <el-col :span="8"
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">6</span>月</div> ><div class="time">
</div></el-col> <div
</el-row> class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"
<el-row :gutter="10" v-if="false"> >
<el-col :span="8"><div class="time" > <span class="text-60px">2</span>月
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">7</span>月</div> </div>
</div></el-col> </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> <el-col :span="8"
</div></el-col> ><div class="time">
<el-col :span="8"><div class="times"> <div
<!-- <div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">9</span>月</div> --> class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"
<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> <span class="text-60px">3</span>月
<div class="bg-#fff w-140px absolute top-110px text-red text-18px font-bold p10px left-10% rounded-xl">未提交：100</div> </div>
</div></el-col> </div></el-col
</el-row> >
<el-row :gutter="10" v-if="false"> </el-row>
<el-col :span="8"><div class="time" > <el-row :gutter="10">
<div class="text-#d3d2d2 text-18px font-bold absolute left-30% top-45%"><span class="text-60px">10</span>月</div> <el-col :span="8" v-for="(it, i) in months" :key="i">
</div></el-col> <div
<el-col :span="8"><div class="time" > v-show="!loading"
<div class="text-#d3d2d2 text-18px font-bold absolute left-30% top-45%"><span class="text-60px">11</span>月</div> :class="
</div></el-col> i <= nowIndexMonth && query.year == jpMonth ? 'times' : 'time'
<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> @click="handleMonth(i)"
</div></el-col> >
</el-row> <div
<el-row :gutter="10" v-if="false"> v-if="i > nowIndexMonth || query.year != jpMonth"
<el-col :span="8"><div class="time" > class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">1</span>月</div> >
<template v-if="false"> <span class="text-60px">{{ +it }}</span
<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>
</template> <template
</div></el-col> v-if="
<el-col :span="8"><div class="time" > i <= nowIndexMonth &&
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">2</span>月</div> (query.year == jpMonth || !!csrSupplierObj[it])
</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
</div></el-col> class="text-#fff text-18px font-bold absolute left-40% top-24px"
</el-row> >
</div> <span class="text-24px">{{ +it }}</span
</div> >月
<div class="cards"> </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="cards_title relative">未提交供应商明细({{query.year}}年{{ selMonth }})</div> <!-- </AppBlock> -->
<div class="absolute top-24px !text-18px right-20px pt30px text-#4E7EE8 "> </div>
<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>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
.cards { .cards {
width: 49%; width: 49%;
height: 100%; height: 100%;
border-radius: 18px; border-radius: 18px;
background-color: #ffffff; background-color: #ffffff;
box-shadow: 1px 2px 12px rgba(14, 86, 221, 0.32); box-shadow: 1px 2px 12px rgba(14, 86, 221, 0.32);
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
} }
.time{ .time {
width: 175px; width: 175px;
height: 175px; height: 175px;
background: url('@/assets/images/A2@2x.png'); background: url('@/assets/images/A2@2x.png');
background-size: cover; background-size: cover;
} }
.times{ .times {
width: 175px; width: 175px;
height: 175px; height: 175px;
background: url('@/assets/images/A1@2x.png'); background: url('@/assets/images/A1@2x.png');
background-size: cover; background-size: cover;
} }
.cards_title { .cards_title {
flex-shrink: 0; flex-shrink: 0;
font-size: 26px; font-size: 26px;
color: #142142; color: #142142;
padding: 20px; padding: 20px;
margin-left: 20px; margin-left: 20px;
font-weight: bold; font-weight: bold;
padding-bottom: 0; padding-bottom: 0;
&::before {
content: " ";
display: block;
width: 8px;
height: 30px;
background-color: #003ab5;
position: absolute; &::before {
left: 0; content: ' ';
} display: block;
width: 8px;
height: 30px;
background-color: #003ab5;
position: absolute;
left: 0;
}
} }
.truncate2 { .truncate2 {
max-width:360px; max-width: 360px;
min-width:360px; min-width: 360px;
overflow: hidden; overflow: hidden;
padding: 5px 10px; padding: 5px 10px;
line-height: 30px; line-height: 30px;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
color: #142142; color: #142142;
cursor: pointer; cursor: pointer;
a { a {
text-decoration: none text-decoration: none;
} }
} }
:deep{ :deep {
.el-empty__description > p{ .el-empty__description > p {
font-size: 28px !important; font-size: 28px !important;
} }
} }
</style> </style>

1046
src/views/home/csr/modifyCSR2.vue
View File

File diff suppressed because it is too large Load Diff

48
src/views/home/database/Process.vue
View File

@ -16,7 +16,7 @@ import {
} from '@/api/daikin/base' } from '@/api/daikin/base'
import { noticeld } from '@/stores/modules/noticeId' import { noticeld } from '@/stores/modules/noticeId'
import { databaseld } from '@/stores/modules/database' import { databaseld } from '@/stores/modules/database'
import { NTag, useMessage, NModal } from 'naive-ui' import { NTag, useMessage, NModal, NPopover } from 'naive-ui'
import { ArrowDown, Check, Close } from '@element-plus/icons-vue' import { ArrowDown, Check, Close } from '@element-plus/icons-vue'
const store = noticeld() const store = noticeld()
const store2 = useUserStore() const store2 = useUserStore()
@ -88,6 +88,10 @@ async function getPageList(cateId: any = database.database.id) {
const handleEditClick = async () => { const handleEditClick = async () => {
const row = { ...editObj.value } const row = { ...editObj.value }
if (!row) return if (!row) return
if (!row.cateId) {
message.error('所属类别不能为空！')
return
}
let url: any[] = [] let url: any[] = []
if (row.fileList && row.fileList.length > 0) { if (row.fileList && row.fileList.length > 0) {
row.fileList.forEach((index: any) => { row.fileList.forEach((index: any) => {
@ -289,10 +293,17 @@ const CloseThiss = (data?: boolean) => {
// setUserList.value = [] // setUserList.value = []
} }
const downloads = (data: any) => { // const arr = [1706, 1416, 1415, 1414, 1413, 1412, 1411, 1410, 1386, 1388, 1391]
// downloadFile(data.filePath)
if (data && data.filePath) { const downloads = (data: any = {}) => {
window.open(data.filePath) const { fileCommon, filePath } = data
if ((fileCommon?.fileSize || 0) > 25 * 1024 * 1024) {
message.info('正在下载中，请稍等～')
downloadFile(filePath)
return
}
if (filePath) {
window.open(filePath)
// window.open("https://view.officeapps.live.com/op/view.aspx?src=" + encodeURIComponent(data.filePath)) // window.open("https://view.officeapps.live.com/op/view.aspx?src=" + encodeURIComponent(data.filePath))
} else { } else {
message.info('没有可预览文件！') message.info('没有可预览文件！')
@ -475,9 +486,29 @@ function getParentIds(id: number, list: any[] = tableData.value): any {
<!-- <el-button style="color: #000" @click="openUrl(row)" <!-- <el-button style="color: #000" @click="openUrl(row)"
>预览</el-button >预览</el-button
> --> > -->
<el-button style="color: #000" @click="downloads(row)" <div class="inline-block">
>查看</el-button <n-popover
> trigger="hover"
placement="top-start"
v-if="(row.fileCommon?.fileSize || 0) > 25 * 1024 * 1024"
>
<template #trigger>
<el-button style="color: #000" @click="downloads(row)"
>查看</el-button
>
</template>
<span
>该文件超过25MB，无法进行预览，请点击 查看
进行下载！</span
>
</n-popover>
<el-button
v-else
style="color: #000"
@click="downloads(row)"
>查看</el-button
>
</div>
<el-dropdown <el-dropdown
v-if="activeName === 1 && isDbReview" v-if="activeName === 1 && isDbReview"
trigger="click" trigger="click"
@ -508,6 +539,7 @@ function getParentIds(id: number, list: any[] = tableData.value): any {
<el-button <el-button
v-if="activeName > 2 && isDbUpload" v-if="activeName > 2 && isDbUpload"
type="primary" type="primary"
class="ml-16px"
@click="editClick(row)" @click="editClick(row)"
> >
编辑</el-button 编辑</el-button

51
src/views/home/database/guize/index.vue
View File

@ -13,7 +13,10 @@ import {
fetchdbAuthGetInfo fetchdbAuthGetInfo
} from '@/api/daikin/base' } from '@/api/daikin/base'
import { useUserStore } from '@/stores/modules/user' import { useUserStore } from '@/stores/modules/user'
import { useMessage, NModal } from 'naive-ui' import { useMessage, NModal, NPopover } from 'naive-ui'
import { isNotOneWeekAgo } from '@/utils'
// console.log('🚀 ~ isNotOneWeekAgo:', isNotOneWeekAgo('2024-1-16'))
const store: any = useUserStore() const store: any = useUserStore()
const message = useMessage() const message = useMessage()
const userCode = ['admin', 'database_dandang'].includes(store.user.roleCode) const userCode = ['admin', 'database_dandang'].includes(store.user.roleCode)
@ -75,17 +78,21 @@ async function getTree() {
// // message.error('下载文件出错：', error); // // message.error('下载文件出错：', error);
// } // }
// } // }
const arr = [1706, 1416, 1415, 1414, 1413, 1412, 1411, 1410, 1386, 1388, 1391]
async function downloads(row: any) { async function downloads(row: any) {
console.log(row, '!!!!!!!!!!xiazai') // console.log('xiazai', row)
const { isSelect, filePath } = row const { isSelect, filePath, id, fileCommon } = row
if (isSelect === 2) { if (isSelect === 2) {
message.info('没有访问权限') message.info('没有访问权限')
return return
} }
// try{ if (arr.includes(id) || (fileCommon?.fileSize || 0) > 25 * 1024 * 1024) {
// downloadFile(filePath) try {
// }catch(error){ message.info('正在下载中，请稍等～')
// } downloadFile(filePath)
} catch (error) {}
}
// window.open( // window.open(
// 'https://view.officeapps.live.com/op/view.aspx?src=' + // 'https://view.officeapps.live.com/op/view.aspx?src=' +
// encodeURIComponent(filePath) // encodeURIComponent(filePath)
@ -301,7 +308,15 @@ async function getAuth() {
<td <td
class="w20% h50px cursor-pointer overflow-hidden text-left pl25px truncate text-#000" class="w20% h50px cursor-pointer overflow-hidden text-left pl25px truncate text-#000"
> >
<span :title="it.title"> {{ it.title }}</span> <div class="flex items-center truncate">
<img
v-if="isNotOneWeekAgo(it.createTime)"
src="@/assets/images/NEW.gif"
class="!h-20px !w-auto mr-2"
alt=""
/>
<span :title="it.title"> {{ it.title }}</span>
</div>
</td> </td>
<td class="w20% h50px">{{ it.deptName }}</td> <td class="w20% h50px">{{ it.deptName }}</td>
<td class="w20% h50px">{{ it.parentDeptName }}</td> <td class="w20% h50px">{{ it.parentDeptName }}</td>
@ -309,7 +324,25 @@ async function getAuth() {
<td class="w20% h50px"> <td class="w20% h50px">
<!-- <el-button style="color: #000;" @click="openUrl(it)">预览</el-button> --> <!-- <el-button style="color: #000;" @click="openUrl(it)">预览</el-button> -->
<!-- <el-button style="color: #000;" @click="downloads(it)">下载</el-button> --> <!-- <el-button style="color: #000;" @click="downloads(it)">下载</el-button> -->
<el-button style="color: #000" @click="downloads(it)" <n-popover
trigger="hover"
placement="top-start"
v-if="
arr.includes(it.id) ||
(it.fileCommon?.fileSize || 0) > 25 * 1024 * 1024
"
>
<template #trigger>
<el-button style="color: #000" @click="downloads(it)"
>查看</el-button
>
</template>
<span
>该文件超过25MB，无法进行预览，请点击 查看
进行下载！</span
>
</n-popover>
<el-button v-else style="color: #000" @click="downloads(it)"
>查看</el-button >查看</el-button
> >
</td> </td>

95
src/views/home/database/index.vue
View File

@ -23,12 +23,17 @@ function menuHandler(menu: any, index: number) {
if (menu.childList && menu.childList.length > 0) { if (menu.childList && menu.childList.length > 0) {
activeItem.value = menu.childList[0].id 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 database.database.id = activeItem.value
goListPage() goListPage()
} }
function goChild(menu: any) { function goChild(menu: any) {
activeItem.value = menu.id activeItem.value = menu.id
console.log(menu.id)
database.database.id = menu.id database.database.id = menu.id
goListPage() goListPage()
} }
@ -52,17 +57,31 @@ async function getTree() {
// activeMenuKey.value = data[0].childList[0].id // activeMenuKey.value = data[0].childList[0].id
// } // }
} }
if (activeItem.value) { const { id } = route.query
const { topLevelItem, targetItem } = findItemById(data, activeItem.value) if (id) {
if (topLevelItem && targetItem) { const index = data.findIndex((i: any) => i.id == id)
const index = data.findIndex((i: any) => i.id === topLevelItem.id) if (index > -1) {
nextTick(() => { const item = data[index]
onClic.value = true if (item) {
menuHandler(topLevelItem, index === -1 ? 0 : index) menuHandler(item, index)
goChild(targetItem) // 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)
// 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)
// })
// }
// }
} }
getTree() getTree()
@ -100,7 +119,7 @@ function findItemById(
<div class="pt30px pb24px flex-1 pl20px bg-#fff"> <div class="pt30px pb24px flex-1 pl20px bg-#fff">
<div <div
class="nav px36px py24px m10px mr0 rd-32px rd-r-0 flex flex-col text-#000 cursor-pointer" class="nav px50px py24px m10px mr0 rd-32px rd-r-0 flex flex-col text-#000 cursor-pointer"
v-for="(m, index) in tableData" v-for="(m, index) in tableData"
:key="m.id" :key="m.id"
:class=" :class="
@ -110,9 +129,9 @@ function findItemById(
> >
<div <div
:class="activeMenuKey === m.id && 'onActive'" :class="activeMenuKey === m.id && 'onActive'"
class="flex" class="flex relative"
@click="onClic = !onClic"
> >
<!-- @click="!!m.childList?.length ? (onClic = !onClic) : ''" -->
<!-- <img v-if="activeMenuKey === m.id" :src="m.icon1" class="w22px h22px mr16px mt--5px" /> <!-- <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" /> --> <img v-else :src="m.icon" class="w22px h22px mr16px mt--5px" /> -->
<!-- lujinli --> <!-- lujinli -->
@ -127,6 +146,12 @@ function findItemById(
/> />
<CaretBottom v-else /> </el-icon <CaretBottom v-else /> </el-icon
></span> ></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> </span>
</div> </div>
@ -165,22 +190,31 @@ function findItemById(
@click.stop="goChild(ite)" @click.stop="goChild(ite)"
@click="activeItem = ite.id" @click="activeItem = ite.id"
> >
<n-popover trigger="hover" placement="top-start"> <div class="relative">
<template #trigger> <n-popover trigger="hover" placement="top-start">
<span <template #trigger>
class="text-18px flex childs font-900 truncate" <span
:class="activeItem === ite.id ? 'text-#002fa7' : ''" class="text-18px flex childs font-900 truncate"
>{{ ite.name }}</span :class="activeItem === ite.id ? 'text-#002fa7' : ''"
> >{{ ite.name }}</span
</template> >
<div class="text-18px leading-40px"> </template>
{{ ite.name }} <div class="text-18px leading-40px">
</div> {{ ite.name }}
</n-popover> </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 v-if="ite.childList && idx == index" class="pl10px">
<div <div
class="my20px py-10px pl10px text-#000" class="my20px py-10px pl10px text-#000 relative"
v-for="(it, ind) in ite.childList" v-for="(it, ind) in ite.childList"
:key="item.id" :key="item.id"
@click.stop="goChild(it)" @click.stop="goChild(it)"
@ -198,6 +232,13 @@ function findItemById(
{{ it.name }} {{ it.name }}
</div> </div>
</n-popover> </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>
@ -285,7 +326,7 @@ function findItemById(
background-color: #e6ecff; background-color: #e6ecff;
border-radius: 32px 0 0 32px; border-radius: 32px 0 0 32px;
padding: 24px 36px 24px 36px; padding: 24px 36px 24px 50px;
} }
} }
} }

39
src/views/home/database/modify.vue
View File

@ -272,7 +272,6 @@
<el-tab-pane label="权限管理" name="three" v-if="userCode"> <el-tab-pane label="权限管理" name="three" v-if="userCode">
<div class="h-52px"> <div class="h-52px">
<el-button <el-button
v-if="isDbReview || isDbUpload"
type="primary" type="primary"
@click="handleAuthClick('add')" @click="handleAuthClick('add')"
class="mb-20px" class="mb-20px"
@ -400,7 +399,7 @@
width="180px" width="180px"
> >
<template #default="scope"> <template #default="scope">
<div v-if="userCode"> <div>
<el-button <el-button
type="primary" type="primary"
@click="handleAuthClick('edit', scope.row)" @click="handleAuthClick('edit', scope.row)"
@ -436,8 +435,8 @@
v-model:page-size="pageInfo.pageSize" v-model:page-size="pageInfo.pageSize"
layout="prev, pager, next, jumper" layout="prev, pager, next, jumper"
:total="pageInfo.total" :total="pageInfo.total"
@size-change="handleSizeChange" @size-change="getAuth"
@current-change="handleCurrentChange" @current-change="getAuth"
/> />
</div> </div>
</el-tab-pane> </el-tab-pane>
@ -486,10 +485,10 @@
<el-form-item label="查看范围"> <el-form-item label="查看范围">
<el-button <el-button
class="button" class="button"
@click="getUser" @click="() => getUser(editB)"
:type="userData ? 'success' : ''" :type="editB.userList?.length ? 'success' : ''"
:icon="userData ? 'Check' : ''" :icon="editB.userList?.length ? 'Check' : ''"
>{{ userData ? '已设置' : '设置' }}</el-button >{{ editB.userList?.length ? '已设置' : '设置' }}</el-button
> >
</el-form-item> </el-form-item>
@ -530,7 +529,7 @@
<el-form-item label="上传人员" class="w-300px"> <el-form-item label="上传人员" class="w-300px">
<el-button <el-button
class="button" class="button"
@click="getUser({ userList: uploadIds, key: 'uploadIds' })" @click="() => getUser({ userList: uploadIds, key: 'uploadIds' })"
:type="authModel.uploadIds?.length ? 'success' : ''" :type="authModel.uploadIds?.length ? 'success' : ''"
:icon="authModel.uploadIds?.length ? 'Check' : ''" :icon="authModel.uploadIds?.length ? 'Check' : ''"
>{{ authModel.uploadIds?.length ? '已设置' : '设置' }}</el-button >{{ authModel.uploadIds?.length ? '已设置' : '设置' }}</el-button
@ -540,7 +539,7 @@
<el-form-item label="审核人员" class="w-300px"> <el-form-item label="审核人员" class="w-300px">
<el-button <el-button
class="button" class="button"
@click="getUser({ userList: reviewIds, key: 'reviewIds' })" @click="() => getUser({ userList: reviewIds, key: 'reviewIds' })"
:type="authModel.reviewIds?.length ? 'success' : ''" :type="authModel.reviewIds?.length ? 'success' : ''"
:icon="authModel.reviewIds?.length ? 'Check' : ''" :icon="authModel.reviewIds?.length ? 'Check' : ''"
>{{ authModel.reviewIds?.length ? '已设置' : '设置' }}</el-button >{{ authModel.reviewIds?.length ? '已设置' : '设置' }}</el-button
@ -746,7 +745,8 @@ async function addClickA(row: any) {
shomkA.value = false shomkA.value = false
getTree() getTree()
} }
const editClickB = (edit: any, obj: any = {}) => { const editClickB = (edit: any, data: any = {}) => {
const obj = JSON.parse(JSON.stringify(data))
if (edit === 'add' && obj && obj.id) { if (edit === 'add' && obj && obj.id) {
editB.value = { editB.value = {
title: '', title: '',
@ -818,7 +818,6 @@ const deleteClickB = async (row: any) => {
getInfo('') getInfo('')
} }
async function addClickB(row: any) { async function addClickB(row: any) {
console.log(row, deptId.value)
if (!row) return if (!row) return
let url: any[] = [] let url: any[] = []
if (row.fileList && row.fileList.length > 0) { if (row.fileList && row.fileList.length > 0) {
@ -841,6 +840,10 @@ async function addClickB(row: any) {
}) })
row.userIdList = list row.userIdList = list
} }
// if (row.userIdList?.length > 0) {
// row.userIdList = row.userIdList.join(',')
// }
// console.log('🚀 ~ row:', row)
if (!row.cateId) { if (!row.cateId) {
message.error('所属类别不能为空！') message.error('所属类别不能为空！')
return return
@ -922,9 +925,11 @@ const handleChild = async (data: any) => {
console.log(data, 444) console.log(data, 444)
const { showModal: show, multipleSelection } = data const { showModal: show, multipleSelection } = data
showModal.value = unref(show) || false showModal.value = unref(show) || false
let userIdList: any[] = [] let userIdList: any[] = [],
multipleSelection.value.forEach((i: { userId: any }) => { userList: any = []
multipleSelection.value.forEach((i: { userId: any; nickName: string }) => {
userIdList.push(i.userId) userIdList.push(i.userId)
userList.push({ nickName: i.nickName, userId: i.userId })
}) })
if (authModel.value && selSetAuthKey.value) { if (authModel.value && selSetAuthKey.value) {
authModel.value[selSetAuthKey.value] = userIdList authModel.value[selSetAuthKey.value] = userIdList
@ -952,6 +957,7 @@ const handleChild = async (data: any) => {
console.log(flg.value) console.log(flg.value)
} }
editB.value.userIdList = userIdList editB.value.userIdList = userIdList
editB.value.userList = userList
if (userIdList.length > 0) { if (userIdList.length > 0) {
userData.value = true userData.value = true
console.log(userIdList, 8888) console.log(userIdList, 8888)
@ -1026,8 +1032,11 @@ const setReview = ref(false)
const hasReview = ref(false) const hasReview = ref(false)
async function getAuth() { async function getAuth() {
if (!cateIds.value) return if (!cateIds.value) return
const { pageSize, currentPage } = pageInfo
const { rows: data = [] }: any = await fetchdbAuthGetInfo({ const { rows: data = [] }: any = await fetchdbAuthGetInfo({
cateId: cateIds.value cateId: cateIds.value,
pageSize,
pageNum: currentPage
// type: 1 // type: 1
}) })
// 所有的上传者 和 审核者 // 所有的上传者 和 审核者

1519
src/views/home/diffspace/Overview.vue
View File

File diff suppressed because it is too large Load Diff

1493
src/views/home/diffspace/fack.vue
View File

File diff suppressed because it is too large Load Diff

270
src/views/home/footprint/index.vue
View File

@ -8,12 +8,17 @@ import {
fetchPostList, fetchPostList,
fetchmoduleStatInternalPage, fetchmoduleStatInternalPage,
fetchInternalUserStat, fetchInternalUserStat,
deptTree as fetchDeptTree deptTree as fetchDeptTree,
userDetailExport,
getDepartData,
getPieChartData,
getDepartChart
} from '@/api/daikin/base' } from '@/api/daikin/base'
import { formatDate } from '@/utils/format' import { formatDate } from '@/utils/format'
import { Chart1 } from './indexData' import { Chart1, barEchart, pieEchart } from './indexData'
import { Search } from '@element-plus/icons-vue' import { Search, Download } from '@element-plus/icons-vue'
import { NModal } from 'naive-ui' import { NModal,useMessage } from 'naive-ui'
const message = useMessage()
const currentDate = new Date() const currentDate = new Date()
const currentDates = new Date() const currentDates = new Date()
const value1 = ref<[Date, Date]>([ const value1 = ref<[Date, Date]>([
@ -27,11 +32,11 @@ const states = reactive<any>({
}) })
const chartRef1 = ref() const chartRef1 = ref()
const chartRef2 = ref() const chartRef2 = ref()
const chartOption1 = ref({}) const chartOption1 = ref<any>({})
const chartOption2 = ref({}) const chartOption2 = ref({})
const primary = ref(1) const primary = ref(1)
const primarys = ref(2) const primarys = ref(2)
const activeName = ref('inside') const activeName = ref('echart')
const pageInfo = reactive({ const pageInfo = reactive({
currentPage: 1, currentPage: 1,
pageSize: 10, pageSize: 10,
@ -66,6 +71,7 @@ const outDetail = ref([])
const postId = ref<any>([]) const postId = ref<any>([])
const nickName = ref() const nickName = ref()
const postList = ref<any>([]) const postList = ref<any>([])
const showEchart = ref(true)
const barOption = { const barOption = {
width: '100%', width: '100%',
height: '100%', height: '100%',
@ -128,11 +134,27 @@ const barOption = {
] ]
} }
const itemDataList = ref<any>([]) const itemDataList = ref<any>([])
const barChartRef = ref<any>(null)
const barChartOption = ref<any>({})
const pieChartRef = ref<any>(null)
const pieChartOption = ref<any>({})
const departData = ref<any>([])
const visitType = ref('1')
const externalList = ref<any>([])
const externalObj = ref<any>({})
const colorListObj = ref<any>({})
const dataList = ref([])
const getPostList = async () => { const getPostList = async () => {
const res: any = await fetchPostList() const res: any = await fetchPostList()
postList.value = res.data || [] postList.value = res.data || []
} }
const state = reactive<any>({
startTime: formatDate(value1.value[0]).substring(0, 10),
endTime: formatDate(value1.value[1]).substring(0, 10)
// timeType:1
})
const getInsideListPage = async () => { const getInsideListPage = async () => {
const res: any = await fetchmoduleStatInternalPage({ const res: any = await fetchmoduleStatInternalPage({
postId: postId.value, postId: postId.value,
@ -157,9 +179,40 @@ const getListPage = async () => {
pageInfo.total = res?.total || 0 pageInfo.total = res?.total || 0
} }
const getBarEchart = async () => {
const res = await getDepartChart({ ...state, visitType: visitType.value })
barChartOption.value = barEchart(res.data || {})
}
const getPieEchart = async () => {
const res = await getPieChartData({ ...state, visitType: visitType.value })
pieChartOption.value = pieEchart(res.data || [], unref(colorListObj))
}
const getEchartTable = async (moduleCode = '') => {
const { currentPage, pageSize } = pageInfo
const res = await getDepartData({
...state,
visitType: visitType.value,
pageNum: currentPage,
pageSize: pageSize,
moduleCode
})
departData.value = res.data || []
// res.data && res.data.length && getEchartTable(res.data[0].moduleCode)
}
const chartClick = (it: any) => {
const { _code } = it.data
getEchartTable(_code)
}
const getEchartData = async () => {
getBarEchart()
getPieEchart()
getEchartTable()
}
getPostList() getPostList()
getListPage() // getListPage()
getInsideListPage() // getInsideListPage()
const clickButton = (id) => { const clickButton = (id) => {
primary.value = id primary.value = id
@ -180,13 +233,6 @@ const timenFirsts = (value) => {
console.log(value) console.log(value)
} }
const state = reactive<any>({
startTime: formatDate(value1.value[0]).substring(0, 10),
endTime: formatDate(value1.value[1]).substring(0, 10)
// timeType:1
})
const colorListObj = ref<any>({})
const dataList = ref([])
const getDat = async () => { const getDat = async () => {
const { data } = await timeStat(state) const { data } = await timeStat(state)
dataList.value = data dataList.value = data
@ -212,7 +258,8 @@ const getDat = async () => {
}, },
type: 'bar' type: 'bar'
} }
getInternalUserStat(1) barChartOption.value = barEchart(xAxisData, colorList)
getInternalUserStat(isLeaderFlag)
} }
const deptId = ref('') const deptId = ref('')
@ -283,8 +330,6 @@ async function getInternalUserStat(
}) })
} }
const externalList = ref<any>([])
const externalObj = ref<any>({})
const getExternalTimeStat = async () => { const getExternalTimeStat = async () => {
const { data } = await externalTimeStat(state) const { data } = await externalTimeStat(state)
externalList.value = data externalList.value = data
@ -314,21 +359,40 @@ const getExternalTimeStat = async () => {
// chartOption2.value.height=3000 // chartOption2.value.height=3000
// chartOption2.value.width=1000 // chartOption2.value.width=1000
} }
const handleClick = ({ paneName }: any, down: Boolean = false) => {
pageInfo.currentPage = 1
pageInfo.pageSize = 10
pageInfo.total = 0
paneName === 'echart' && getEchartData()
paneName === 'out' && getExternalTimeStat()
paneName === 'inside' && getDat()
paneName === 'out-detail' && getListPage()
paneName === 'inside-detail' && getInsideListPage()
paneName === 'inside' &&
setTimeout(() => {
showEchart.value = true
}, 300)
}
const ss = computed(() => [state.startTime, state.endTime, state.timeType]) const ss = computed(() => [state.startTime, state.endTime, state.timeType])
watch( watch(
() => unref(ss), () => unref(ss),
async (v) => { async (v) => {
console.log(state.type) // getDat()
getDat() // getExternalTimeStat()
getExternalTimeStat() handleClick({ paneName: activeName.value })
}, },
{ immediate: true, deep: true } { immediate: true, deep: true }
) )
onMounted(() => { onMounted(() => {
// getDat() // getDat()
// console.log(formatDate(value1.value[0]).substring(0, 10)) // console.log(formatDate(value1.value[0]).substring(0, 10))
}) })
// onBeforeMount(async () => {
// await getDat()
// await getExternalTimeStat()
// })
const shortcuts = [ const shortcuts = [
{ {
text: '今天', text: '今天',
@ -402,14 +466,38 @@ const shortcuts = [
} }
] ]
const handleClick = ({ paneName }: any) => { const downloadExcel = (data: any, name: string) => {
pageInfo.currentPage = 1 const blob = new Blob([data], {
pageInfo.pageSize = 10 // type: 'application/vnd.ms-excel'
pageInfo.total = 0 })
paneName === 'out' && getExternalTimeStat() const downloadElement = document.createElement('a')
paneName === 'inside' && getDat() downloadElement.style.display = 'none'
paneName === 'out-detail' && getListPage() const downloadUrl = URL.createObjectURL(blob)
paneName === 'inside-detail' && getInsideListPage() downloadElement.href = downloadUrl
downloadElement.download = `${name}.xlsx`
document.body.appendChild(downloadElement)
downloadElement.click()
document.body.removeChild(downloadElement)
URL.revokeObjectURL(downloadUrl)
// if (navigator.userAgent.indexOf('Chrome') > -1) {
// window.open(downloadUrl)
// }
// if (navigator.userAgent.indexOf('Firefox') > -1) {
// window.open(URL.createObjectURL(blob))
// }
}
const downExcel = async () => {
const res = await userDetailExport({
...state,
visitType: activeName.value === 'inside-detail' ? 1 : 2
})
let name = activeName.value === 'inside-detail' ? '本部足迹' : '外部足迹'
name = name + state.startTime + '-' + state.endTime
if (res.code === 200) {
downloadExcel(res.data, name)
return message.success('导出成功！')
}
} }
const selValue = ref('') const selValue = ref('')
@ -487,7 +575,11 @@ getdeptTree()
<span class="text-#000 mr-10px">日期: </span> <span class="text-#000 mr-10px">日期: </span>
<div class="max-w-350px flex items-center"> <div class="max-w-350px flex items-center">
<el-date-picker <el-date-picker
v-if="['inside', 'out', 'inside-detail'].includes(activeName)" v-if="
['inside', 'out', 'inside-detail', 'echart', 'out-detail'].includes(
activeName
)
"
v-model="value1" v-model="value1"
type="daterange" type="daterange"
range-separator="到" range-separator="到"
@ -506,6 +598,12 @@ getdeptTree()
clearable clearable
/> />
</div> </div>
<div class="mx-4 flex items-center" v-if="'echart' === activeName">
<el-select v-model="visitType" placeholder="本部/外部">
<el-option label="本部足迹" value="1" />
<el-option label="外部部足迹" value="2" />
</el-select>
</div>
<div <div
class="mx-4 flex items-center" class="mx-4 flex items-center"
v-if="['inside-detail', 'out-detail'].includes(activeName)" v-if="['inside-detail', 'out-detail'].includes(activeName)"
@ -561,10 +659,19 @@ getdeptTree()
type="primary" type="primary"
:icon="Search" :icon="Search"
size="small" size="small"
class="ml20px mt--5px" class="ml20px"
@click="handleClick({ paneName: activeName })" @click="handleClick({ paneName: activeName })"
>搜索</el-button >搜索</el-button
> >
<el-button
v-if="activeName === 'out-detail' || activeName === 'inside-detail'"
type="warning"
:icon="Download"
size="small"
class="!ml40px"
@click="downExcel"
>导出 Excel</el-button
>
<template v-if="activeName !== 'inside' && false"> <template v-if="activeName !== 'inside' && false">
<el-select <el-select
v-model="selValue" v-model="selValue"
@ -588,6 +695,77 @@ getdeptTree()
@click="clickButton(3)">本月</el-button> --> @click="clickButton(3)">本月</el-button> -->
</div> </div>
<el-tabs class="mt-20px" v-model="activeName" @tab-click="handleClick"> <el-tabs class="mt-20px" v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="足迹可视化图表" name="echart">
<div class="h-720px overflow-auto w-full">
<div class="flex">
<div class="w-50% h-720px mb-30px">
<VChart
@click="chartClick"
key="bar"
ref="barChartRef"
:option="pieChartOption"
autoresize
/>
</div>
<div class="h-720px w50%">
<div class="w100% h-full overflow-auto">
<el-table
:data="departData"
style="width: 100%; margin-bottom: 20px; height: 700px"
row-key="id"
border
default-expand-all
:header-cell-style="{
background: '#2A7BF7',
color: '#fff',
height: '60px',
lineHeight: '60px',
textAlign: 'center',
'font-size': '24px'
}"
:cell-style="{
'text-align': 'center',
'overflow-y': 'auto',
height: '60px'
}"
>
<el-table-column prop="moduleName" label="模块名称" />
<el-table-column
prop="deptName"
label="职位名称"
show-overflow-tooltip
>
</el-table-column>
<el-table-column
label="访问次数"
prop="visitCount"
show-overflow-tooltip
/>
</el-table>
</div>
<!-- <div class="absolute bottom-2px right-30px z-20 bg-#fff">
<el-pagination
v-model:current-page="pageInfo.currentPage"
v-model:page-size="pageInfo.pageSize"
layout="prev, pager, next, jumper"
:total="pageInfo.total"
@size-change="getInsideListPage"
@current-change="getInsideListPage"
/>
</div> -->
</div>
</div>
<div class="w-full h-720px mt-30px">
<VChart
key="yyyxx"
ref="pieChartRef"
:option="barChartOption"
autoresize
/>
</div>
</div>
</el-tab-pane>
<el-tab-pane label="本部足迹" name="inside"> <el-tab-pane label="本部足迹" name="inside">
<div class="overflow-auto h-720px"> <div class="overflow-auto h-720px">
<div class="mt20px w-full"> <div class="mt20px w-full">
@ -618,7 +796,13 @@ getdeptTree()
</div> </div>
</div> --> </div> -->
<div class="w-full h-400px mt-10px"> <div class="w-full h-400px mt-10px">
<VChart key="yyy" ref="chartRef1" :option="chartOption1" /> <VChart
key="yyy"
ref="chartRef1"
:option="chartOption1"
v-if="showEchart"
autoresize
/>
</div> </div>
<div class="mt-30px"> <div class="mt-30px">
<div class="flex items-center"> <div class="flex items-center">
@ -662,16 +846,16 @@ getdeptTree()
> >
</div> </div>
<div class="pb-14px"> <div class="pb-14px">
<div class="flex flex-wrap mb-30px"> <div class="flex justify-between flex-wrap mb-30px">
<div <div
class="m-4 flex items-center justify-between w-45% h-full" class="m-4 flex items-center justify-between w-45% h-full"
v-for="(item, i) in itemDataList" v-for="(item, i) in itemDataList"
:key="i" :key="i"
> >
<div class="flex items-center text-#000 text-18px"> <div class="flex items-center text-#000 text-18px">
<p class="text-bold text-40px mr-15px w-80px"> <!-- <p class="text-bold text-40px mr-15px w-80px">
{{ sortArr[item.sortNum - 1] || item.sortNum + 'TH' }} {{ sortArr[item.sortNum - 1] || item.sortNum + 'TH' }}
</p> </p> -->
<div class="mx-10px flex-col items-center"> <div class="mx-10px flex-col items-center">
<img <img
v-if="item.sex == 1" v-if="item.sex == 1"
@ -688,7 +872,12 @@ getdeptTree()
<p class="text-center mt-20px">{{ item.nickName }}</p> <p class="text-center mt-20px">{{ item.nickName }}</p>
</div> </div>
</div> </div>
<VChart class="h-300px w-65% ml-auto" :option="item" /> <VChart
class="h-300px w-85% ml-auto"
:option="item"
v-if="showEchart"
autoresize
/>
</div> </div>
</div> </div>
<div class="absolute bottom-2px right-30px z-20 bg-#fff"> <div class="absolute bottom-2px right-30px z-20 bg-#fff">
@ -847,7 +1036,12 @@ getdeptTree()
<div class="mt10px w-full"> <div class="mt10px w-full">
<div class="w-full h-400px"> <div class="w-full h-400px">
<VChart key="xxxx" ref="chartRef2" :option="chartOption2" /> <VChart
key="xxxx"
ref="chartRef2"
:option="chartOption2"
autoresize
/>
</div> </div>
</div> </div>
</div> </div>

265
src/views/home/footprint/indexData.ts
View File

@ -1,26 +1,25 @@
import {timeStat } from '@/api/daikin/base' import { timeStat } from '@/api/daikin/base'
import type { EChartsOption } from 'echarts' import type { EChartsOption } from 'echarts'
import * as echarts from 'echarts' import * as echarts from 'echarts'
import {formatDate} from '@/utils/format' import { formatDate } from '@/utils/format'
const currentDate = new Date(); const currentDate = new Date()
const currentDates = new Date(); const currentDates = new Date()
const value1 = ref<[Date, Date]>([ const value1 = ref<[Date, Date]>([
currentDate.setMonth(currentDate.getMonth() ), currentDate.setMonth(currentDate.getMonth()),
new Date() new Date()
]) ])
const value2 = ref<[Date, Date]>([ const value2 = ref<[Date, Date]>([
currentDates.setMonth(currentDates.getMonth() ), currentDates.setMonth(currentDates.getMonth()),
new Date() new Date()
]) ])
const states = reactive<any>({ const states = reactive<any>({
startTime:formatDate(value1.value[0]).substring(0,10), startTime: formatDate(value1.value[0]).substring(0, 10),
endTime: formatDate(value1.value[1]).substring(0,10), endTime: formatDate(value1.value[1]).substring(0, 10)
// timeType:2, // timeType:2,
}) })
// export function Chart1() { // export function Chart1() {
// const chartRef = ref() // const chartRef = ref()
@ -63,7 +62,7 @@ const states = reactive<any>({
// data: siomesData, // data: siomesData,
// color: '#8F97F8', // color: '#8F97F8',
// type: 'bar', // type: 'bar',
// } // }
// ] // ]
// } // }
@ -122,3 +121,243 @@ export function Chart1(xAxisData: any = [], color = []) {
return { ...option } 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)'
}
}
}
]
}
}
// data:{
// '科室':['科室一','科室二','科室三'],
// 'HP访问次数':['科室一访问次数','科室二访问次数','科室三访问次数'],
// '平均活跃度（人员平均访问次数）':['科室一平均活跃度','科室二平均活跃度','科室三平均活跃度'],
// }
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)'
// }
// }
}
}

454
src/views/home/intelligence/Detail.vue
View File

@ -1,167 +1,167 @@
<!-- 外部情报 > 情报详情 --> <!-- 外部情报 > 情报详情 -->
<script setup lang="ts"> <script setup lang="ts">
import AppBlock from "@/components/AppBlock.vue"; import AppBlock from '@/components/AppBlock.vue'
import AppNewsBox from "@/components/AppNewsBox.vue"; import AppNewsBox from '@/components/AppNewsBox.vue'
import Layout from "./components/Layout.vue"; import Layout from './components/Layout.vue'
import DetailNews from "./DetailNews.vue"; import DetailNews from './DetailNews.vue'
import { import {
getArticleDetail, getArticleDetail,
getArticlePage, getArticlePage,
getManagerDetail, getManagerDetail
} from "@/api/daikin/base"; } from '@/api/daikin/base'
import { message } from "@/utils/message"; import { message } from '@/utils/message'
const { push } = useRouter(); const { push } = useRouter()
const route = useRoute(); const route = useRoute()
const SideNews = [ const SideNews = [
{ key: "IntelligenceOutside", name: "社外情报" }, { key: 'IntelligenceOutside', name: '社外情报' },
{ key: "IntelligenceWithin", name: "社内情报" }, { key: 'IntelligenceWithin', name: '社内情报' }
]; ]
const state = ref<any>({}); const state = ref<any>({})
async function getData() { async function getData() {
const { id, flag } = route.params; const { id, flag } = route.params
console.log(typeof(flag)) console.log(typeof flag)
if (!id) return; if (!id) return
if (flag==='true') { if (flag === 'true') {
// 驳回&撤回 // 驳回&撤回
const { data } = await getManagerDetail(id as string); const { data } = await getManagerDetail(id as string)
data.tagColor = data.tag === "紧急" ? "#e60e0e" : "#2cba06"; data.tagColor = data.tag === '紧急' ? '#e60e0e' : '#2cba06'
data.content = unescapeHTML(data.content); data.content = unescapeHTML(data.content)
state.value = data; state.value = data
} else { } else {
const { data } = await getArticleDetail(id as string); const { data } = await getArticleDetail(id as string)
data.tagColor = data.tag === "紧急" ? "#e60e0e" : "#2cba06"; data.tagColor = data.tag === '紧急' ? '#e60e0e' : '#2cba06'
data.content = unescapeHTML(data.content); data.content = unescapeHTML(data.content)
state.value = data; state.value = data
} }
} }
function unescapeHTML(html: string) { function unescapeHTML(html: string) {
const doc = new DOMParser().parseFromString(html, "text/html"); const doc = new DOMParser().parseFromString(html, 'text/html')
return doc.documentElement.textContent; return doc.documentElement.textContent
} }
async function getDatas(id: string) { async function getDatas(id: string) {
if (!id) return; if (!id) return
const { data } = await getArticleDetail(id as string); const { data } = await getArticleDetail(id as string)
data.content = unescapeHTML(data.content); data.content = unescapeHTML(data.content)
state.value = data; state.value = data
} }
async function toDetail2(n: { id: any }) { async function toDetail2(n: { id: any }) {
console.log(route, route.path, n.id); console.log(route, route.path, n.id)
if (n.id === 0) return; if (n.id === 0) return
if (n.isSelect === 1) { if (n.isSelect === 1) {
getDatas(n.id); getDatas(n.id)
} else { } else {
message.info("您没有权限查看！"); message.info('您没有权限查看！')
} }
} }
getData(); getData()
getPageList(1); getPageList(1)
getPageLists(1); getPageLists(1)
const neiScoll = ref<HTMLElement | null>(null); const neiScoll = ref<HTMLElement | null>(null)
const waiScoll = ref<HTMLElement | null>(null); const waiScoll = ref<HTMLElement | null>(null)
onMounted(() => { onMounted(() => {
neiScoll.value?.addEventListener("scroll", handleNeiScoll); neiScoll.value?.addEventListener('scroll', handleNeiScoll)
waiScoll.value?.addEventListener("scroll", handlewaiScoll); waiScoll.value?.addEventListener('scroll', handlewaiScoll)
}); })
const listData = ref<any[]>([]); const listData = ref<any[]>([])
let neiLength: number; let neiLength: number
let neiPum = 1; let neiPum = 1
async function getPageList(page) { async function getPageList(page) {
const pasr = { const pasr = {
pageNum: page, pageNum: page,
pageSize: 6, pageSize: 5,
type: 2, type: 2,
position: "recommend", position: 'recommend'
}; }
const { rows, total } = await getArticlePage(pasr); const { rows, total } = await getArticlePage(pasr)
neiLength = total / 6; neiLength = total / 6
listData.value.push(...rows); listData.value.push(...rows)
console.log(listData.value); console.log(listData.value)
} }
const listDatas = ref<any[]>([]); const listDatas = ref<any[]>([])
let waiLength: number; let waiLength: number
let waiPum = 1; let waiPum = 1
async function getPageLists(page) { async function getPageLists(page) {
const pasr = { const pasr = {
pageNum: page, pageNum: page,
pageSize: 6, pageSize: 5,
type: 1, type: 1,
position: "recommend", position: 'recommend'
}; }
const { rows, total } = await getArticlePage(pasr); const { rows, total } = await getArticlePage(pasr)
waiLength = total / 6; waiLength = total / 6
listDatas.value.push(...rows); listDatas.value.push(...rows)
} }
const handleNeiScoll = () => { const handleNeiScoll = () => {
const container = neiScoll.value; const container = neiScoll.value
if (container) { if (container) {
const isAtBottom = const isAtBottom =
container.scrollHeight - container.scrollTop === container.clientHeight; container.scrollHeight - container.scrollTop === container.clientHeight
if (isAtBottom) { if (isAtBottom) {
if (neiPum < neiLength) { if (neiPum < neiLength) {
++neiPum; ++neiPum
getPageList(neiPum); getPageList(neiPum)
} }
} }
} }
}; }
const handlewaiScoll = () => { const handlewaiScoll = () => {
const container = waiScoll.value; const container = waiScoll.value
if (container) { if (container) {
const isAtBottom = const isAtBottom =
container.scrollHeight - container.scrollTop === container.clientHeight; container.scrollHeight - container.scrollTop === container.clientHeight
if (isAtBottom) { if (isAtBottom) {
if (waiPum < waiLength) { if (waiPum < waiLength) {
++waiPum; ++waiPum
getPageList(waiPum); getPageList(waiPum)
} }
} }
} }
}; }
</script> </script>
<template> <template>
<Layout> <Layout>
<div class="page-wrap h-834px"> <div class="page-wrap h-834px">
<div class="page-main"> <div class="page-main">
<AppBlock class="h-full"> <AppBlock class="h-full">
<div class="overflow-y-auto h-full"> <div class="overflow-y-auto h-full">
<div class="px46px py40px"> <div class="px46px py40px">
<DetailNews <DetailNews
:title="state.title" :title="state.title"
:content="state.content" :content="state.content"
:publishTime="state.publishTime" :publishTime="state.publishTime"
:tag="state.tag" :tag="state.tag"
:tagColor="state.tagColor" :tagColor="state.tagColor"
:source="state.source" :source="state.source"
/> />
</div> </div>
</div> </div>
</AppBlock> </AppBlock>
</div> </div>
<div class="page-side"> <div class="page-side">
<AppBlock class="h-400px"> <AppBlock class="h-400px">
<div class="box h-full"> <div class="box h-full">
<div <div
class="box-title flex items-center" class="box-title flex items-center"
@click="push({ name: 'IntelligenceWithin' })" @click="push({ name: 'IntelligenceWithin' })"
> >
<span class="flex-1">社内情报</span> <span class="flex-1">社内情报</span>
<span>❯</span> <span>❯</span>
</div> </div>
<div ref="neiScoll" class="box-content overflow-y-auto px22px"> <div ref="neiScoll" class="box-content overflow-y-auto px22px">
<div class="py13px line" v-for="i in listData" :key="i"> <div class="py13px line" v-for="i in listData" :key="i">
<!-- <AppNewsBox @click="toDetail2(i)" <!-- <AppNewsBox @click="toDetail2(i)"
class="!lh-2em" class="!lh-2em"
:labelText="i.tag" :labelText="i.tag"
labelColor="#2cba06" labelColor="#2cba06"
@ -169,40 +169,40 @@ const handlewaiScoll = () => {
:date="i.publishTime" :date="i.publishTime"
size="h20px" size="h20px"
/> --> /> -->
<div class="flex" @click="toDetail2(i)"> <div class="flex" @click="toDetail2(i)">
<img <img
v-if="i.tag === 'New'" v-if="i.tag === 'New'"
src="../../../assets/images/NEW3.gif" src="../../../assets/images/NEW3.gif"
class="h20px" class="h20px"
/> />
<img <img
v-if="i.tag === '紧急'" v-if="i.tag === '紧急'"
src="../../../assets/images/jj.gif" src="../../../assets/images/jj.gif"
class="h20px" class="h20px"
/> />
<div class="ml5px leading-4.5 max-w300px overflow-ellipsis"> <div class="ml5px leading-4.5 max-w300px overflow-ellipsis">
{{ i.title }} {{ i.title }}
</div> </div>
</div> </div>
<div class="text-#808696 text-right">{{ i.publishTime }}</div> <div class="text-#808696 text-right">{{ i.publishTime }}</div>
</div> </div>
</div> </div>
</div> </div>
</AppBlock> </AppBlock>
</div> </div>
<div class="page-side"> <div class="page-side">
<AppBlock class="h-400px"> <AppBlock class="h-400px">
<div class="box h-full"> <div class="box h-full">
<div <div
class="box-title flex items-center" class="box-title flex items-center"
@click="push({ name: 'IntelligenceOutside' })" @click="push({ name: 'IntelligenceOutside' })"
> >
<span class="flex-1">社外情报</span> <span class="flex-1">社外情报</span>
<span>❯</span> <span>❯</span>
</div> </div>
<div ref="waiScoll" class="box-content overflow-y-auto px22px"> <div ref="waiScoll" class="box-content overflow-y-auto px22px">
<div class="py13px line" v-for="i in listDatas" :key="i"> <div class="py13px line" v-for="i in listDatas" :key="i">
<!-- <AppNewsBox @click="toDetail2(i)" <!-- <AppNewsBox @click="toDetail2(i)"
class="!lh-2em" class="!lh-2em"
:labelText="i.tag" :labelText="i.tag"
labelColor="#2cba06" labelColor="#2cba06"
@ -211,80 +211,80 @@ const handlewaiScoll = () => {
size="h20px" size="h20px"
/> --> /> -->
<div class="flex" @click="toDetail2(i)"> <div class="flex" @click="toDetail2(i)">
<img <img
v-if="i.tag === 'New'" v-if="i.tag === 'New'"
src="../../../assets/images/NEW3.gif" src="../../../assets/images/NEW3.gif"
class="h20px" class="h20px"
/> />
<img <img
v-if="i.tag === '紧急'" v-if="i.tag === '紧急'"
src="../../../assets/images/jj.gif" src="../../../assets/images/jj.gif"
class="h20px" class="h20px"
/> />
<div class="ml5px leading-4.5 max-w300px overflow-ellipsis"> <div class="ml5px leading-4.5 max-w300px overflow-ellipsis">
{{ i.title }} {{ i.title }}
</div> </div>
</div> </div>
<div class="text-#808696 text-right mt8px"> <div class="text-#808696 text-right mt8px">
{{ i.publishTime }} {{ i.publishTime }}
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</AppBlock> </AppBlock>
</div> </div>
</div> </div>
</Layout> </Layout>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
.overflow-ellipsis { .overflow-ellipsis {
white-space: nowrap; /* 防止换行 */ white-space: nowrap; /* 防止换行 */
overflow: hidden; /* 隐藏溢出部分 */ overflow: hidden; /* 隐藏溢出部分 */
text-overflow: ellipsis; /* 显示省略号 */ text-overflow: ellipsis; /* 显示省略号 */
} }
.page-wrap { .page-wrap {
display: grid; display: grid;
grid-template-columns: 1fr 314px; grid-template-columns: 1fr 314px;
grid-template-rows: repeat(2, 1fr); grid-template-rows: repeat(2, 1fr);
grid-column-gap: 30px; grid-column-gap: 30px;
grid-row-gap: 30px; grid-row-gap: 30px;
.page-main { .page-main {
height: 830px; height: 830px;
grid-area: 1 / 1 / 3 / 2; grid-area: 1 / 1 / 3 / 2;
width: 100%; width: 100%;
} }
.page-side { .page-side {
height: 100%; height: 100%;
grid-area: 1 / 2 / 2 / 3; grid-area: 1 / 2 / 2 / 3;
&:last-of-type { &:last-of-type {
height: 300px; height: 300px;
grid-area: 2 / 2 / 3 / 3; grid-area: 2 / 2 / 3 / 3;
} }
} }
} }
.box { .box {
--title-h: 58px; --title-h: 58px;
border: 0; border: 0;
.box-title { .box-title {
height: var(--title-h); height: var(--title-h);
color: #fff; color: #fff;
background-color: #537deb; background-color: #537deb;
font-size: 18px; font-size: 18px;
font-weight: 600; font-weight: 600;
padding: 0 24px; padding: 0 24px;
cursor: pointer; cursor: pointer;
} }
.box-content { .box-content {
height: 100%; height: 100%;
max-height: calc(100% - var(--title-h)); max-height: calc(100% - var(--title-h));
} }
} }
.line { .line {
border-bottom: 1px solid #eef3fb; border-bottom: 1px solid #eef3fb;
} }
</style> </style>

123
src/views/home/intelligence/ListPageData.ts
View File

@ -1,81 +1,86 @@
import { getArticlePage } from '@/api/daikin/base' import { getArticlePage } from '@/api/daikin/base'
import { pageType } from '@/stores/modules/pages' import { pageType } from '@/stores/modules/pages'
const store =pageType() const store = pageType()
export const Navs = [ export const Navs = [
{ key: 'IntelligenceOutside', name: '社外', type: '1' }, { key: 'IntelligenceOutside', name: '社外', type: '1' },
{ key: 'IntelligenceWithin', name: '社内', type: '2' }, { key: 'IntelligenceWithin', name: '社内', type: '2' }
] ]
export function useData() { export function useData() {
const route = useRoute() const route = useRoute()
const { push } = useRouter() const { push } = useRouter()
// const type = computed(() => Navs.find((i) => i.key === route.name)?.type) // const type = computed(() => Navs.find((i) => i.key === route.name)?.type)
const state = reactive<any>({ const state = reactive<any>({
pageNum: 1, pageNum: 1,
pageSize: 10, pageSize: 10,
total: 0, total: 0,
cate: store.page.types, cate: store.page.types || sessionStorage.getItem('types')
}) })
const list = ref<any[]>([]) const list = ref<any[]>([])
async function getData() { async function getData() {
const { pageNum, pageSize, cate } = state const { pageNum, pageSize, cate } = state
if (!cate) return if (!cate) return
const _type = ['1', '2', '3'].includes(String(cate)) ? '1' : '2' const _type = ['1', '2', '3'].includes(String(cate)) ? '1' : '2'
list.value = [] list.value = []
state.total = 0 state.total = 0
const { rows, total } = await getArticlePage({ type: _type, cate, pageNum, pageSize }) const { rows, total } = await getArticlePage({
const _rows = rows.map((i: any) => { type: _type,
i.tagColor = i.tag === '紧急' ? '#e60e0e' : '#2cba06' cate,
return i pageNum,
}) pageSize
console.log(rows) })
list.value = rows const _rows = rows.map((i: any) => {
state.total = total i.tagColor = i.tag === '紧急' ? '#e60e0e' : '#2cba06'
} return i
})
console.log(rows)
list.value = rows
state.total = total
}
// watch( // watch(
// () => route, // () => route,
// async (r) => { // async (r) => {
// await nextTick() // await nextTick()
// const { pageNum, pageSize, cate } = r.query // const { pageNum, pageSize, cate } = r.query
// // state.cate = r.name == 'IntelligenceWithin' ? 4 : 1 // // state.cate = r.name == 'IntelligenceWithin' ? 4 : 1
// state.cate = Number(cate || 1) // state.cate = Number(cate || 1)
// state.pageNum = Number(pageNum || 1) // state.pageNum = Number(pageNum || 1)
// state.pageSize = Number(pageSize || 10) // state.pageSize = Number(pageSize || 10)
// // console.log(12, state.cate, cate, pageNum) // // console.log(12, state.cate, cate, pageNum)
// }, // },
// { immediate: true, deep: true }, // { immediate: true, deep: true },
// ) // )
const lazyState = computed(() => [state.pageNum, state.pageSize, state.cate]) const lazyState = computed(() => [state.pageNum, state.pageSize, state.cate])
watch( watch(
() => unref(lazyState), () => unref(lazyState),
async (v) => { async (v) => {
// await nextTick() // await nextTick()
// console.log(123, v) // console.log(123, v)
// const url = location.pathname + '?cate=' + state.cate + '&pageNum=' + state.pageNum + '&pageSize=' + state.pageSize // const url = location.pathname + '?cate=' + state.cate + '&pageNum=' + state.pageNum + '&pageSize=' + state.pageSize
// history.pushState({ url: url, title: document.title }, document.title, url) // history.pushState({ url: url, title: document.title }, document.title, url)
const url = new URL(location as any) const url = new URL(location as any)
url.searchParams.set('cate', state.cate) url.searchParams.set('cate', state.cate)
url.searchParams.set('pageNum', state.pageNum) url.searchParams.set('pageNum', state.pageNum)
url.searchParams.set('pageSize', state.pageSize) url.searchParams.set('pageSize', state.pageSize)
history.replaceState({}, '', url) history.replaceState({}, '', url)
getData() getData()
}, },
{ immediate: true, deep: true }, { immediate: true, deep: true }
) )
return { state, list, getData } return { state, list, getData }
} }

378
src/views/home/intelligence/OverviewBlock.vue
View File

@ -9,113 +9,157 @@ import AppAlert from '@/components/AppAlert.vue'
import { pageType } from '@/stores/modules/pages' import { pageType } from '@/stores/modules/pages'
import { message } from '@/utils/message' import { message } from '@/utils/message'
const store =pageType() const store = pageType()
import type { PropType } from 'vue' import type { PropType } from 'vue'
const { push } = useRouter() const { push } = useRouter()
const routet = useRoute() const routet = useRoute()
const props = defineProps({ const props = defineProps({
route: String, route: String,
routets:String, routets: String,
swipImgs: { swipImgs: {
type: Array as PropType<any[]>, type: Array as PropType<any[]>,
default: () => [], default: () => []
}, },
items: { items: {
type: Array as PropType<any[]>, type: Array as PropType<any[]>,
default: () => [], default: () => []
} }
}) })
let indexs = 3 let indexs = 3
const modules = [Autoplay, Pagination, Navigation, A11y] const modules = [Autoplay, Pagination, Navigation, A11y]
const swipeActiveIndex = ref(0) const swipeActiveIndex = ref(0)
function handleIndex(x: any) { function handleIndex(x: any) {
swipeActiveIndex.value = x.realIndex swipeActiveIndex.value = x.realIndex
} }
const swipeRef = ref<any>(null) const swipeRef = ref<any>(null)
const slideTo = async (index: any) => { const slideTo = async (index: any) => {
const swiper = unref(swipeRef) const swiper = unref(swipeRef)
if (!swiper) return if (!swiper) return
swiper.slideTo(index, 0) swiper.slideTo(index, 0)
swipeActiveIndex.value = index swipeActiveIndex.value = index
} }
const setSwiperRef = (swiper: any) => { const setSwiperRef = (swiper: any) => {
swipeRef.value = swiper swipeRef.value = swiper
} }
const toDest = (id: any)=>{ const toDest = (id: any) => {
store.page.types = id store.page.types = id
// console.log(routet,routet.path) sessionStorage.setItem('types', id)
push({name:props.route}) // console.log(routet,routet.path)
push({ name: props.route })
} }
const toDetail2 =(n)=>{ const toDetail2 = (n) => {
// console.log(n) // console.log(n)
if(n.id===0) return if (n.id === 0) return
if(n.isSelect===1){ if (n.isSelect === 1) {
push(`${routet.path.replace('/Home','')}/${props.routets}/${n.id}`) push(`${routet.path.replace('/Home', '')}/${props.routets}/${n.id}`)
} } else {
else{ message.error('没有访问权限')
message.error("没有访问权限") }
}
} }
</script> </script>
<template> <template>
<section
<section v-if="swipImgs?.length" class="w640px h280px mt18px relative min-h280px"> v-if="swipImgs?.length"
<Swiper class="w640px h280px mt18px relative min-h280px"
@slideChangeTransitionEnd="handleIndex" >
@swiper="setSwiperRef" <Swiper
class="w-full h-full" @slideChangeTransitionEnd="handleIndex"
:slidesPerView="1" @swiper="setSwiperRef"
:spaceBetween="30" class="w-full h-full"
:loop="false" :slidesPerView="1"
:centeredSlides="true" :spaceBetween="30"
:autoplay="{ delay: 10000, disableOnInteraction: false }" :loop="false"
:navigation="false" :centeredSlides="true"
:modules="modules" :autoplay="{ delay: 10000, disableOnInteraction: false }"
:route ="routet" :navigation="false"
> :modules="modules"
<template v-for="(item, index) in swipImgs" :key="index"> :route="routet"
<SwiperSlide> >
<img :src="item.bannerImg" alt="" @click="toDetail2(item)" class="w100%"/> <template v-for="(item, index) in swipImgs" :key="index">
<div class="absolute w-full bg-#062910/60 h52px left-0 bottom-0 z-9 text-#fff flex px18px items-center"> <SwiperSlide>
<div class="text-ellipsis text-22px font-600 max-w480px" @click="toDetail2(item)" :title="item.title">{{ item.title }}</div> <img
</div> :src="item.bannerImg"
</SwiperSlide> alt=""
<div class="absolute w-full h52px left-0 bottom-0 z-10 flex px18px items-center justify-end"> @click="toDetail2(item)"
<div class="dots shrink-0 cursor-pointer"> class="w100%"
<span :class="`dot ${swipeActiveIndex === idx && 'active'}`" v-for="(item, idx) in swipImgs" :key="item" @click="slideTo(idx)"></span> />
</div> <div
</div> class="absolute w-full bg-#062910/60 h52px left-0 bottom-0 z-9 text-#fff flex px18px items-center"
</template> >
</Swiper> <div
</section> class="text-ellipsis text-22px font-600 max-w480px"
<section class="max-h-500px overflow-y-auto -webkit-scrollbar"> @click="toDetail2(item)"
:title="item.title"
<div class="flex mt19px items min-h-140px" v-for="item in items" :key="item"> >
<div class="w100px h100px rd-20px flex-shrink flex flex-col justify-center items-center text-#fff" :style="{ backgroundColor: item.color }"> {{ item.title }}
<img :src="item.icon" /> </div>
<span class="mt14px">{{ item.name }}</span> </div>
</div> </SwiperSlide>
<div class="flex flex-col flex-1 ml16px min-h-120px"> <div
<template v-if="item.list.length>0"> class="absolute w-full h52px left-0 bottom-0 z-10 flex px18px items-center justify-end"
<AppAlert class="flex cursor-pointer" cate="1"> >
<span v-if="item.list[0].isTop === 'Y'" class="flex-1 w0 truncate font-500" @click="toDetail2(item.list[0])" :title="item.list[0].source">{{ item.list[0].title }}</span> <div class="dots shrink-0 cursor-pointer">
<span class="flex-1 w0 truncate font-500" v-if="item.list[0].isTop === 'N'" ></span> <span
<img v-if="item.list[0].isTop === 'Y'" src="../../../assets/images/jj.gif" class="h27px mr5px mt3px"> :class="`dot ${swipeActiveIndex === idx && 'active'}`"
<div class=" flex h40px lh-40px text-#fff text-18px"> v-for="(item, idx) in swipImgs"
<div class="pr40px cursor-pointer more text-14px" @click="toDest(item.key)">更多</div> :key="item"
</div> @click="slideTo(idx)"
></span>
</AppAlert> </div>
<div class="" v-for="(n, idx) in item.news" :key="n.title"> </div>
<!-- <div v-if="idx ==0"> </template>
</Swiper>
</section>
<section class="max-h-500px overflow-y-auto -webkit-scrollbar">
<div
class="flex mt19px items min-h-140px"
v-for="item in items"
:key="item"
>
<div
class="w100px h100px rd-20px flex-shrink flex flex-col justify-center items-center text-#fff"
:style="{ backgroundColor: item.color }"
>
<img :src="item.icon" />
<span class="mt14px">{{ item.name }}</span>
</div>
<div class="flex flex-col flex-1 ml16px min-h-120px">
<template v-if="item.list.length > 0">
<AppAlert class="flex cursor-pointer" cate="1">
<span
v-if="item.list[0].isTop === 'Y'"
class="flex-1 w0 truncate font-500"
@click="toDetail2(item.list[0])"
:title="item.list[0].source"
>{{ item.list[0].title }}</span
>
<span
class="flex-1 w0 truncate font-500"
v-if="item.list[0].isTop === 'N'"
></span>
<img
v-if="item.list[0].isTop === 'Y'"
src="../../../assets/images/jj.gif"
class="h27px mr5px mt3px"
/>
<div class="flex h40px lh-40px text-#fff text-18px">
<div
class="pr40px cursor-pointer more text-14px"
@click="toDest(item.key)"
>
更多
</div>
</div>
</AppAlert>
<div class="" v-for="(n, idx) in item.news" :key="n.title">
<!-- <div v-if="idx ==0">
<div v-if="n.isTop === 'Y'?indexs=3:indexs=2" class="mt7px cursor-pointer flex items-center" :data-date="n.publishTime" @click="toDetail2(n)"> <div v-if="n.isTop === 'Y'?indexs=3:indexs=2" class="mt7px cursor-pointer flex items-center" :data-date="n.publishTime" @click="toDetail2(n)">
<span v-if="n.isTop !== 'Y'" class="truncate flex-1 w0 text-#142142 hover:underline mt4px" :style="n.isRead===2?'color:#0058E5;font-weight':''" :title="n.source">{{ n.title }}</span> <span v-if="n.isTop !== 'Y'" class="truncate flex-1 w0 text-#142142 hover:underline mt4px" :style="n.isRead===2?'color:#0058E5;font-weight':''" :title="n.source">{{ n.title }}</span>
<span class="mt4.5px"> <span class="mt4.5px">
@ -126,98 +170,108 @@ const toDetail2 =(n)=>{
</div> </div>
<div v-else> --> <div v-else> -->
<div v-if="idx<3" class="mt8px cursor-pointer flex items-center h25px" :data-date="n.publishTime" @click="toDetail2(n)"> <div
v-if="idx < 3"
<span class="truncate flex-1 w0 text-#142142 hover:underline mt4px" :style="n.isRead===2?'color:#0058E5;font-weight':''" :title="n.source">{{ n.title }}</span> class="mt8px cursor-pointer flex items-center h25px"
<span class="mt4.5px"> :data-date="n.publishTime"
<img v-if="n.tag === 'New'" src="./images/NEW3.gif" class="h20px"> @click="toDetail2(n)"
</span> >
<span class="shrink-0 ml18px text-#808696 mt4px">{{ n.publishTime }}</span> <span
</div> class="truncate flex-1 w0 text-#142142 hover:underline mt4px"
<!-- </div> --> :style="n.isRead === 2 ? 'color:#0058E5;font-weight' : ''"
:title="n.source"
>{{ n.title }}</span
>
<span class="mt4.5px">
<img
v-if="n.tag === 'New'"
</div> src="./images/NEW3.gif"
class="h20px"
</template> />
<template v-else> </span>
<AppAlert class="flex cursor-pointer" cate="1"> <span class="shrink-0 ml18px text-#808696 mt4px">{{
<span class="flex-1 w0 truncate font-500" ></span> n.publishTime
<div class=" flex h40px lh-40px text-#fff text-18px"> }}</span>
<div class="pr40px cursor-pointer more text-14px" @click="toDest(item.key)">更多</div> </div>
</div> <!-- </div> -->
</div>
</AppAlert> </template>
</template> <template v-else>
</div> <AppAlert class="flex cursor-pointer" cate="1">
</div> <span class="flex-1 w0 truncate font-500"></span>
<div class="flex h40px lh-40px text-#fff text-18px">
<div
</section> class="pr40px cursor-pointer more text-14px"
@click="toDest(item.key)"
>
更多
</div>
</div>
</AppAlert>
</template>
</div>
</div>
</section>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
// ::-webkit-scrollbar { // ::-webkit-scrollbar {
// width: 1px; // width: 1px;
// } // }
.text-ellipsis { .text-ellipsis {
white-space: nowrap; /* 防止文本换行 */ white-space: nowrap; /* 防止文本换行 */
overflow: hidden; /* 隐藏溢出部分 */ overflow: hidden; /* 隐藏溢出部分 */
text-overflow: ellipsis; /* 显示省略号 */ text-overflow: ellipsis; /* 显示省略号 */
/* 其他样式，如字体大小、字体粗细等 */ /* 其他样式，如字体大小、字体粗细等 */
} }
.title{ .title {
background: linear-gradient(0deg, #466CCD, #5C87F5); background: linear-gradient(0deg, #466ccd, #5c87f5);
border-radius: 10px; border-radius: 10px;
opacity: 0.52; opacity: 0.52;
} }
.more{ .more {
position: relative; position: relative;
&::after{ &::after {
content: ''; content: '';
width: 20px; width: 20px;
height: 20px; height: 20px;
position: absolute; position: absolute;
right: 15px; right: 15px;
top: 10px; top: 10px;
background-image: url('./images/younniu.png'); background-image: url('./images/younniu.png');
background-size: contain; background-size: contain;
} }
} }
.dots { .dots {
.dot { .dot {
display: inline-block; display: inline-block;
width: 13px; width: 13px;
height: 9px; height: 9px;
background-color: rgba(255, 255, 255, 0.3); background-color: rgba(255, 255, 255, 0.3);
border-radius: 0; border-radius: 0;
margin-left: 8px; margin-left: 8px;
&.active { &.active {
background-color: #fff; background-color: #fff;
} }
} }
} }
.items { .items {
.bg-red { .bg-red {
background-color: #e60e0e; background-color: #e60e0e;
} }
.bg-green { .bg-green {
background-color: #2cba06; background-color: #2cba06;
} }
.items-content { .items-content {
margin-top: 12px; margin-top: 12px;
display: -webkit-box; display: -webkit-box;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-webkit-line-clamp: 2; -webkit-line-clamp: 2;
line-height: 1.7; line-height: 1.7;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
} }
</style> </style>

110
src/views/home/phone/index.vue
View File

@ -8,25 +8,49 @@ import { useDate } from '@/views/home/hooks/useDate'
const { day, week } = useDate() const { day, week } = useDate()
const { push } = useRouter() const { push } = useRouter()
const array = ref<any[]>([ const array = ref<any[]>([
{ content1: '将扩大的机遇转为成果 更强更大地展翅飞翔', content2: 'ひろがるチャンスを 成果につなげ 強く大きく 羽ばたこう', year: '2023年' }, {
{ content1: '领先时代的变化 开创崭新的未来', content2: '', year: '2022年' }, content1: '将扩大的机遇转为成果 更强更大地展翅飞翔',
{ content1: '以“重大变化”为契机 向新课题发起挑战', content2: '', year: '2021年' }, content2: 'ひろがるチャンスを 成果につなげ 強く大きく 羽ばたこう',
{ content1: '加速推进三个协创 决胜于变化的时代', content2: '', year: '2020年' }, year: '2023年'
{ content1: '以三个协创为轴心 人人迅速果断行动', content2: '', year: '2016年' }, },
{ content1: '突破壁垒 集中优势 不断挑战新课题', content2: '', year: '2018年' }, { content1: '领先时代的变化 开创崭新的未来', content2: '', year: '2022年' },
{ content1: '坚持以人为轴心，融合新的力量', content2: '集团上下齐心协力提升企业价值', year: '2017年' }, {
{ content1: '站稳脚跟 强化优势 大步迈进', content2: '', year: '2016年' }, content1: '以“重大变化”为契机 向新课题发起挑战',
{ content1: '创造未来，决胜于变化的时代', content2: '', year: '2015年' }, 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年' }
])
</script> </script>
<template> <template>
<HomeHead class="top"> <HomeHead class="top">
<template #content> <template #content>
<!-- <HomeHeadSearch /> --> <!-- <HomeHeadSearch /> -->
</template> </template>
</HomeHead> </HomeHead>
<!-- <div class="h-full relative flex flex-col"> <!-- <div class="h-full relative flex flex-col">
<div class="font-600 flex items-end mt27px"> <div class="font-600 flex items-end mt27px">
<div class="text-36px">集团方针</div> <div class="text-36px">集团方针</div>
<div class="text-18px ml40px mr25px">{{ day }}</div> <div class="text-18px ml40px mr25px">{{ day }}</div>
@ -46,41 +70,41 @@ const array = ref<any[]>([
</div> </div>
</div> </div>
</div> --> </div> -->
<div class="mt30px mr20px flex w100%"> <div class="mt30px mr20px flex w100%">
<img src="../../../assets/images/tizhibiaozi.png" class="w100%"/> <img src="../../../assets/images/fzqiet2.png" class="w100%" />
</div> </div>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
.top { .top {
position: absolute; position: absolute;
right: 30px; right: 30px;
top: -92px; top: -92px;
} }
.g-wrapper { .g-wrapper {
border-radius: 18px; border-radius: 18px;
border: 1px solid #E7EBF5; border: 1px solid #e7ebf5;
box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32); box-shadow: inset 1px 2px 12px rgba(14, 86, 221, 0.32);
overflow: hidden; overflow: hidden;
.timeline { .timeline {
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
color: #142142; color: #142142;
.one { .one {
position: relative; position: relative;
.year{ .year {
left: -132px; left: -132px;
top: -14px; top: -14px;
color: #003CB7; color: #003cb7;
font-size: 26px; font-size: 26px;
font-weight: normal; font-weight: normal;
text-align: center; text-align: center;
line-height: 50px; line-height: 50px;
} }
} }
} }
} }
</style> </style>

1011
src/views/home/quality/Quality.vue
View File

File diff suppressed because it is too large Load Diff

596
src/views/index.vue
View File

@ -2,10 +2,10 @@
import { RouterView } from 'vue-router' import { RouterView } from 'vue-router'
import { useTitle } from '@vueuse/core' import { useTitle } from '@vueuse/core'
import { getImg } from '@/assets/images' import { getImg } from '@/assets/images'
import { NModal } from 'naive-ui' import { NModal, NPopover } from 'naive-ui'
import { useUserStore } from '@/stores/modules/user' import { useUserStore } from '@/stores/modules/user'
import Searchs from '@/components/search.vue' import Searchs from '@/components/search.vue'
import {report} from '@/api/daikin/base' import { report, treeDbList } from '@/api/daikin/base'
useTitle('大金中国调达本部 HOMEPAGE') useTitle('大金中国调达本部 HOMEPAGE')
const { push } = useRouter() const { push } = useRouter()
const store = useUserStore() const store = useUserStore()
@ -14,237 +14,431 @@ const { toggle } = inject<any>('fullscreen')
const activeMenuKey = ref('Home') const activeMenuKey = ref('Home')
let idx = ref(0) let idx = ref(0)
const Menus = [ const Menus = ref([
// 首页 集团部门方针 年度活动日程表 其他链接… // 首页 集团部门方针 年度活动日程表 其他链接…
{ key: 'Home', name: '首页', icon: getImg('home.png'), icon1: getImg('home1.png'),link:'' }, {
{ key: 'Home',
key: 'Group', name: '年度方针', icon: getImg('company.png'),icon1: getImg('company1.png'),link:'' , name: '首页',
// children: [ icon: getImg('home.png'),
// { key: 'Group', name: '-集团方针' }, icon1: getImg('home1.png'),
// { key: 'Company', name: '-公司方针' }, link: '',
// { key: 'HeadQuarters', name: '-调达本部方针' } path: '/Home',
// ] other: 'Top Page'
}, },
// { key: 'company', name: '本部长通达', icon: getImg('icon-company.svg') }, {
{ key: 'User', name: '年度活动日程表', icon: getImg('book.png'),icon1: getImg('book1.png'),link:'' key: 'Group',
// children: [ name: '集团部门方针',
// { key: '', name: '调达Database' }, icon: getImg('company.png'),
// ] icon1: getImg('company1.png'),
}, link: '',
// { key: 'database', name: '调达Database', icon: getImg('shuju.png'),icon1: getImg('shuju1.png'),link:'https://procurement.daikin.net.cn/scripts/cbgrn/grn.exe/' }, path: '/Home/group'
{ key: 'DataBase', name: '调达Database', icon: getImg('shuju.png'),icon1: getImg('shuju1.png') }, // children: [
{ key: 'link', name: '其他链接', icon: getImg('link.png') ,icon1: getImg('link1.png'),link:'', // { key: 'Group', name: '-集团方针' },
children: [ // { key: 'Company', name: '-公司方针' },
{ key: 'YCWZ', name: '调达本部才望子',link:'http://172.31.119.37/scripts/cbgrn/grn.exe/portal/index' }, // { key: 'HeadQuarters', name: '-调达本部方针' }
{ 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: 'company', name: '本部长通达', icon: getImg('icon-company.svg') },
] {
}, key: 'User',
{ key: 'phone', name: '紧急联络体制表', icon: getImg('phone.png'),icon1: getImg('phone1.png'),link:'' , name: '年度活动日程表',
// children: [ icon: getImg('book.png'),
// { key: 'inv', name: '邀请' }, icon1: getImg('book1.png'),
// { key: 'visit', name: '拜访' }, 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: '拜访' },
// ]
}
])
] 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 }
}
})
}
getDbTree()
let flag = false
function menuHandler(menu: any, index: number) { function menuHandler(menu: any, index: number) {
activeMenuKey.value = menu.key activeMenuKey.value = menu.key
console.log(menu,index); console.log(menu, index)
idx.value = index; idx.value = index
console.log(menu.key); console.log(menu.key, 'key')
if(!menu.key) return if (!menu.key) return
if (menu.key==='DataBase') { if (menu.key === 'DataBase') {
const { code } = report({ moduleCode:'App_Database' }) if (flag) {
} push({ name: menu.key })
push({ name: menu.key }) flag = false
return
}
flag = true
setTimeout(() => {
flag = false
}, 300)
}
if (menu.children) return
if (menu.key === 'DataBase') {
const { code } = report({ moduleCode: 'App_Database' })
}
push({ name: menu.key })
} }
const route = useRoute() const shorm = ref(false)
const shorm =ref(false)
function goChild(menu:any){
activeItem = menu.key
console.log(menu.key)
if(menu.key ==='CODE'){
shorm.value = true
}
if(menu.link){
}
else{
push({name:menu.key})
}
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]
console.log('🚀 ~ menu:', menu)
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 || {} })
}
} }
var activeItem=0 var activeItem = 0
</script> </script>
<template> <template>
<div class="page w-1920px h-1080px p30px flex"> <div class="page w-1920px h-1080px p30px flex">
<div class="w300px -mr-1px flex flex-col shrink-0 overflow-auto"> <div class="w300px -mr-1px flex flex-col shrink-0 overflow-auto">
<!-- @dblclick="toggle" --> <!-- @dblclick="toggle" -->
<img src="@/assets/images/logo.png" class="w197px h44px mt14px" /> <img src="@/assets/images/logo.png" class="w197px h44px mt14px" />
<div class="text-20px text-#fff font-600 mt6px">大金中国调达本部 HOMEPAGE</div> <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"> <div
<Searchs></Searchs> class="mt34px w270px min-h80px rd-35px b-4px bg-#fff/16 b-4px b-solid b-#fff/23 overflow-hidden relative"
</div> >
<div class="pt44px pb24px flex-1 "> <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="nav px36px py24px m10px mr0 rd-32px rd-r-0 flex flex-col text-#fff cursor-pointer" <div v-if="m.children && idx == index" class="pl40px">
v-for="(m, index) in Menus" :key="m.key" :class="activeMenuKey === m.key ? (m.children ?'actives':'active'):''" <div
@click="() => menuHandler(m, index)"> class="my16px pl30px text-#fff activeChildren text-20px"
<div :class="activeMenuKey === m.key && 'onActive'"> v-for="(item, ind) in m.children"
<img v-if="activeMenuKey === m.key" :src="m.icon1" class="w22px h22px mr16px mt--5px" /> :key="item.key"
<img v-else :src="m.icon" class="w22px h22px mr16px mt--5px" /> @click.stop="goChild(item)"
<span class="text-22px font-900"> @click="activeItem = ind"
>
<a v-if="m.link" class="no-underline text-#fff" :href="m.link"> {{ m.name }}</a> <a
<span v-else> v-if="item.link"
<a v-if="m.name==='其他链接'" class="underline text-#fff" > {{ m.name }}</a> class="no-underline !text-#fff flex"
<span v-else>{{m.name}}</span> :href="item.link"
</span> ><span
</span> class="w7px h7px rd-7px bg-#fff block mr-8px mt4px"
</div> ></span
>{{ item.name }}</a
<div v-if="m.children&&idx==index" class="pl40px"> >
<div class="my20px pl30px text-#fff activeChildren" v-for="(item,ind) in m.children" :key="item.key" @click.stop="goChild(item)" @click="activeItem = ind"> <span v-else class="flex"
<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
<span v-else class="flex"><span class="w7px h7px rd-7px bg-#fff block mr-8px mt4px"></span>{{ item.name }}</span> class="w7px h7px rd-7px bg-#fff block mr-8px mt4px"
</div> ></span
</div> >{{ item.name }}</span
</div> >
</div>
</div>
</div>
</div> </div>
<div class="p20px w270px rd-20px b-4px bg-#fff/16 b-4px b-solid b-#fff/23 text-14px relative" > <div class="h90px w270px"></div>
<a href="http://172.31.119.37/scripts/cbgrn/grn.exe/portal/index" target="_blank" class="no-underline text-#fff"> <n-popover
<div class="flex items-center text-18px "> v-if="false"
<img src="@/assets/images/icon-book.svg" class="w22px h22px mr10px" /> trigger="hover"
个人日程 placement="top"
</div> :style="{ '--n-border-radius': '8px' }"
<div class="mt18px">9:00-10:00</div> >
<template #trigger>
<div
class="w270px py14px my20px px24px flex rd-20px bg-#003cb7"
style="box-shadow: 0 2rpx 14rpx 0 #00000069"
>
<div class="flex items-center text-18px">
<img
src="@/assets/images/dianhhh@2x.png"
class="w22px h22px mr10px"
/>
公司内线
</div>
</div>
</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="mt8px">召集部门成员召开项目启动会</div>
<div class="mt16px">10:01-11:00</div> <div class="mt16px">10:01-11:00</div>
<div class="mt8px">召集部门成员召开项目启动会</div> <div class="mt8px">召集部门成员召开项目启动会</div> -->
<img src="@/assets/images/zhulj@2x.png" class="absolute w22px h22px mr10px top--15px right--20px" /> <img
</a> src="@/assets/images/zhulj@2x.png"
</div> 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"> <div class="flex items-center text-18px">
<img src="@/assets/images/icon-memo.svg" class="w22px h22px mr10px" /> <img src="@/assets/images/icon-memo.svg" class="w22px h22px mr10px" />
memo memo
</div> </div>
<div class="mt18px lh-24px">新年方针:领先时代的变化开创崭新的 未来</div> <div class="mt18px lh-24px">新年方针:领先时代的变化开创崭新的 未来</div>
</div> --> </div> -->
</div> </div>
<div class="main flex-1 rd-32px p30px pb15px pt0px mt62px relative"> <div class="main flex-1 rd-32px p30px pb15px pt0px mt62px relative">
<!-- <Home /> --> <!-- <Home /> -->
<RouterView /> <RouterView />
</div> </div>
</div> </div>
<div class="fixed bottom-4px text-#fff text-12px ml38px" style="margin:0; width: 100%; text-align: center;">今日访问人数：{{store.user.appLoginToDayCount}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;累计访问人数：{{store.user.appLoginCount}}</div> <div
<NModal v-model:show="shorm" :mask-closable="false"> class="fixed bottom-4px text-#fff text-12px ml38px"
<div class="w700px h430px bg-#fff rd-15px"> style="margin: 0; width: 100%; text-align: center"
<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"/> store.user.appLoginToDayCount
</div> }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;累计访问人数：{{ store.user.appLoginCount }}
<div class="flex mt70px text-center"> </div>
<div class="w-full text-center"> <NModal v-model:show="shorm" :mask-closable="false">
<img src="@/assets/images/ewm1@2x.png" class="w200px"/> <div class="w700px h430px bg-#fff rd-15px">
<div class="py10px bg-#377CFF text-#fff w200px rd-20px mt35px mx-auto">大金空调中国视频号</div> <div
</div> class="py5px px15px"
<div class="w-full"> style="
<img src="@/assets/images/ewm2@2x.png" class="w200px"/> border-bottom: 1px solid #dadada;
<div class="py10px bg-#377CFF text-#fff w200px rd-20px mt35px mx-auto">大金空调抖音号</div> font-weight: bold;
</div> color: #494a63;
</div> "
</div> >
</NModal> 大金空调中国相关
<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> </template>
<style scoped lang="less"> <style scoped lang="less">
.page { .page {
font-family: 'PingFang SC'; font-family: 'PingFang SC';
user-select: none; user-select: none;
// background-image: url('@/assets/images/bg.jpg'); // background-image: url('@/assets/images/bg.jpg');
// background-color: #000; // background-color: #000;
background-position: 0 0; background-position: 0 0;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
color: #fff; color: #fff;
line-height: 1; line-height: 1;
} }
.nav { .nav {
position: relative; position: relative;
&::before { &::before {
top: -48px; top: -48px;
} }
.activeChildren:hover{ .activeChildren:hover {
a,span{ a,
text-decoration:underline; span {
} text-decoration: underline;
} }
&::after { }
bottom: -49px; &::after {
transform: rotate(-90deg); bottom: -49px;
} transform: rotate(-90deg);
}
&.active { &.active {
color: #002fa7; color: #002fa7;
background-color: #fff; background-color: #fff;
a{ a {
color: #002fa7; color: #002fa7;
} }
&::before, &::before,
&::after { &::after {
opacity: 1; opacity: 1;
} }
} }
&.actives { &.actives {
padding: 0px!important; padding: 0px !important;
color: #002fa7; color: #002fa7;
background-color:rgba(255, 255,255,0.3); background-color: rgba(255, 255, 255, 0.3);
a{ a {
color: #002fa7; color: #002fa7;
} }
&::before, &::before,
&::after { &::after {
opacity: 1; opacity: 1;
} }
.onActive{ .onActive {
background-color: #fff; background-color: #fff;
border-radius:32px 0 0 32px ; border-radius: 32px 0 0 32px;
padding: 24px 36px 24px 36px; padding: 24px 16px 24px 36px;
} }
} }
} }
.main { .main {
background-image: url('@/assets/images/bg-rs-main.svg'); background-image: url('@/assets/images/bg-rs-main.svg');
background-position: 0 0; background-position: 0 0;
background-repeat: repeat-x; background-repeat: repeat-x;
background-size: auto; background-size: auto;
}
&::-webkit-scrollbar {
display: none;
scrollbar-width: none;
} }
&::-webkit-scrollbar{
display: none;
scrollbar-width:none
}
</style> </style>

305
src/views/layout/ExternalLogin.vue
View File

@ -7,78 +7,98 @@ import { token, useUserStore } from '@/stores/modules/user'
const message = useMessage() const message = useMessage()
const { push } = useRouter() const { push } = useRouter()
const store = useUserStore() const store = useUserStore()
onMounted(()=>{ onMounted(() => {
const account = localStorage.getItem("accounts") const account = localStorage.getItem('accounts')
const password = localStorage.getItem("passwords") const password = localStorage.getItem('passwords')
if(password){ if (password) {
redss.value = true redss.value = true
formState.account = account formState.account = account
formState.password = password formState.password = password
} }
}) })
const formState = reactive({ const formState = reactive({
account: '', account: '',
password: '', password: '',
authType:'2' authType: '2'
}) })
const redss = ref(false) const redss = ref(false)
const pwd=(e)=>{ const pwd = (e) => {
redss.value = e redss.value = e
} }
async function handleLogin() { async function handleLogin() {
const { account, password } = formState const { account, password } = formState
const { msg } = await login(formState) const { msg } = await login(formState)
token.value = msg token.value = msg
store.getUser() store.getUser()
if(msg){ if (msg) {
push({ name: 'external' }) push({ name: 'external' })
if(redss.value){ if (redss.value) {
localStorage.setItem('accounts', account); localStorage.setItem('accounts', account)
localStorage.setItem('passwords', password); localStorage.setItem('passwords', password)
} }
message.success('登录成功') message.success('登录成功')
} }
} }
const keyDown=(e)=>{ const keyDown = (e) => {
if(e.key ==='Enter') if (e.key === 'Enter') {
{ handleLogin()
handleLogin() }
}
} }
</script> </script>
<template> <template>
<div class="bg-#fff w700px h610px text-center mx-auto p50px mt14% mb20%">
<p
x="0"
y="52"
style="font-size: 52px; font-weight: 800; margin-bottom: 50px"
>
大金空调(上海)有限公司
</p>
<section>
登录名称 ：
<div class="bg-#fff w700px h610px text-center mx-auto p50px my20%"> <div
<p x="0" y="52" style="font-size: 52px; font-weight: 800;margin-bottom: 50px;">大金空调(上海)有限公司</p> class="b-1px b-solid b-#000 bg-#fff rd-12px inline-flex items-center w416px h-60px px12px cursor-pointer overflow-hidden relative"
>
<input
<section> class="h-full w-full text-#142142 text-18px pr54px placeholder-#97a4d2"
登录名称 ： type="text"
<div placeholder="请输入您的账号"
class="b-1px b-solid b-#000 bg-#fff rd-12px inline-flex items-center w416px h-60px px12px cursor-pointer overflow-hidden relative"> maxlength="50"
<input class="h-full w-full text-#142142 text-18px pr54px placeholder-#97a4d2" type="text" v-model="formState.account"
placeholder="请输入您的账号" maxlength="50" v-model="formState.account" @keydown.enter="keyDown"/> @keydown.enter="keyDown"
</div> />
</section> </div>
<section class="mt28px"> </section>
密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码： <section class="mt28px">
<div 密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码：
class="b-1px b-solid b-#000 bg-#fff rd-12px inline-flex items-center w416px h-60px px12px cursor-pointer overflow-hidden relative"> <div
<input class="h-full w-full text-#142142 text-18px pr54px placeholder-#97a4d2" type="password" class="b-1px b-solid b-#000 bg-#fff rd-12px inline-flex items-center w416px h-60px px12px cursor-pointer overflow-hidden relative"
placeholder="请输入您的密码" maxlength="50" v-model="formState.password" @keydown.enter="keyDown"/> >
</div> <input
</section> class="h-full w-full text-#142142 text-18px pr54px placeholder-#97a4d2"
<section class="mt16px w-full text-right text-#000"> type="password"
<n-checkbox size="large" label="记住密码" :on-update:checked="pwd" class="mr-50px" :checked="redss"/> placeholder="请输入您的密码"
</section> maxlength="50"
<!-- v-model="formState.password"
@keydown.enter="keyDown"
/>
</div>
</section>
<section class="mt16px w-full text-right text-#000">
<n-checkbox
size="large"
label="记住密码"
:on-update:checked="pwd"
class="mr-50px"
:checked="redss"
/>
</section>
<!--
<section class="mt28px"> <section class="mt28px">
所属地区： 所属地区：
<div <div
@ -88,101 +108,102 @@ const keyDown=(e)=>{
</div> </div>
</section> --> </section> -->
<section class="mt48px text-#fff text-28px"> <section class="mt48px text-#fff text-28px">
<div <div
class="inline-flex items-center justify-center rd-10px w416px h62px bg-#345fdd/80 hover-bg-#345fdd/100 cursor-pointer" class="inline-flex items-center justify-center rd-10px w416px h62px bg-#345fdd/80 hover-bg-#345fdd/100 cursor-pointer"
@click="handleLogin" @keydown.enter="keyDown"> @click="handleLogin"
登录 @keydown.enter="keyDown"
</div> >
</section> 登录
</div> </div>
</section>
</div>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
.wrapper { .wrapper {
// background: url('./images/denglbj.png') no-repeat; // background: url('./images/denglbj.png') no-repeat;
background-size: cover; background-size: cover;
background-color: #E4E4E4; background-color: #e4e4e4;
overflow: hidden; overflow: hidden;
.box { .box {
width: 716px; width: 716px;
height: 743px; height: 743px;
margin: 0 auto; margin: 0 auto;
margin-top: 211px; margin-top: 211px;
// background-color: rgba(22, 208, 255, 0.15); // background-color: rgba(22, 208, 255, 0.15);
// border: 1px dashed #3699ff; // border: 1px dashed #3699ff;
user-select: none; user-select: none;
position: relative; position: relative;
.inner-box { .inner-box {
position: absolute; position: absolute;
width: 582px; width: 582px;
height: 496px; height: 496px;
left: 50%; left: 50%;
top: 50%; top: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
border: 3px solid #0d4da5; border: 3px solid #0d4da5;
border-radius: 18px; border-radius: 18px;
& > * { & > * {
z-index: 9; z-index: 9;
} }
&::before { &::before {
z-index: 1; z-index: 1;
content: ' '; content: ' ';
width: 537px; width: 537px;
height: 247px; height: 247px;
background-image: url('./images/light.svg'); background-image: url('./images/light.svg');
position: absolute; position: absolute;
top: -25%; top: -25%;
left: -35%; left: -35%;
@keyframes toRight { @keyframes toRight {
0% { 0% {
left: -35%; left: -35%;
} }
50% { 50% {
left: 30%; left: 30%;
} }
100% { 100% {
left: -35%; left: -35%;
} }
} }
animation: toRight 10s linear infinite; animation: toRight 10s linear infinite;
} }
&::after { &::after {
z-index: 1; z-index: 1;
content: ' '; content: ' ';
width: 537px; width: 537px;
height: 247px; height: 247px;
background-image: url('./images/light.svg'); background-image: url('./images/light.svg');
transform: rotate(180deg); transform: rotate(180deg);
position: absolute; position: absolute;
bottom: -25%; bottom: -25%;
right: -35%; right: -35%;
@keyframes toLeft { @keyframes toLeft {
0% { 0% {
right: -35%; right: -35%;
} }
50% { 50% {
right: 30%; right: 30%;
} }
100% { 100% {
right: -35%; right: -35%;
} }
} }
animation: toLeft 10s linear infinite; animation: toLeft 10s linear infinite;
} }
} }
} }
.title { .title {
font-size: 52px; font-size: 52px;
font-weight: bold; font-weight: bold;
} }
} }
</style> </style>

337
src/views/layout/Login.vue
View File

@ -1,7 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
import type { LoginReq } from '@/api/daikin/base' import type { LoginReq } from '@/api/daikin/base'
import { NCheckbox, useMessage, NSelect, NConfigProvider } from 'naive-ui' import { NCheckbox, useMessage, NSelect, NConfigProvider } from 'naive-ui'
import type {GlobalThemeOverrides} from 'naive-ui' import type { GlobalThemeOverrides } from 'naive-ui'
import { login } from '@/api/daikin/base' import { login } from '@/api/daikin/base'
import { token, useUserStore } from '@/stores/modules/user' import { token, useUserStore } from '@/stores/modules/user'
import { ref } from 'vue' import { ref } from 'vue'
@ -10,104 +10,127 @@ const message = useMessage()
const { push } = useRouter() const { push } = useRouter()
const store = useUserStore() const store = useUserStore()
const themeOverrides:GlobalThemeOverrides = { const themeOverrides: GlobalThemeOverrides = {
common: { common: {
primaryColor: '#FF0000' primaryColor: '#FF0000'
}, },
Select: { Select: {
peers: { peers: {
InternalSelection: { InternalSelection: {
textColor: '#333', textColor: '#333',
border:'0', border: '0',
placeholderColor:'#97A4D2', placeholderColor: '#97A4D2',
borderActive:'' borderActive: ''
}, },
InternalSelectMenu: { InternalSelectMenu: {
borderRadius: '6px', borderRadius: '6px'
} }
} }
} }
} }
onMounted(()=>{ onMounted(() => {
const account = localStorage.getItem("account") const account = localStorage.getItem('account')
const password = localStorage.getItem("password") const password = localStorage.getItem('password')
if(password){ if (password) {
reds.value = true reds.value = true
formState.account = account formState.account = account
formState.password = password formState.password = password
} }
}) })
const formState = reactive<LoginReq>({ const formState = reactive<LoginReq>({
account: '', account: '',
password: '', password: '',
authType:'1' authType: '1'
}) })
async function handleLogin() { async function handleLogin() {
const { account, password } = formState const { account, password } = formState
if (!account) return message.error('请输入您的账号') if (!account) return message.error('请输入您的账号')
if (!password) return message.error('请输入您的密码') if (!password) return message.error('请输入您的密码')
const { msg } = await login(formState) const { msg } = await login(formState)
token.value = msg
store.getUser()
if(msg){
push({ name: 'Home' })
if(reds.value){
localStorage.setItem('account', account);
localStorage.setItem('password', password);
}
message.success('登录成功')
}
token.value = msg
store.getUser()
if (msg) {
push({ name: 'Home' })
if (reds.value) {
localStorage.setItem('account', account)
localStorage.setItem('password', password)
}
message.success('登录成功')
}
} }
const keyDown=(e)=>{ const keyDown = (e) => {
if(e.key ==='Enter') if (e.key === 'Enter') {
{ handleLogin()
handleLogin() }
}
} }
const reds = ref(false) const reds = ref(false)
const pwd=(e)=>{ const pwd = (e) => {
reds.value = e reds.value = e
} }
</script> </script>
<template> <template>
<div class="bg-#fff w700px h610px text-center mx-auto p50px my20%"> <div class="bg-#fff w700px h610px text-center mx-auto p50px mt14% mb20%">
<p x="0" y="52" style="font-size: 52px; font-weight: 800;margin-bottom: 50px;">大金空调(上海)有限公司</p> <p
x="0"
y="52"
style="font-size: 52px; font-weight: 800; margin-bottom: 50px"
>
大金空调(上海)有限公司
</p>
<section>
登录名称 ：
<div
class="b-1px b-solid b-#000 bg-#fff rd-12px inline-flex items-center w416px h-60px px12px cursor-pointer overflow-hidden relative"
>
<input
class="h-full w-full text-#142142 text-18px pr54px placeholder-#97a4d2"
type="text"
placeholder="请输入您的账号"
maxlength="50"
v-model="formState.account"
@keydown.enter="keyDown"
/>
</div>
</section>
<section class="mt28px">
密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码：
<div
class="b-1px b-solid b-#000 bg-#fff rd-12px inline-flex items-center w416px h-60px px12px cursor-pointer overflow-hidden relative"
>
<input
class="h-full w-full text-#142142 text-18px pr54px placeholder-#97a4d2"
type="password"
placeholder="请输入您的密码"
maxlength="50"
v-model="formState.password"
@keydown.enter="keyDown"
/>
</div>
</section>
<section class="mt16px w-full text-right text-#000">
<n-checkbox
size="large"
label="记住密码"
:on-update:checked="pwd"
class="mr-50px"
:checked="reds"
/>
</section>
<section> <section class="mt48px text-#fff text-28px">
登录名称 ： <div
<div class="inline-flex items-center justify-center rd-10px w416px h62px bg-#345fdd/80 hover-bg-#345fdd/100 cursor-pointer"
class="b-1px b-solid b-#000 bg-#fff rd-12px inline-flex items-center w416px h-60px px12px cursor-pointer overflow-hidden relative"> @click="handleLogin"
<input class="h-full w-full text-#142142 text-18px pr54px placeholder-#97a4d2" type="text" >
placeholder="请输入您的账号" maxlength="50" v-model="formState.account" @keydown.enter="keyDown"/> 登录
</div> </div>
</section> </section>
<section class="mt28px"> </div>
密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;码：
<div
class="b-1px b-solid b-#000 bg-#fff rd-12px inline-flex items-center w416px h-60px px12px cursor-pointer overflow-hidden relative">
<input class="h-full w-full text-#142142 text-18px pr54px placeholder-#97a4d2" type="password"
placeholder="请输入您的密码" maxlength="50" v-model="formState.password" @keydown.enter="keyDown"/>
</div>
</section>
<section class="mt16px w-full text-right text-#000">
<n-checkbox size="large" label="记住密码" :on-update:checked="pwd" class="mr-50px" :checked="reds"/>
</section>
<section class="mt48px text-#fff text-28px">
<div
class="inline-flex items-center justify-center rd-10px w416px h62px bg-#345fdd/80 hover-bg-#345fdd/100 cursor-pointer"
@click="handleLogin">
登录
</div>
</section>
</div>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
@ -121,97 +144,97 @@ const pwd=(e)=>{
// } // }
.wrapper { .wrapper {
background: url('./images/login.png') no-repeat; background: url('./images/login.png') no-repeat;
background-size: cover; background-size: cover;
overflow: hidden; overflow: hidden;
.box { .box {
width: 716px; width: 716px;
height: 743px; height: 743px;
margin: 0 auto; margin: 0 auto;
margin-top: 211px; margin-top: 211px;
// background-color: rgba(22, 208, 255, 0.15); // background-color: rgba(22, 208, 255, 0.15);
// border: 1px dashed #3699ff; // border: 1px dashed #3699ff;
user-select: none; user-select: none;
position: relative; position: relative;
.inner-box { .inner-box {
position: absolute; position: absolute;
width: 582px; width: 582px;
height: 496px; height: 496px;
left: 50%; left: 50%;
top: 50%; top: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
border: 3px solid #0d4da5; border: 3px solid #0d4da5;
border-radius: 18px; border-radius: 18px;
&>* { & > * {
z-index: 9; z-index: 9;
} }
&::before { &::before {
z-index: 1; z-index: 1;
content: ' '; content: ' ';
width: 537px; width: 537px;
height: 247px; height: 247px;
background-image: url('./images/light.svg'); background-image: url('./images/light.svg');
position: absolute; position: absolute;
top: -25%; top: -25%;
left: -35%; left: -35%;
@keyframes toRight { @keyframes toRight {
0% { 0% {
left: -35%; left: -35%;
} }
50% { 50% {
left: 30%; left: 30%;
} }
100% { 100% {
left: -35%; left: -35%;
} }
} }
animation: toRight 10s linear infinite; animation: toRight 10s linear infinite;
} }
&::after { &::after {
z-index: 1; z-index: 1;
content: ' '; content: ' ';
width: 537px; width: 537px;
height: 247px; height: 247px;
background-image: url('./images/light.svg'); background-image: url('./images/light.svg');
transform: rotate(180deg); transform: rotate(180deg);
position: absolute; position: absolute;
bottom: -25%; bottom: -25%;
right: -35%; right: -35%;
@keyframes toLeft { @keyframes toLeft {
0% { 0% {
right: -35%; right: -35%;
} }
50% { 50% {
right: 30%; right: 30%;
} }
100% { 100% {
right: -35%; right: -35%;
} }
} }
animation: toLeft 10s linear infinite; animation: toLeft 10s linear infinite;
} }
} }
} }
.title { .title {
font-size: 52px; font-size: 52px;
font-weight: bold; font-weight: bold;
} }
} }
</style> </style>