main
王文龙 2023-12-15 18:12:46 +08:00
parent 4ce47123c8
commit 888f9af83b
11 changed files with 1644 additions and 1221 deletions

1
components.d.ts vendored
View File

@ -16,6 +16,7 @@ declare module 'vue' {
AppNewsBox: typeof import('./src/components/AppNewsBox.vue')['default'] AppNewsBox: typeof import('./src/components/AppNewsBox.vue')['default']
AppPagination: typeof import('./src/components/AppPagination.vue')['default'] AppPagination: typeof import('./src/components/AppPagination.vue')['default']
ElButton: typeof import('element-plus/es')['ElButton'] ElButton: typeof import('element-plus/es')['ElButton']
ElCascader: typeof import('element-plus/es')['ElCascader']
ElCol: typeof import('element-plus/es')['ElCol'] ElCol: typeof import('element-plus/es')['ElCol']
ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider'] ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker'] ElDatePicker: typeof import('element-plus/es')['ElDatePicker']

File diff suppressed because it is too large Load Diff

View File

@ -1,27 +1,21 @@
<script setup lang="ts"> <script setup lang="ts">
import { import { charData, charData2, pieData1 } from './CSRDatas'
charData,
charData2,
pieData1,
} from './CSRDatas'
import zhCn from 'element-plus/dist/locale/zh-cn.mjs' import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
// const { chartRef, option } = charData() // const { chartRef, option } = charData()
// const { chartRef: chartRef1, option: option1 } = charData2() // const { chartRef: chartRef1, option: option1 } = charData2()
// const { chartRef: chartRefP1, option: optionP1 } = pieData1() // const { chartRef: chartRefP1, option: optionP1 } = pieData1()
import { NNumberAnimation,NDatePicker } from "naive-ui"; import { NNumberAnimation, NDatePicker } from 'naive-ui'
import { ref, onMounted } from 'vue' import { ref, onMounted } from 'vue'
import { import { fetchStatListlBar, fetchStatListlPie } from '@/api/daikin/base'
fetchStatListlBar,fetchStatListlPie
} from '@/api/daikin/base'
const yearrange = ref([new Date(2020,0).valueOf(), new Date().valueOf()]) const yearrange = ref([new Date(2020, 0).valueOf(), new Date().valueOf()])
const pieYear = ref('20') const pieYear = ref('20')
const option = ref<any>({}); const option = ref<any>({})
const option1 = ref({}); const option1 = ref({})
const optionP1 = ref<any>({}); const optionP1 = ref<any>({})
const chartRef = ref<any>(null); const chartRef = ref<any>(null)
const chartRef1 = ref(null); const chartRef1 = ref(null)
const chartRefP1 = ref(null); const chartRefP1 = ref(null)
const locale = computed(() => zhCn) const locale = computed(() => zhCn)
const YearTime1 = ref<any>('2020') const YearTime1 = ref<any>('2020')
const YearTime2 = ref<any>('2023') const YearTime2 = ref<any>('2023')
@ -31,14 +25,14 @@ const cardsClick = (it) => {
console.log(flgs.value) console.log(flgs.value)
// dataInfo.treeSource = it // dataInfo.treeSource = it
} }
const numberObj:any ={ const numberObj: any = {
'Fe':'铁', Fe: '铁',
'Cu':'铜', Cu: '铜',
'Al':'铝', Al: '铝',
'shuzhi':'树脂' shuzhi: '树脂'
} }
const numberList = ['Al','Fe','Cu','shuzhi'] const numberList = ['Al', 'Fe', 'Cu', 'shuzhi']
const pieDecObj = ref<any>({}); const pieDecObj = ref<any>({})
numberList.forEach((item) => { numberList.forEach((item) => {
pieDecObj.value[item + 1] = 0 pieDecObj.value[item + 1] = 0
pieDecObj.value[item + 2] = 0 pieDecObj.value[item + 2] = 0
@ -56,14 +50,14 @@ const getStatListlBar = async ([startYear, endYear] = [2020, 2023]) => {
for (let i = 0; i <= index; i++) { for (let i = 0; i <= index; i++) {
const year = Number(startYear) + i const year = Number(startYear) + i
arr.push(year) arr.push(year)
const item = data.find((it:any) => +it.year === year) const item = data.find((it: any) => +it.year === year)
serieOne.push({value:item ? item.dis : 0,itemStyle:{}}) serieOne.push({ value: item ? item.dis : 0, itemStyle: {} })
serieTwo.push({value:item ? item.dsz : 0,itemStyle:{}}) serieTwo.push({ value: item ? item.dsz : 0, itemStyle: {} })
} }
serieOne[0].itemStyle = { serieOne[0].itemStyle = {
shadowColor: 'rgba(0, 0, 0, 0.7)', shadowColor: 'rgba(0, 0, 0, 0.7)',
shadowOffsetY: 10, shadowOffsetY: 10,
shadowBlur: 20 shadowBlur: 20
} }
option.value.xAxis.data = arr option.value.xAxis.data = arr
option.value.series[0].data = serieOne option.value.series[0].data = serieOne
@ -71,9 +65,12 @@ const getStatListlBar = async ([startYear, endYear] = [2020, 2023]) => {
} }
const statListlPieData = ref([]) const statListlPieData = ref([])
const pieUseTotalData = ref(0) const pieUseTotalData = ref<any>(0)
const pieDischargeTotal = ref(0) const pieDischargeTotal = ref<any>(0)
const getStatListlPie = async ( year = option.value.xAxis.data || '2020', channel = 'DIS') => { const getStatListlPie = async (
year = option.value.xAxis.data || '2020',
channel = 'DIS'
) => {
numberList.forEach((item) => { numberList.forEach((item) => {
pieDecObj.value[item + 1] = 0 pieDecObj.value[item + 1] = 0
pieDecObj.value[item + 2] = 0 pieDecObj.value[item + 2] = 0
@ -84,29 +81,33 @@ const getStatListlPie = async ( year = option.value.xAxis.data || '2020', channe
year, year,
channel channel
}) })
data.forEach((item:any) => { data.forEach((item: any) => {
pieDecObj.value[item.number + item.type] = item.negAmount pieDecObj.value[item.number + item.type] = item.negAmount
});
statListlPieData.value = data || []
optionP1.value.series[0].data = [];
optionP1.value.series[1].data = [];
optionP1.value.title.text = `【FY${pieYear.value}原材料构成数据】`
data?.length && numberList.forEach((item) => {
optionP1.value.series[0].data.push({
name: numberObj[item],
value: pieDecObj.value[item + 1] || '-'
})
pieUseTotalData.value += pieDecObj.value[item + 1] || 0
optionP1.value.series[1].data.push({
name: numberObj[item],
value: pieDecObj.value[item + 2] || '-'
})
pieDischargeTotal.value += pieDecObj.value[item + 2] || 0
}) })
statListlPieData.value = data || []
optionP1.value.series[0].data = []
optionP1.value.series[1].data = []
optionP1.value.title.text = `【FY${pieYear.value}原材料构成数据】`
data?.length &&
numberList.forEach((item) => {
optionP1.value.series[0].data.push({
name: numberObj[item],
value: pieDecObj.value[item + 1] || '-'
})
pieUseTotalData.value += pieDecObj.value[item + 1] || 0
optionP1.value.series[1].data.push({
name: numberObj[item],
value: pieDecObj.value[item + 2] || '-'
})
pieDischargeTotal.value += pieDecObj.value[item + 2] || 0
})
pieUseTotalData.value = Math.trunc(
(pieUseTotalData.value || 0) / 1000
).toLocaleString()
pieDischargeTotal.value = Math.trunc(pieDischargeTotal.value).toLocaleString()
} }
onMounted(() => {
onMounted( () => {
const char = charData() const char = charData()
option.value = char.option.value option.value = char.option.value
// chartRef.value = char.chartRef.value // chartRef.value = char.chartRef.value
@ -120,22 +121,22 @@ onMounted( () => {
getStatListlPie() getStatListlPie()
}) })
const chartClick = (it:any) => { const chartClick = (it: any) => {
option.value.series.forEach((item:any) => { option.value.series.forEach((item: any) => {
item.data.forEach((i:any) => { item.data.forEach((i: any) => {
i.itemStyle = {} i.itemStyle = {}
}) })
}) })
option.value.series[it.seriesIndex].data[it.dataIndex].itemStyle = { option.value.series[it.seriesIndex].data[it.dataIndex].itemStyle = {
shadowColor: 'rgba(0, 0, 0, 0.7)', shadowColor: 'rgba(0, 0, 0, 0.7)',
shadowOffsetY: 10, shadowOffsetY: 10,
shadowBlur: 20 shadowBlur: 20
}; }
getStatListlPie(it.name, it.seriesName) getStatListlPie(it.name, it.seriesName)
pieYear.value = (+it.name).toString().substring(2) pieYear.value = (+it.name).toString().substring(2)
} }
const handleDateChange = (val:any) => { const handleDateChange = (val: any) => {
getStatListlBar(val) getStatListlBar(val)
} }
</script> </script>
@ -178,7 +179,7 @@ const handleDateChange = (val:any) => {
> >
季度 季度
</div> --> </div> -->
<!-- style="border-radius: 15px 15px 15px 0" --> <!-- style="border-radius: 15px 15px 15px 0" -->
<div <div
class="w-90px ml-auto rounded-15px" class="w-90px ml-auto rounded-15px"
:class="flgs === 3 ? 'onStyle' : ''" :class="flgs === 3 ? 'onStyle' : ''"
@ -188,7 +189,12 @@ const handleDateChange = (val:any) => {
</div> </div>
</div> </div>
<div class="w-full h-450px"> <div class="w-full h-450px">
<VChart @click="chartClick" ref="chartRef" :option="option" autoresize /> <VChart
@click="chartClick"
ref="chartRef"
:option="option"
autoresize
/>
</div> </div>
<!-- <div class="absolute top-91% flex items-center"> <!-- <div class="absolute top-91% flex items-center">
日期<el-config-provider :locale="locale"> 日期<el-config-provider :locale="locale">
@ -209,11 +215,19 @@ const handleDateChange = (val:any) => {
</el-config-provider> </el-config-provider>
</div> --> </div> -->
<div class="absolute top-91% flex items-center"> <div class="absolute top-91% flex items-center">
日期<n-date-picker @update:formatted-value="handleDateChange" v-model:value="yearrange" type="yearrange" format="yyyy" size="small" /> 日期<n-date-picker
@update:formatted-value="handleDateChange"
v-model:value="yearrange"
type="yearrange"
format="yyyy"
size="small"
/>
</div> </div>
</div> </div>
<div class="relative w-full bg-#fff h-38.5%"> <div class="relative w-full bg-#fff h-38.5%">
<div class="absolute top-28px left-1/2 translate-[-50%] text-center text-#142142 text-22px py20px font-extrabold"> <div
class="absolute top-28px left-1/2 translate-[-50%] text-center text-#142142 text-22px py20px font-extrabold"
>
SMM牌号低碳铝价格&价差 SMM牌号低碳铝价格&价差
</div> </div>
<div class="w-full h-340px pt-4 relative"> <div class="w-full h-340px pt-4 relative">
@ -250,27 +264,49 @@ const handleDateChange = (val:any) => {
style="align-content: space-between" style="align-content: space-between"
> >
<div class="w-full h-70% bg-#fff" style="border-radius: 25px 25px 0 0"> <div class="w-full h-70% bg-#fff" style="border-radius: 25px 25px 0 0">
<div class="text-center text-#265DD5 text-22px pt20px pb-10px font-extrabold"> <div
class="text-center text-#265DD5 text-22px pt20px pb-10px font-extrabold"
>
原材料用量及碳排放量占比图<br /> 原材料用量及碳排放量占比图<br />
<!-- <span class="text-16px mt10px"> (FY{{pieYear}}BASE基准)</span> --> <!-- <span class="text-16px mt10px"> (FY{{pieYear}}BASE基准)</span> -->
<!-- <div class="h-10px mt10px"> </div> --> <!-- <div class="h-10px mt10px"> </div> -->
</div> </div>
<div class="relative w-full h-430px"> <div class="relative w-full h-430px">
<div class="w-130px h-26px absolute left-0 top-0 bg-white z-10"></div> <div
<div class="absolute top-7 right-6 text-14px leading-20px opacity-90"> class="w-130px h-26px absolute left-0 top-0 bg-white z-10"
<p class="text-right">原材料使用量合计{{ pieUseTotalData }}千克</p> ></div>
<p class="text-right">原材料碳排放量合计{{ pieDischargeTotal }}</p> <div
class="absolute top-7 right-6 text-14px leading-20px opacity-90"
>
<p class="text-right">
原材料使用量合计{{ pieUseTotalData }}
</p>
<p class="text-right">
原材料碳排放量合计{{ pieDischargeTotal }}
</p>
</div> </div>
<VChart ref="chartRefP1" :option="optionP1" autoresize /> <VChart ref="chartRefP1" :option="optionP1" autoresize />
</div> </div>
<div class="box-border pr-20px mx-20px h-130px bg-#F5F8FF p10px"> <div class="box-border pr-20px mx-20px h-130px bg-#F5F8FF p10px">
<div class="py5px" v-for="n in numberList" :key="n"> <div class="py5px" v-for="n in numberList" :key="n">
<!-- <n-number-animation show-separator :from="0" :to="10700"/>碳排放量159,158--> <!-- <n-number-animation show-separator :from="0" :to="10700"/>碳排放量159,158-->
<span class="text-18px font-bold text-#3164BF">{{ numberObj[n] }}</span <span class="text-18px font-bold text-#3164BF">{{
> numberObj[n]
<span class="ml5px">使用量 }}</span>
<n-number-animation show-separator :from="0" :duration="300" :to="pieDecObj[`${n}1`]"/>千克碳排放量 <span class="ml5px"
<n-number-animation show-separator :from="0" :duration="300" :to="pieDecObj[`${n}2`]"/> >使用量
<n-number-animation
show-separator
:from="0"
:duration="300"
:to="pieDecObj[`${n}1`] / 1000"
/>
<n-number-animation
show-separator
:from="0"
:duration="300"
:to="pieDecObj[`${n}2`]"
/>
</span> </span>
</div> </div>
</div> </div>
@ -281,26 +317,22 @@ const handleDateChange = (val:any) => {
</div> </div>
<div class="px20px py10px bg-#F5F8FF rd-5px"> <div class="px20px py10px bg-#F5F8FF rd-5px">
<span class="text-#000 text-16px font-extrabold"> 现行铝</span <span class="text-#000 text-16px font-extrabold"> 现行铝</span>
>
<!-- <span class="text-22px text-#265DD5 font-extrabold">0.000</span <!-- <span class="text-22px text-#265DD5 font-extrabold">0.000</span
><span> /</span> --> ><span> /</span> -->
</div> </div>
<div class="px20px py10px bg-#F5F8FF rd-5px mt5px"> <div class="px20px py10px bg-#F5F8FF rd-5px mt5px">
<span class="text-#000 text-16px font-extrabold"> 低碳铝</span <span class="text-#000 text-16px font-extrabold"> 低碳铝</span>
>
<!-- <span class="text-22px text-#265DD5 font-extrabold">0.000</span <!-- <span class="text-22px text-#265DD5 font-extrabold">0.000</span
><span> /</span> --> ><span> /</span> -->
</div> </div>
<div class="px20px py10px bg-#F5F8FF rd-5px mt5px"> <div class="px20px py10px bg-#F5F8FF rd-5px mt5px">
<span class="text-#000 text-16px font-extrabold"> 碳价</span <span class="text-#000 text-16px font-extrabold"> 碳价</span>
>
<!-- <span class="text-22px text-#265DD5 font-extrabold">0.000</span <!-- <span class="text-22px text-#265DD5 font-extrabold">0.000</span
><span> /</span> --> ><span> /</span> -->
</div> </div>
<div class="px20px py10px bg-#F5F8FF rd-5px mt5px"> <div class="px20px py10px bg-#F5F8FF rd-5px mt5px">
<span class="text-#000 text-16px font-extrabold"> 数据来源</span <span class="text-#000 text-16px font-extrabold"> 数据来源</span>
>
<span class="text-#265DD5">行情展示 (cneeex.com)</span> <br /> <span class="text-#265DD5">行情展示 (cneeex.com)</span> <br />
<div class="ml-82px mt-6px">SMM网站</div> <div class="ml-82px mt-6px">SMM网站</div>
</div> </div>
@ -308,7 +340,10 @@ const handleDateChange = (val:any) => {
class="absolute flex flex-col w-full h-full z-200 top-0 left-0 text-center bg-red justify-center items-center" class="absolute flex flex-col w-full h-full z-200 top-0 left-0 text-center bg-red justify-center items-center"
style="background-color: rgba(255, 255, 255, 0.8)" style="background-color: rgba(255, 255, 255, 0.8)"
> >
<img src="@/assets/images/chah.png" class="h-130px object-contain" /> <img
src="@/assets/images/chah.png"
class="h-130px object-contain"
/>
<br /> <br />
<div class="text-#5683DB text-36px">做成中,敬请期待</div> <div class="text-#5683DB text-36px">做成中,敬请期待</div>
</div> </div>
@ -328,7 +363,7 @@ const handleDateChange = (val:any) => {
background: #ecf3ff; background: #ecf3ff;
} }
} }
:deep(.n-date-picker){ :deep(.n-date-picker) {
width: 200px !important; width: 200px !important;
} }
</style> </style>

View File

@ -1,8 +1,8 @@
import type { EChartsOption } from 'echarts' import type { EChartsOption } from 'echarts'
import * as echarts from 'echarts' import * as echarts from 'echarts'
import 'echarts-liquidfill'; import 'echarts-liquidfill'
import {getCSRDetail} from '@/api/daikin/base' import { getCSRDetail } from '@/api/daikin/base'
import { create } from 'naive-ui'; import { create } from 'naive-ui'
import { xAxisD, dataA, dataB } from './testData' import { xAxisD, dataA, dataB } from './testData'
export const Content2 = [ export const Content2 = [
@ -600,7 +600,7 @@ export function pieData1() {
orient: 'vertical', orient: 'vertical',
data: [ data: [
{ {
name: '原材料使用量(千克', name: '原材料使用量(',
itemStyle: { color: '#f8cbad', borderWidth: 0 } itemStyle: { color: '#f8cbad', borderWidth: 0 }
}, },
{ {
@ -619,7 +619,27 @@ export function pieData1() {
textStyle: { color: '#4075E1' } textStyle: { color: '#4075E1' }
}, },
tooltip: { tooltip: {
trigger: 'item' trigger: 'item',
// formatter: '{a} <br/>{b} : {c} ({d}%)'
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 (
title +
colorDot +
params.name +
': ' +
(params.componentIndex === 0
? Math.trunc(params.value / 1000).toLocaleString()
: params.value.toLocaleString()) +
'' +
params.percent +
'%'
)
}
}, },
grid: { grid: {
// left: '20', // left: '20',
@ -636,7 +656,7 @@ export function pieData1() {
series: [ series: [
{ {
center: ['50%', '56%'], center: ['50%', '56%'],
name: '原材料使用量(千克', name: '原材料使用量(',
type: 'pie', type: 'pie',
selectedMode: 'single', selectedMode: 'single',
radius: [0, '50%'], radius: [0, '50%'],
@ -646,7 +666,10 @@ export function pieData1() {
label: { label: {
position: 'inner', position: 'inner',
fontSize: 16, fontSize: 16,
formatter: '{b}{c}' // formatter: '{b}{c}'
formatter: function (params: any) {
return Math.trunc(params.data.value / 1000).toLocaleString()
}
}, },
labelLine: { labelLine: {
show: false show: false
@ -693,7 +716,10 @@ export function pieData1() {
label: { label: {
position: 'inner', position: 'inner',
fontSize: 16, fontSize: 16,
formatter: '{b}{c}' // formatter: '{b}{c}'
formatter: function (params: any) {
return Math.trunc(+params.data.value).toLocaleString()
}
// backgroundColor: '#F6F8FC', // backgroundColor: '#F6F8FC',
// borderColor: '#8C8D8E', // borderColor: '#8C8D8E',
// borderWidth: 1, // borderWidth: 1,
@ -808,81 +834,81 @@ export function pieData2() {
const gl = '10%' const gl = '10%'
export function liQuid() { export function liQuid() {
const chartRef = ref() const chartRef = ref()
const option = ref({ const option = ref({
title: { title: {
text: '整体目标加' + gl, text: '整体目标加' + gl,
// subtext: 'Fake Data', // subtext: 'Fake Data',
left: 'center', left: 'center',
bottom: '-5px', bottom: '-5px',
textStyle: { fontSize: '14px', fontWeight: '100' } textStyle: { fontSize: '14px', fontWeight: '100' }
}, },
series: [{ series: [
type: 'liquidFill', {
silent: true, type: 'liquidFill',
data: [0.76, 0.55, 0.62], silent: true,
color: ['#41E5BA', '#B1D2FF', '#63E8C4'], data: [0.76, 0.55, 0.62],
radius: '150px', color: ['#41E5BA', '#B1D2FF', '#63E8C4'],
backgroundStyle: { radius: '150px',
// borderWidth: 0, backgroundStyle: {
// borderColor: 'red', // borderWidth: 0,
opacity: '0.4', // borderColor: 'red',
color: '#00D491' opacity: '0.4',
// color:'#63E8C4' color: '#00D491'
}, // color:'#63E8C4'
outline: { },
show: false outline: {
}, show: false
label: { },
fontSize: 19, label: {
fontColor: '#fff', fontSize: 19,
formatter: function (param) { fontColor: '#fff',
return '原材料' + '\n'+ '\n' formatter: function (param) {
+ (param.value * 100) + '%'; return '原材料' + '\n' + '\n' + param.value * 100 + '%'
}, }
} }
}] }
]
}) })
return { chartRef, option } return { chartRef, option }
} }
export function liQuids() { export function liQuids() {
const chartRef = ref() const chartRef = ref()
const option = ref({ const option = ref({
title: { title: {
text: '整体目标加' + gl, text: '整体目标加' + gl,
// subtext: 'Fake Data', // subtext: 'Fake Data',
left: 'center', left: 'center',
bottom: '-5px', bottom: '-5px',
textStyle: { fontSize: '14px', fontWeight: '100' } textStyle: { fontSize: '14px', fontWeight: '100' }
}, },
series: [{ series: [
type: 'liquidFill', {
silent: true, type: 'liquidFill',
data: [0.8, 0.65, 0.72], silent: true,
color: ['#8CBEFF', '#B1D2FF', '#8CBEFF'], data: [0.8, 0.65, 0.72],
radius: '150px', color: ['#8CBEFF', '#B1D2FF', '#8CBEFF'],
backgroundStyle: { radius: '150px',
// borderWidth: 0, backgroundStyle: {
// borderColor: 'red', // borderWidth: 0,
opacity: '0.6', // borderColor: 'red',
color: '#1D88FF' opacity: '0.6',
// color:'#63E8C4' color: '#1D88FF'
}, // color:'#63E8C4'
outline: { },
show: false outline: {
}, show: false
label: { },
fontSize: 19, label: {
fontColor: '#fff', fontSize: 19,
formatter: function (param) { fontColor: '#fff',
return '能源消耗' + '\n'+ '\n' formatter: function (param) {
+ (param.value * 100) + '%'; return '能源消耗' + '\n' + '\n' + param.value * 100 + '%'
}, }
} }
}] }
]
}) })
return { chartRef, option } return { chartRef, option }
} }

View File

@ -1,39 +1,56 @@
<script setup lang="ts"> <script setup lang="ts">
import DataBaseHead from "@/views/home/components/DataBaseHead.vue"; import DataBaseHead from '@/views/home/components/DataBaseHead.vue'
import { cateAdd, cateUpdate, treeDbList, cateInfo, cateDel, cateFileUpdate, cateFileDel, cateFileList, download,fetchdbAuthGetInfo } from '@/api/daikin/base' import {
cateAdd,
cateUpdate,
treeDbList,
cateInfo,
cateDel,
cateFileUpdate,
cateFileDel,
cateFileList,
download,
fetchdbAuthGetInfo
} 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 } from 'naive-ui'
const store = 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)
const isDbReview = store.user?.isDbReview === 1
const isDbUpload = store.user?.isDbUpload === 1
const user: any = store.user const user: any = store.user
const { push } = useRouter(); const { push } = useRouter()
const title = ref("大金集团经营理念") const title = ref('大金集团经营理念')
const prop = defineProps({ const prop = defineProps({
cateId: Number, cateId: Number,
title:String title: String
}) })
const pageInfo = reactive({ const pageInfo = reactive({
currentPage:1, currentPage: 1,
pageSize:13, pageSize: 13,
total:10 total: 10
}) })
watchEffect(()=>{ watchEffect(() => {
prop.cateId prop.cateId
prop.title prop.title
title.value = prop.title title.value = prop.title
getTree() getTree()
getAuth() // getAuth()
}) })
const tableData = ref() const tableData = ref()
async function getTree() { async function getTree() {
const {currentPage,pageSize} = pageInfo const { currentPage, pageSize } = pageInfo
if(!prop.cateId) return if (!prop.cateId) return
const {rows,total} = await cateFileList({cateId:prop.cateId,pageNum:currentPage,pageSize}) const { rows, total } = await cateFileList({
pageInfo.total =total cateId: prop.cateId,
tableData.value = rows pageNum: currentPage,
pageSize
})
pageInfo.total = total
tableData.value = rows
} }
// async function downloads(row) { // async function downloads(row) {
// console.log(row) // console.log(row)
@ -58,73 +75,89 @@ async function getTree() {
// // message.error('', error); // // message.error('', error);
// } // }
// } // }
async function downloads(row:any) { async function downloads(row: any) {
console.log(row,'!!!!!!!!!!xiazai') console.log(row, '!!!!!!!!!!xiazai')
const {isSelect,filePath} = row const { isSelect, filePath } = row
if(isSelect === 2) { if (isSelect === 2) {
message.info("没有访问权限") message.info('没有访问权限')
return return
} }
// try{ // try{
// downloadFile(filePath) // downloadFile(filePath)
// }catch(error){ // }catch(error){
// } // }
window.open(filePath) // window.open(
// 'https://view.officeapps.live.com/op/view.aspx?src=' +
// encodeURIComponent(filePath)
// )
filePath && window.open(filePath)
} }
const lazyState = computed(() => [pageInfo.currentPage]) const lazyState = computed(() => [pageInfo.currentPage])
watch( watch(
() => unref(lazyState), () => unref(lazyState),
async (v) => { async (v) => {
getTree() getTree()
}, },
{ immediate: true, deep: true }, { immediate: true, deep: true }
) )
const handleSizeChange=(e)=>{ const handleSizeChange = (e) => {
console.log(e) console.log(e)
} }
const handleCurrentChange=(e)=>{ const handleCurrentChange = (e) => {
console.log(e) console.log(e)
} }
// //
const srcType = ref() const srcType = ref()
const src = ref() const src = ref()
const pdfShow = ref(false) const pdfShow = ref(false)
const showModalRef2 =ref(false) const showModalRef2 = ref(false)
const openUrl = async (it)=>{ const openUrl = async (it) => {
console.log(it,2222) console.log(it, 2222)
let {filePath,isSelect} = it let { filePath, isSelect } = it
if(isSelect === 2) { if (isSelect === 2) {
message.info("没有访问权限") message.info('没有访问权限')
return return
} }
if(!filePath) { if (!filePath) {
message.info("没有可预览文件!") message.info('没有可预览文件!')
return return
} }
srcType.value = getLastSubstring(filePath) srcType.value = getLastSubstring(filePath)
if(['doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx','pdf'].includes(srcType.value)){ if (
// src.value = filePath ['doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx', 'pdf'].includes(srcType.value)
// pdfShow.value = true ) {
filePath='https://view.xdocin.com/view?src='+filePath // src.value = filePath
const screenWidth = window.screen.width; // pdfShow.value = true
const screenHeight = window.screen.height; filePath = 'https://view.xdocin.com/view?src=' + filePath
window.open(filePath, '', 'width=' + screenWidth + ',height=' + screenHeight + ',top=' + 0 + ',left=' + 0) const screenWidth = window.screen.width
} const screenHeight = window.screen.height
else{ window.open(
message.error("文件格式不是 'doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx','pdf'") filePath,
} '',
'width=' +
screenWidth +
',height=' +
screenHeight +
',top=' +
0 +
',left=' +
0
)
} else {
message.error(
"文件格式不是 'doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx','pdf'"
)
}
} }
function getLastSubstring(str: string): string { function getLastSubstring(str: string): string {
const lastIndex = str.lastIndexOf('.'); const lastIndex = str.lastIndexOf('.')
if (lastIndex !== -1) { if (lastIndex !== -1) {
return str.substring(lastIndex + 1); return str.substring(lastIndex + 1)
} else { } else {
return ''; return ''
} }
} }
function downloadFile(url: any) { function downloadFile(url: any) {
fetch(url) fetch(url)
@ -143,37 +176,37 @@ function getFileName(url: string) {
return url.slice(lastSplashIndex + 1, lastDotIndex) return url.slice(lastSplashIndex + 1, lastDotIndex)
} }
function getFileNameFromUrl(url: string) { function getFileNameFromUrl(url: string) {
const lastSlashIndex = url.lastIndexOf("/"); const lastSlashIndex = url.lastIndexOf('/')
if (lastSlashIndex !== -1) { if (lastSlashIndex !== -1) {
return url.substring(lastSlashIndex + 1); return url.substring(lastSlashIndex + 1)
} else { } else {
return "Invalid URL"; return 'Invalid URL'
} }
} }
// //
const hasUpload = ref(false) const hasUpload = ref(false)
const hasReview = ref(false) const hasReview = ref(false)
async function getAuth() { async function getAuth() {
if (!prop.cateId) return if (!prop.cateId) return
const { data: uploadUser = [] } = await fetchdbAuthGetInfo({ const { data: uploadUser = [] } = await fetchdbAuthGetInfo({
cateId: prop.cateId, cateId: prop.cateId,
type: 1 type: 1
}) })
hasUpload.value = uploadUser.findIndex((x:any) => x.userId === user?.id) > -1 hasUpload.value = uploadUser.findIndex((x: any) => x.userId === user?.id) > -1
const { data: reviewUser = [] } = await fetchdbAuthGetInfo({ const { data: reviewUser = [] } = await fetchdbAuthGetInfo({
cateId: prop.cateId, cateId: prop.cateId,
type: 2 type: 2
}) })
hasReview.value = reviewUser.findIndex((x:any) => x.userId === user?.id) > -1 hasReview.value = reviewUser.findIndex((x: any) => x.userId === user?.id) > -1
} }
</script> </script>
<template> <template>
<DataBaseHead /> <DataBaseHead />
<div class="w-full h-1px bg-#507FFD mt50px rd-b-20px"></div> <div class="w-full h-1px bg-#507FFD mt50px rd-b-20px"></div>
<div class="w-full h-95%"> <div class="w-full h-95%">
<!-- <div class="px30px flex text-center py40px"> <!-- <div class="px30px flex text-center py40px">
<div class="bg-#6C93F8 text-#fff px20px pt18px pb-15px w-180px rd-10px mr-15px"> <div class="bg-#6C93F8 text-#fff px20px pt18px pb-15px w-180px rd-10px mr-15px">
<img src="@/assets/images/xinxi@2x.png" class="w30px mr-5px mt--3px" /><span>公司经营信息</span> <img src="@/assets/images/xinxi@2x.png" class="w30px mr-5px mt--3px" /><span>公司经营信息</span>
</div> </div>
@ -192,69 +225,130 @@ async function getAuth() {
</div> --> </div> -->
<div class="bg-#fff rd-15px px30px pt30px w-full h930px "> <div class="bg-#fff rd-15px px30px pt30px w-full h930px">
<div class=" rd-15px w-full h870px " style="box-shadow: 1px 2px 26px -3px #cdcccc;"> <div
<div class="h80px rd-t-15px bg-#4877FB leading-80px text-#fff text-20px"> class="rd-15px w-full h870px"
<img src="@/assets/images/Shape7@2x.png" class="w50px ml-30px mr10px mt--20px" /> style="box-shadow: 1px 2px 26px -3px #cdcccc"
{{ title }} >
<el-button v-if=" userCode || hasUpload || hasReview" class="float-right top-25px right-30px" type="primary" @click="push('/DataBase/Modify')"></el-button> <div
</div> class="h80px rd-t-15px bg-#4877FB leading-80px text-#fff text-20px"
<div class="p30px relative h790px"> >
<!-- lujinli --> <img
<!-- <table class="history w-full text-center text-16px border-spacing-0 "> --> src="@/assets/images/Shape7@2x.png"
<table class="history w-full text-center text-18px border-spacing-0 "> class="w50px ml-30px mr10px mt--20px"
<thead />
style="background-color: #E7EDFF;color: #000;height: 50px;width: 220px; border: 1px solid #417BEF;"> {{ title }}
<tr class="text-20px leading-50px"> <div class="float-right top-0 right-30px">
<th width="20%"><img src="@/assets/images/baiot@2x.png" class="w35px mt--7px mr-5px" />标题</th> <el-button
<th width="20%"><img src="@/assets/images/scbmm@2x.png" class="w35px mt--7px mr-5px" />上传科室</th> class="mr-30px"
<th width="20%"><img src="@/assets/images/scbmm@2x.png" class="w35px mt--7px mr-5px" />上传部门</th> v-if="isDbReview || isDbUpload || userCode"
<th width="20%"><img src="@/assets/images/riqii@2x.png" class="w35px mt--7px mr-5px" />上传日期</th> type="warning"
<th width="16%">操作</th> @click="push({ path: '/DataBase/review' })"
</tr> >
</thead> 审批流程
<tbody class=" h650px overflow-auto absolute w100% "> </el-button>
<tr class="w-full flex leading-50px" v-for="it in tableData"> <el-button
<td class="w20% h50px cursor-pointer overflow-hidden text-left pl25px truncate text-#000" > v-if="isDbReview || isDbUpload || userCode"
type="primary"
<span :title="it.title" > {{it.title}}</span> @click="push('/DataBase/Modify')"
>内容管理</el-button
>
</td> </div>
<td class="w20% h50px">{{it.deptName}}</td> </div>
<td class="w20% h50px">{{it.parentDeptName}}</td> <div class="p30px relative h790px">
<td class="w20% h50px">{{it.createTime}}</td> <!-- lujinli -->
<td class="w16% h50px text-center"> <!-- <table class="history w-full text-center text-16px border-spacing-0 "> -->
<!-- <el-button style="color: #000;" @click="openUrl(it)"></el-button> --> <table class="history w-full text-center text-18px border-spacing-0">
<!-- <el-button style="color: #000;" @click="downloads(it)"></el-button> --> <thead
<el-button style="color: #000;" @click="downloads(it)"></el-button> style="
</td> background-color: #e7edff;
</tr> color: #000;
</tbody> height: 50px;
</table> width: 220px;
<div class="float-right absolute bottom-20px right-30px"> border: 1px solid #417bef;
<el-pagination v-model:current-page="pageInfo.currentPage" v-model:page-size="pageInfo.pageSize" "
layout="prev, pager, next, jumper" :total="pageInfo.total" >
@size-change="handleSizeChange" @current-change="handleCurrentChange" /> <tr class="text-20px leading-50px">
</div> <th width="20%">
<img
</div> src="@/assets/images/baiot@2x.png"
</div> class="w35px mt--7px mr-5px"
</div> />
</div> </th>
<n-modal v-model:show="pdfShow"> <th width="20%">
<img
<div class="w100% h100% "> src="@/assets/images/scbmm@2x.png"
<el-icon color="#fff" size="26px" @click="pdfShow=false" class="absolute left-92% bg-#F43"><Close /></el-icon> class="w35px mt--7px mr-5px"
<Amtion :data="src" :datas="srcType" /> />
</div> </th>
</n-modal> <th width="20%">
<img
src="@/assets/images/scbmm@2x.png"
class="w35px mt--7px mr-5px"
/>
</th>
<th width="20%">
<img
src="@/assets/images/riqii@2x.png"
class="w35px mt--7px mr-5px"
/>
</th>
<th width="20% text-center">操作</th>
</tr>
</thead>
<tbody class="h650px overflow-auto absolute w-full">
<tr class="w-full flex leading-50px" v-for="it in tableData">
<td
class="w20% h50px cursor-pointer overflow-hidden text-left pl25px truncate text-#000"
>
<span :title="it.title"> {{ it.title }}</span>
</td>
<td class="w20% h50px">{{ it.deptName }}</td>
<td class="w20% h50px">{{ it.parentDeptName }}</td>
<td class="w20% h50px">{{ it.createTime }}</td>
<td class="w20% h50px">
<!-- <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
>
</td>
</tr>
</tbody>
</table>
<div class="float-right absolute bottom-20px right-30px">
<el-pagination
v-model:current-page="pageInfo.currentPage"
v-model:page-size="pageInfo.pageSize"
layout="prev, pager, next, jumper"
:total="pageInfo.total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div>
</div>
</div>
</div>
</div>
<n-modal v-model:show="pdfShow">
<div class="w100% h100%">
<el-icon
color="#fff"
size="26px"
@click="pdfShow = false"
class="absolute left-92% bg-#F43"
><Close
/></el-icon>
<Amtion :data="src" :datas="srcType" />
</div>
</n-modal>
</template> </template>
<style> <style>
.truncate { .truncate {
display: block; display: block;
/* max-width: 226px; */ /* max-width: 226px; */
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
}</style> }
</style>

View File

@ -1,11 +1,12 @@
<script setup lang="ts"> <script setup lang="ts">
import { RouterView } from 'vue-router' import { RouterView } from 'vue-router'
import { useUserStore } from '@/stores/modules/user' import { useUserStore } from '@/stores/modules/user'
import { treeDbList,download } from '@/api/daikin/base' import { treeDbList, download } from '@/api/daikin/base'
import {databaseld} from "@/stores/modules/database" import { databaseld } from '@/stores/modules/database'
import { NPopover } from 'naive-ui' import { NPopover } from 'naive-ui'
const { push } = useRouter() const { push } = useRouter()
const route = useRoute()
const store = useUserStore() const store = useUserStore()
const database = databaseld() const database = databaseld()
const { toggle } = inject<any>('fullscreen') const { toggle } = inject<any>('fullscreen')
@ -14,242 +15,290 @@ let idx = ref(0)
const onClic = ref(false) const onClic = ref(false)
const titles = ref() const titles = ref()
function menuHandler(menu: any, index: number) { function menuHandler(menu: any, index: number) {
console.log(menu,index) console.log(menu, index)
activeMenuKey.value = menu.id activeMenuKey.value = menu.id
titles.value = menu.name titles.value = menu.name
idx.value = index; idx.value = index
activeItem.value = menu.id activeItem.value = menu.id
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
} }
database.database.id =activeItem.value database.database.id = activeItem.value
goListPage()
} }
function goChild(menu: any) { function goChild(menu: any) {
activeItem.value = menu.id activeItem.value = menu.id
console.log(menu.id) console.log(menu.id)
database.database.id =menu.id database.database.id = menu.id
goListPage()
}
function goListPage() {
const { path } = route
if (path === '/DataBase/review') push('/DataBase')
} }
var activeItem = ref<any>() var activeItem = ref<any>()
const tableData = ref() const tableData = ref()
async function getTree() { async function getTree() {
const { data = [] } = await treeDbList({}) const { data = [] } = await treeDbList({})
tableData.value = data tableData.value = data
if(data&&data[0]){
// console.log(data[0])
titles.value = data[0].name
activeMenuKey.value = data[0].id
database.database.id = data[0].id
// if(data[0].childList&&data[0].childList.length>0){
// activeItem.value = data[0].childList[0].id
// activeMenuKey.value = data[0].childList[0].id
// }
}
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)
})
}
}
if (data && data[0]) {
// console.log(data[0])
titles.value = data[0].name
activeMenuKey.value = data[0].id
database.database.id = data[0].id
// if(data[0].childList&&data[0].childList.length>0){
// activeItem.value = data[0].childList[0].id
// activeMenuKey.value = data[0].childList[0].id
// }
}
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()
function findItemById(
items: any,
function findItemById(items:any, targetId:any, topLevelItem:any = null):any { targetId: any,
for (let i = 0; i < items.length; i++) { topLevelItem: any = null
const item = items[i]; ): any {
if (item.id === targetId) { for (let i = 0; i < items.length; i++) {
return { topLevelItem: topLevelItem || item, targetItem: item }; const item = items[i]
} else if (item.childList?.length > 0) { if (item.id === targetId) {
const result = findItemById(item.childList, targetId, topLevelItem || item); return { topLevelItem: topLevelItem || item, targetItem: item }
if (result) { } else if (item.childList?.length > 0) {
return result; const result = findItemById(
} item.childList,
} targetId,
} topLevelItem || item
return {topLevelItem: null, targetItem: null}; )
if (result) {
return result
}
}
}
return { topLevelItem: null, targetItem: null }
} }
</script> </script>
<template> <template>
<div class="page w-1920px h-1080px flex"> <div class="page w-1920px h-1080px flex">
<div class="w350px -mr-1px flex flex-col shrink-0 overflow-auto"> <div class="w350px -mr-1px flex flex-col shrink-0 overflow-auto">
<div class="p30px bg-#000 "> <div class="p30px bg-#000">
<!-- @dblclick="toggle" --> <!-- @dblclick="toggle" -->
<img src="@/assets/images/logo@2x.png" class="w197px h44px mt14px" /> <img src="@/assets/images/logo@2x.png" class="w197px h44px mt14px" />
</div> </div>
<div class="pt30px pb24px flex-1 pl20px bg-#fff">
<div class="pt30px pb24px flex-1 pl20px bg-#fff"> <div
class="nav px36px py24px m10px mr0 rd-32px rd-r-0 flex flex-col text-#000 cursor-pointer"
<div class="nav px36px 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" :class="activeMenuKey === m.id ? (m.childList ? 'actives' : 'active') : ''" :key="m.id"
@click="() => menuHandler(m, index)"> :class="
<div :class="activeMenuKey === m.id && 'onActive'" class="flex" @click="onClic=!onClic"> activeMenuKey === m.id ? (m.childList ? 'actives' : 'active') : ''
<!-- <img v-if="activeMenuKey === m.id" :src="m.icon1" class="w22px h22px mr16px mt--5px" /> "
@click="() => menuHandler(m, index)"
>
<div
:class="activeMenuKey === m.id && 'onActive'"
class="flex"
@click="onClic = !onClic"
>
<!-- <img v-if="activeMenuKey === m.id" :src="m.icon1" class="w22px h22px mr16px mt--5px" />
<img v-else :src="m.icon" class="w22px h22px mr16px mt--5px" /> --> <img v-else :src="m.icon" class="w22px h22px mr16px mt--5px" /> -->
<!-- lujinli --> <!-- lujinli -->
<!-- <span class="text-17px font-900 relative min-w195px block"> --> <!-- <span class="text-17px font-900 relative min-w195px block"> -->
<span class="text-18px font-900 relative min-w195px block"> <span class="text-18px font-900 relative min-w195px block">
<span class="truncate"> {{ m.name }} </span> <span class="truncate"> {{ m.name }} </span>
<span class="text-#000000 absolute right--30px top--5px"><el-icon size="26"> <span class="text-#000000 absolute right--30px top--5px"
<CaretTop v-if="activeMenuKey === m.id&&onClic" class="text-#4977FC" /> ><el-icon size="26">
<CaretBottom v-else /> <CaretTop
</el-icon></span> v-if="activeMenuKey === m.id && onClic"
</span> class="text-#4977FC"
</div> />
<CaretBottom v-else /> </el-icon
></span>
</span>
</div>
<div v-if="m.childList && idx == index" class="pl40px" v-show="idx === index&&onClic?true:false"> <div
<div class="my30px pl10px text-#000 activeChildren" v-for="(item, ind) in m.childList" :key="item.id" v-if="m.childList && idx == index"
@click.stop="goChild(item)" @click="activeItem = item.id" > class="pl40px"
<!-- <el-tooltip :content="item.name" placement="top-start" effect="light"> --> v-show="idx === index && onClic ? true : false"
<n-popover trigger="hover" placement="top-start"> >
<template #trigger> <div
<span class="text-18px flex child font-900 truncate" :class="activeItem === item.id ? 'text-#002fa7' : ''">{{ item.name }}</span> class="my30px pl10px text-#000 activeChildren"
</template> v-for="(item, ind) in m.childList"
<div class="text-18px leading-40px"> :key="item.id"
{{ item.name }} @click.stop="goChild(item)"
</div> @click="activeItem = item.id"
</n-popover> >
<!-- </el-tooltip> --> <!-- <el-tooltip :content="item.name" placement="top-start" effect="light"> -->
<n-popover trigger="hover" placement="top-start">
<template #trigger>
<span
class="text-18px flex child font-900 truncate"
:class="activeItem === item.id ? 'text-#002fa7' : ''"
>{{ item.name }}</span
>
</template>
<div class="text-18px leading-40px">
{{ item.name }}
</div>
</n-popover>
<!-- </el-tooltip> -->
<div v-if="item.childList && idx == index" class="pl10px">
<div
class="my30px pl10px text-#000"
v-for="(ite, ind) in item.childList"
:key="item.id"
@click.stop="goChild(ite)"
@click="activeItem = ite.id"
>
<n-popover trigger="hover" placement="top-start">
<template #trigger>
<span
class="text-18px flex childs font-900 truncate"
:class="activeItem === ite.id ? 'text-#002fa7' : ''"
>{{ ite.name }}</span
>
</template>
<div class="text-18px leading-40px">
{{ ite.name }}
</div>
</n-popover>
<div v-if="item.childList && idx == index" class="pl10px"> <div v-if="ite.childList && idx == index" class="pl10px">
<div class="my30px pl10px text-#000 " v-for="(ite, ind) in item.childList" :key="item.id" <div
@click.stop="goChild(ite)" @click="activeItem = ite.id"> class="my30px pl10px text-#000"
<n-popover trigger="hover" placement="top-start"> v-for="(it, ind) in ite.childList"
<template #trigger> :key="item.id"
<span class="text-18px flex childs font-900 truncate" :class="activeItem === ite.id ? 'text-#002fa7' : ''">{{ ite.name }}</span> @click.stop="goChild(it)"
</template> @click="activeItem = it.id"
<div class="text-18px leading-40px"> >
{{ ite.name }} <n-popover trigger="hover" placement="top-start">
</div> <template #trigger>
</n-popover> <span
class="text-18px flex childs font-900 truncate"
:class="activeItem === it.id ? 'text-#002fa7' : ''"
>{{ it.name }}</span
>
</template>
<div class="text-18px leading-40px">
{{ it.name }}
</div>
</n-popover>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div v-if="ite.childList && idx == index" class="pl10px"> <div class="main flex-1 pb15px pt0px relative">
<div class="my30px pl10px text-#000 " v-for="(it, ind) in ite.childList" :key="item.id" <!-- <Home /> -->
@click.stop="goChild(it)" @click="activeItem = it.id"> <RouterView :cateId="activeItem" :title="titles" />
<n-popover trigger="hover" placement="top-start"> </div>
<template #trigger> </div>
<span class="text-18px flex childs font-900 truncate" :class="activeItem === it.id ? 'text-#002fa7' : ''">{{ it.name }}</span>
</template>
<div class="text-18px leading-40px">
{{ it.name }}
</div>
</n-popover>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="main flex-1 pb15px pt0px relative ">
<!-- <Home /> -->
<RouterView :cateId="activeItem" :title="titles"/>
</div>
</div>
</template> </template>
<style scoped lang="less"> <style scoped lang="less">
.truncate { .truncate {
display: block; display: block;
max-width: 226px; max-width: 226px;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.page { .page {
font-family: 'PingFang SC'; font-family: 'PingFang SC';
user-select: none; user-select: none;
background-image:none; background-image: none;
background-color: #cacaca; background-color: #cacaca;
background-position: 0 0; background-position: 0 0;
background-repeat: no-repeat; background-repeat: no-repeat;
background-size: cover; background-size: cover;
// color: #3b3b3b; // color: #3b3b3b;
color: #000; color: #000;
line-height: 1; line-height: 1;
} }
.nav { .nav {
&::before {
top: -48px;
}
.child:hover {
text-decoration: underline;
}
.childs:hover {
text-decoration: underline;
}
&::after {
bottom: -49px;
transform: rotate(-90deg);
}
&::before { &.active {
top: -48px; color: #002fa7;
} background-color: #e6ecff;
.child:hover {
text-decoration: underline;
}
.childs:hover {
text-decoration: underline;
}
&::after { a {
bottom: -49px; color: #002fa7;
transform: rotate(-90deg); }
}
&.active { &::before,
color: #002fa7; &::after {
background-color: #E6ECFF; opacity: 1;
}
}
a { &.actives {
color: #002fa7; padding: 0px !important;
} color: #4977fc;
background-color: #f5f8ff;
&::before, a {
&::after { color: #002fa7;
opacity: 1; }
}
}
&.actives { &::before,
padding: 0px !important; &::after {
color: #4977FC; opacity: 1;
background-color: #F5F8FF; }
a { .onActive {
color: #002fa7; background-color: #e6ecff;
} border-radius: 32px 0 0 32px;
&::before, padding: 24px 36px 24px 36px;
&::after { }
opacity: 1; }
}
.onActive {
background-color: #E6ECFF;
border-radius: 32px 0 0 32px;
padding: 24px 36px 24px 36px;
}
}
} }
.main { .main {
width: 100%;
width: 100%; height: 95%;
height: 95%; background-color: #4877fb;
background-color: #4877FB; margin-left: 30px;
margin-left: 30px;
} }
&::-webkit-scrollbar { &::-webkit-scrollbar {
display: none; display: none;
scrollbar-width: none scrollbar-width: none;
}</style> }
</style>

View File

@ -6,7 +6,7 @@
<el-tabs v-model="activeName" class="demo-tabs"> <el-tabs v-model="activeName" class="demo-tabs">
<div class="absolute z-200 right-0 flex items-center"> <div class="absolute z-200 right-0 flex items-center">
<el-button <el-button
v-if="hasReview || hasUpload" v-if="isDbUpload || isDbReview"
type="warning" type="warning"
@click="handleClick" @click="handleClick"
> >
@ -20,8 +20,13 @@
</div> </div>
</div> </div>
<el-tab-pane label="分类管理" name="first"> <el-tab-pane label="分类管理" name="first">
<div class="h-52px "> <div class="h-52px">
<el-button v-if="userCode" type="primary" @click="editClickA('add')" class="mb-20px"> <el-button
v-if="userCode"
type="primary"
@click="editClickA('add')"
class="mb-20px"
>
新增 新增
</el-button> </el-button>
</div> </div>
@ -87,41 +92,41 @@
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="内容管理" name="second"> <el-tab-pane label="内容管理" name="second">
<div class="h-52px "> <div class="h-52px">
<el-button <el-button
v-if="hasUpload" v-if="isDbReview || isDbUpload"
type="primary" type="primary"
@click="editClickB('add')" @click="editClickB('add')"
class="mb-20px" class="mb-20px"
> >
新增</el-button 新增</el-button
> >
<el-button <el-button
v-if="userCode" v-if="userCode"
type="primary" type="primary"
@click="getAll" @click="getAll"
class="mb-20px" class="mb-20px"
> >
查看所有</el-button 查看所有</el-button
> >
<el-button <el-button
v-if="userCode" v-if="userCode"
:type="setUpload ? 'success' : 'warning'" :type="setUpload ? 'success' : 'warning'"
:icon="setUpload ? 'Check' : ''" :icon="setUpload ? 'Check' : ''"
@click="getUser({ type: 1 })" @click="getUser({ type: 1 })"
class="mb-20px !ml-50px" class="mb-20px !ml-50px"
> >
{{ setUpload ? '已设置上传人员' : '设置上传人员' }}</el-button {{ setUpload ? '已设置上传人员' : '设置上传人员' }}</el-button
> >
<el-button <el-button
v-if="userCode" v-if="userCode"
:type="setReview ? 'success' : 'warning'" :type="setReview ? 'success' : 'warning'"
:icon="setReview ? 'Check' : ''" :icon="setReview ? 'Check' : ''"
@click="getUser({ type: 2 })" @click="getUser({ type: 2 })"
class="mb-20px" class="mb-20px"
> >
{{ setReview ? '已设置审批人员' : '设置审批人员' }}</el-button {{ setReview ? '已设置审批人员' : '设置审批人员' }}</el-button
> >
</div> </div>
<div class="w100% h750px overflow-auto"> <div class="w100% h750px overflow-auto">
<el-table <el-table
@ -166,30 +171,37 @@
show-overflow-tooltip show-overflow-tooltip
/> />
<!-- <el-table-column label="排序" prop="sort" show-overflow-tooltip/> --> <!-- <el-table-column label="排序" prop="sort" show-overflow-tooltip/> -->
<el-table-column <el-table-column label="查看范围" prop="userIdList">
label="查看范围"
prop="userIdList"
>
<template #default="scope"> <template #default="scope">
<!-- <el-button type="primary" class="button" @click="getUser(scope.row)"></el-button> --> <!-- <el-button type="primary" class="button" @click="getUser(scope.row)"></el-button> -->
<!-- <span class="descStyle" v-if="scope.row.userList" v-for="it in scope.row.userList"> &nbsp;&nbsp; {{it.nickName}}</span> --> <!-- <span class="descStyle" v-if="scope.row.userList" v-for="it in scope.row.userList"> &nbsp;&nbsp; {{it.nickName}}</span> -->
<!-- <span>{{ scope.row.userList }}</span> --> <!-- <span>{{ scope.row.userList }}</span> -->
<p v-if="scope.row.userList.length" > <p v-if="scope.row.userList.length">
<el-tooltip :content="handTooltip(scope.row.userList)" placement="top"> <el-tooltip
<div class="!h-50px descStyle"> :content="handTooltip(scope.row.userList)"
<div class="descStyle max-w-60vw !h-46px "> placement="top"
<p v-for="(it, e) in scope.row.userList" :class="scope.row.userList.length < 2 ? '!leading-46px' : 'xx'"> >
{{ it.nickName || undefined }} <div class="!h-50px descStyle">
<span v-if="e == 1 && scope.row.userList.length > 2" <div class="descStyle max-w-60vw !h-46px">
>...{{ scope.row.userList.length }}</span <p
> v-for="(it, e) in scope.row.userList"
</p> :class="
</div> scope.row.userList.length < 2
</div> ? '!leading-46px'
</el-tooltip> : 'xx'
</p> "
<span v-else>''</span> >
{{ it.nickName || undefined }}
<span v-if="e == 1 && scope.row.userList.length > 2"
>...{{ scope.row.userList.length }}</span
>
</p>
</div>
</div>
</el-tooltip>
</p>
<span v-else>''</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
@ -198,7 +210,7 @@
show-overflow-tooltip show-overflow-tooltip
> >
<template #default="scope"> <template #default="scope">
<div> <div v-if="userCode || hasUpload || hasReview">
<el-button <el-button
type="primary" type="primary"
@click="editClickB('edit', scope.row)" @click="editClickB('edit', scope.row)"
@ -207,7 +219,6 @@
编辑</el-button 编辑</el-button
> >
<el-button <el-button
v-if="userCode || hasUpload"
type="danger" type="danger"
@click="deleteClickB(scope.row)" @click="deleteClickB(scope.row)"
class="mb-20px w45px" class="mb-20px w45px"
@ -286,15 +297,15 @@
<el-input v-model="editB.sort" type="number" /> <el-input v-model="editB.sort" type="number" />
</el-form-item> </el-form-item>
<br /> <br />
<!-- <el-form-item label="所属类别"> <el-form-item label="所属类别">
<el-cascader <el-cascader
v-model="editB.cateId" :modelValue="editB.cateIds"
:options="tableData" :options="tableDataAuth"
@change="handleChange" @change="handleChange"
:props="{ children: 'childList', label: 'name', value: 'id' }" :props="{ children: 'childList', label: 'name', value: 'id' }"
/> />
</el-form-item> </el-form-item>
<br /> --> <br />
<el-form-item label="查看范围"> <el-form-item label="查看范围">
<el-button <el-button
class="button" class="button"
@ -352,21 +363,23 @@ import {
download, download,
dragFile, dragFile,
fetchdbAuthAdd, fetchdbAuthAdd,
fetchdbAuthGetInfo fetchdbAuthGetInfo,
fetchReviewAuthCateList
} from '@/api/daikin/base' } from '@/api/daikin/base'
import { NModal, useMessage, NSelect } from 'naive-ui' import { NModal, useMessage, NSelect } from 'naive-ui'
import UserList from '@/views/home/intelligence/process/UserPages.vue' import UserList from '@/views/home/intelligence/process/UserPages.vue'
import { databaseld } from '@/stores/modules/database' import { databaseld } from '@/stores/modules/database'
const { push } = useRouter(); const { push } = useRouter()
const database = databaseld() const database = databaseld()
const store = useUserStore() const store: any = useUserStore()
const message = useMessage() const message = useMessage()
const userCode = ['admin', 'database_dandang'].includes( const userCode = ['admin', 'database_dandang'].includes(store.user.roleCode)
store.user.roleCode const isDbReview = store.user?.isDbReview === 1
) const isDbUpload = store.user?.isDbUpload === 1
const tableData = ref() const tableData = ref([])
const tableDataAuth = ref([])
const infoData = ref() const infoData = ref()
const shomkA = ref(false) const shomkA = ref(false)
@ -382,6 +395,9 @@ const pageInfo = reactive({
async function getTree() { async function getTree() {
const { data } = await treeDbList({}) const { data } = await treeDbList({})
tableData.value = data tableData.value = data
console.log('🚀 ~ file: modify.vue:399 ~ data:', data)
const { data: auth = [] } = await fetchReviewAuthCateList()
tableDataAuth.value = auth
} }
let cateIds = ref() let cateIds = ref()
watchEffect(() => { watchEffect(() => {
@ -462,7 +478,7 @@ async function addClickA(row: any) {
shomkA.value = false shomkA.value = false
getTree() getTree()
} }
const editClickB = (edit: any, obj: any) => { const editClickB = (edit: any, obj: any = {}) => {
console.log(obj) console.log(obj)
if (edit === 'add' && obj && obj.id) { if (edit === 'add' && obj && obj.id) {
editB.value = { editB.value = {
@ -515,6 +531,14 @@ const editClickB = (edit: any, obj: any) => {
editB.value.cateId = database.database.id editB.value.cateId = database.database.id
userData.value = false userData.value = false
console.log(editB.value) console.log(editB.value)
editB.cateIds = []
let ids: any[] = getParentIds(obj.cateId)
if (ids?.length > 0) {
ids = ids.reverse()
// ids.push(obj.cateId)
editB.value.cateIds = ids
console.log('🚀 ~ file: Process.vue:248 ~ ids:', ids)
}
shomkB.value = true shomkB.value = true
} }
const deleteClickB = async (row: any) => { const deleteClickB = async (row: any) => {
@ -726,21 +750,34 @@ async function getAuth() {
type: 1 type: 1
}) })
setUpload.value = uploadUser.length > 0 setUpload.value = uploadUser.length > 0
hasUpload.value = uploadUser.findIndex((x:any) => x.userId === store.user?.id) > -1 hasUpload.value =
uploadUser.findIndex((x: any) => x.userId === store.user?.id) > -1
const { data: reviewUser = [] } = await fetchdbAuthGetInfo({ const { data: reviewUser = [] } = await fetchdbAuthGetInfo({
cateId: cateIds.value, cateId: cateIds.value,
type: 2 type: 2
}) })
setReview.value = reviewUser.length > 0 setReview.value = reviewUser.length > 0
hasReview.value = reviewUser.findIndex((x:any) => x.userId === store.user?.id) > -1 hasReview.value =
reviewUser.findIndex((x: any) => x.userId === store.user?.id) > -1
} }
const handleClick = () => { const handleClick = () => {
console.log(cateIds.value) console.log(cateIds.value)
push({path:'/DataBase/review',query:{cateId:cateIds.value}}) push({ path: '/DataBase/review', query: { cateId: cateIds.value } })
} }
const handTooltip = (data: any[] = []) => { const handTooltip = (data: any[] = []) => {
return data.map((item:any) => item.nickName)?.join(', ') || undefined return data.map((item: any) => item.nickName)?.join(', ') || undefined
}
// ID ID
function getParentIds(id: number, list: any[] = tableData.value): any {
if (!id) return
for (let i in list) {
if (list[i].id == id) return [list[i].id]
if (list[i].childList) {
let node = getParentIds(id, list[i].childList)
if (node !== undefined) return node.concat(list[i].id)
}
}
} }
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>

View File

@ -1,6 +1,10 @@
<script setup lang="ts"> <script setup lang="ts">
import HomeHead from '@/views/home/components/HomeHead.vue' import HomeHead from '@/views/home/components/HomeHead.vue'
import { timeStat,externalTimeStat } from '@/api/daikin/base' import {
timeStat,
externalTimeStat,
fetchmoduleStatExternalPage
} from '@/api/daikin/base'
import { formatDate } from '@/utils/format' import { formatDate } from '@/utils/format'
import { Chart1 } from './indexData' import { Chart1 } from './indexData'
import zhCn from 'element-plus/lib/locale/lang/zh-cn' import zhCn from 'element-plus/lib/locale/lang/zh-cn'
@ -12,19 +16,52 @@ const value1 = ref<[Date, Date]>([
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,
}) })
const chartRef1 = ref() const chartRef1 = ref()
const chartRef2 = ref() const chartRef2 = ref()
const chartOption1 = ref({}); const chartOption1 = ref({})
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('inside')
const pageInfo = reactive({
currentPage: 1,
pageSize: 10,
total: 10
})
const moduleCode = ref()
const visitDay = ref()
const waibuKd = ref()
const inseideDetail = ref([])
const outDetail = ref([])
const getInsideListPage = async () => {
const res: any = await fetchmoduleStatExternalPage({
waibuKd: waibuKd.value,
visitDay: visitDay.value,
moduleCode: moduleCode.value,
pageNum: pageInfo.currentPage,
pageSize: pageInfo.pageSize
})
inseideDetail.value = res?.rows || []
pageInfo.total = res?.total || 0
}
const getListPage = async () => {
const res: any = await fetchmoduleStatExternalPage({
waibuKd: waibuKd.value,
visitDay: visitDay.value,
moduleCode: moduleCode.value,
pageNum: pageInfo.currentPage,
pageSize: pageInfo.pageSize
})
outDetail.value = res?.rows || []
pageInfo.total = res?.total || 0
}
getListPage()
// getInsideListPage()
const clickButton = (id) => { const clickButton = (id) => {
primary.value = id primary.value = id
@ -53,29 +90,33 @@ const state = reactive<any>({
const dataList = ref() 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
let xAxisData:any[]=[] let xAxisData: any[] = []
let siomesData:any[]=[] let siomesData: any[] = []
data.forEach((item: { moduleName: any; visitCount: any; })=>{ data.forEach((item: { moduleName: any; visitCount: any }) => {
xAxisData.push(item.moduleName) xAxisData.push(item.moduleName)
siomesData.push(item.visitCount) siomesData.push(item.visitCount)
}) })
chartOption1.value = Chart1(xAxisData,siomesData) chartOption1.value = Chart1(xAxisData, siomesData)
} }
const externalList = ref<any>([]) 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
let xAxisData:any[]=[] let xAxisData: any[] = []
let siomesData:any[]=[] let siomesData: any[] = []
data.forEach((item: { moduleName: any; visitCount: any; })=>{ data.forEach(
xAxisData.push(item.moduleName) (item: { moduleName: any; visitCount: any; moduleCode: any }) => {
siomesData.push(item.visitCount) externalObj.value[item.moduleCode] = item.moduleName
}) xAxisData.push(item.moduleName)
chartOption2.value = Chart1(xAxisData,siomesData) siomesData.push(item.visitCount)
// chartOption2.value.height=3000 }
// chartOption2.value.width=1000 )
chartOption2.value = Chart1(xAxisData, siomesData)
// chartOption2.value.height=3000
// chartOption2.value.width=1000
} }
const ss = computed(() => [state.startTime, state.endTime, state.timeType]) const ss = computed(() => [state.startTime, state.endTime, state.timeType])
watch( watch(
@ -83,7 +124,7 @@ watch(
async (v) => { async (v) => {
console.log(state.type) console.log(state.type)
getDat() getDat()
getExternalTimeStat() getExternalTimeStat()
}, },
{ immediate: true, deep: true } { immediate: true, deep: true }
) )
@ -91,7 +132,6 @@ watch(
onMounted(() => { onMounted(() => {
// getDat() // getDat()
// console.log(formatDate(value1.value[0]).substring(0, 10)) // console.log(formatDate(value1.value[0]).substring(0, 10))
}) })
const shortcuts = [ const shortcuts = [
{ {
@ -166,40 +206,80 @@ const shortcuts = [
} }
] ]
const handleClick = ({paneName}:any) => { const handleClick = ({ paneName }: any) => {
paneName === 'out' && getExternalTimeStat() pageInfo.currentPage = 1
paneName === 'inside' && getDat() pageInfo.pageSize = 10
pageInfo.total = 0
paneName === 'out' && getExternalTimeStat()
paneName === 'inside' && getDat()
paneName === 'out-detail' && getListPage()
paneName === 'inside-detail' && getInsideListPage()
} }
const selValue =ref('') const selValue = ref('')
</script> </script>
<template> <template>
<HomeHead class="top"></HomeHead> <HomeHead class="top"></HomeHead>
<div class="w-full h-834px mt30px rd-20px bg-#fff p30px overflow-hidden"> <div class="w-full h-850px mt30px rd-20px bg-#fff p30px overflow-hidden">
<div class="min-h-30px "> <div class="min-h-30px flex items-center">
<span class="text-#000">日期: </span> <span class="text-#000 mr-10px">日期: </span>
<el-config-provider :locale="zhCn"> <div class="max-w-350px flex items-center">
<el-date-picker <el-date-picker
v-if="['inside', 'out'].includes(activeName)"
v-model="value1" v-model="value1"
type="daterange" type="daterange"
range-separator="到" range-separator="到"
start-placeholder="开始时间" start-placeholder="开始时间"
end-placeholder="结束时间" end-placeholder="结束时间"
size="small"
@change="timenFirst" @change="timenFirst"
:shortcuts="shortcuts" :shortcuts="shortcuts"
/> />
</el-config-provider> <el-date-picker
v-else
v-model="visitDay"
type="date"
value-format="YYYY-MM-DD"
placeholder="选择日期"
/>
</div>
<div class="mx-4 flex items-center">
<span class="text-#000 mr-10px">模块: </span>
<el-select
v-if="'out-detail' === activeName"
v-model="moduleCode"
placeholder="选择模块"
>
<el-option
v-for="item in externalList"
:key="item.id"
:label="item.moduleName"
:value="item.moduleCode"
/>
</el-select>
</div>
<div class="flex items-center">
<span class="text-#000 mr-10px w-50px">供方: </span>
<el-input
v-model="waibuKd"
placeholder="请输入供方昵称或代码"
></el-input>
</div>
<el-button <el-button
type="primary" type="primary"
:icon="Search" :icon="Search"
size="small" size="small"
class="ml20px mt--5px" class="ml20px mt--5px"
>搜素</el-button @click="handleClick({ paneName: activeName })"
>搜索</el-button
> >
<template v-if="activeName !== 'inside' && false"> <template v-if="activeName !== 'inside' && false">
<el-select v-model="selValue" class="ml-20px mt-[-4px]" placeholder="Select" size="small"> <el-select
v-model="selValue"
class="ml-20px mt-[-4px]"
placeholder="Select"
size="small"
>
<el-option <el-option
v-for="item in externalList" v-for="item in externalList"
:key="item.moduleCode" :key="item.moduleCode"
@ -215,23 +295,23 @@ const selValue =ref('')
<el-button :type="primary == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px" <el-button :type="primary == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
@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="inside"> <el-tab-pane label="本部足迹" name="inside">
<div class="mt20px w-full"> <div class="mt20px w-full">
<span <span
class="cardfoot text-#000 p30px mx10px my10px text-center text-18px font-bold" class="cardfoot text-#000 p30px mx10px my10px text-center text-18px font-bold"
v-if="dataList" v-if="dataList"
v-for="i in dataList" v-for="i in dataList"
> >
<span>{{ i.moduleName }}</span <span>{{ i.moduleName }}</span
><br /> ><br />
<br /> <br />
<span class="mt10px">{{ i.visitCount }}</span> <span class="mt10px">{{ i.visitCount }}</span>
</span> </span>
</div> </div>
<div class="mt10px w-full"> <div class="mt10px w-full">
<!-- <div class="relative w-full h-50px flex"> <!-- <div class="relative w-full h-50px flex">
<el-button :type="primarys == 2 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px" <el-button :type="primarys == 2 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
@click="clickButtons(2)">本周</el-button> @click="clickButtons(2)">本周</el-button>
<el-button :type="primarys == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px" <el-button :type="primarys == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
@ -243,46 +323,153 @@ const selValue =ref('')
</el-config-provider> </el-config-provider>
</div> </div>
</div> --> </div> -->
<div class="w-full h-400px"> <div class="w-full h-400px">
<VChart key="yyy" ref="chartRef1" :option="chartOption1" /> <VChart key="yyy" ref="chartRef1" :option="chartOption1" />
</div> </div>
</div> </div>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="外部足迹" name="out"> <el-tab-pane v-if="false" label="本部足迹-明细" name="inside-detail">
</el-tab-pane> <div v-if="activeName === 'inside-detail'" class="h-720px">
</el-tabs> <div class="w100% h-full overflow-auto">
<div > <el-table
<div class="mt20px w-full"> :data="inseideDetail"
<span style="width: 100%; margin-bottom: 20px"
class="cardfoot text-#000 p30px mx10px my10px text-center text-18px font-bold" row-key="id"
v-if="dataList" border
v-for="i in externalList" default-expand-all
> :header-cell-style="{
<span>{{ i.moduleName }}</span background: '#2A7BF7',
><br /> color: '#fff',
<br /> height: '60px',
<span class="mt10px">{{ i.visitCount }}</span> lineHeight: '60px',
</span> textAlign: 'center',
</div> 'font-size': '24px'
}"
:cell-style="{ 'text-align': 'center', 'overflow-y': 'auto' }"
>
<el-table-column prop="deptName" label="排序" />
<el-table-column
prop="cateName"
label="所属分类"
show-overflow-tooltip
>
<template #default="scope">
<span v-if="scope"></span>
</template>
</el-table-column>
<el-table-column
prop="title"
label="标题名称"
show-overflow-tooltip
/>
<el-table-column
label="文件列表"
prop="filePath"
show-overflow-tooltip
/>
<el-table-column label="排序" prop="sort" show-overflow-tooltip />
<el-table-column label="查看范围" prop="userIdList">
<template #default="scope">
<el-button type="primary" class="button" @click=""
>查看范围</el-button
>
</template>
</el-table-column>
</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>
</el-tab-pane>
<el-tab-pane label="外部足迹" name="out"> </el-tab-pane>
<el-tab-pane label="外部足迹-明细" name="out-detail">
<div class="h-720px">
<div class="w100% h-full overflow-auto">
<el-table
:data="outDetail"
style="width: 100%; margin-bottom: 20px"
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' }"
>
<el-table-column prop="userId" label="供方ID" />
<el-table-column
prop="nickName"
label="供方昵称"
show-overflow-tooltip
>
</el-table-column>
<el-table-column
prop="title"
label="访问模块"
show-overflow-tooltip
>
<template #default="{ row }">
<span>{{ externalObj[row.moduleCode] || '' }}</span>
</template>
</el-table-column>
<el-table-column
label="访问计数"
prop="visitCount"
show-overflow-tooltip
/>
<el-table-column
label="访问时间"
prop="visitDay"
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="getListPage"
@current-change="getListPage"
/>
</div>
</div>
</el-tab-pane>
</el-tabs>
<div>
<div class="mt20px w-full">
<span
class="cardfoot text-#000 p30px mx10px my10px text-center text-18px font-bold"
v-if="externalList"
v-for="i in externalList"
>
<span>{{ i.moduleName }}</span
><br />
<br />
<span class="mt10px">{{ i.visitCount }}</span>
</span>
</div>
<div class="mt10px w-full"> <div class="mt10px w-full">
<!-- <div class="relative w-full h-50px flex"> <div class="w-full h-400px">
<el-button :type="primarys == 2 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px" <VChart key="xxxx" ref="chartRef2" :option="chartOption2" />
@click="clickButtons(2)">本周</el-button> </div>
<el-button :type="primarys == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px" </div>
@click="clickButtons(3)">本月</el-button> </div>
<div class="absolute right-60px w300px ">
<el-config-provider :locale="zhCn">
<el-date-picker v-model="value2" type="daterange" range-separator="-" start-placeholder=""
end-placeholder="结束时间" size="small" @change="timenFirsts" />
</el-config-provider>
</div>
</div> -->
<div class="w-full h-400px">
<VChart key="xxxx" ref="chartRef2" :option="chartOption2" />
</div>
</div>
</div>
</div> </div>
</template> </template>
@ -308,9 +495,9 @@ const selValue =ref('')
right: 30px; right: 30px;
top: -92px; top: -92px;
} }
::v-deep{ ::v-deep {
.el-tabs__item{ .el-tabs__item {
font-size: 16px !important; font-size: 16px !important;
} }
} }
</style> </style>

View File

@ -1,6 +1,6 @@
<!-- 外部情报 --> <!-- 外部情报 -->
<script setup lang="ts"> <script setup lang="ts">
import Vue3Tinymce from '@jsdawn/vue3-tinymce'; // import Vue3Tinymce from '@jsdawn/vue3-tinymce';
import HomeHead from "@/views/home/components/HomeHead.vue"; 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";
@ -15,7 +15,7 @@ import {
NSpace, NSpace,
NRadioGroup, NRadioGroup,
useMessage, useMessage,
FormInst, // FormInst,
} from "naive-ui"; } from "naive-ui";
import { saveArticle, trendsDetail } from "@/api/daikin/base"; import { saveArticle, trendsDetail } from "@/api/daikin/base";
import Editor from "../components/TinyECE.vue"; import Editor from "../components/TinyECE.vue";
@ -28,7 +28,7 @@ let route = useRoute();
let cate = ref(1); let cate = ref(1);
const fileList = ref<[]>(); const fileList = ref<[]>();
const editorContent = ref(""); const editorContent = ref("");
const formRef = ref<FormInst | null>(null); const formRef = ref<any | null>(null);
const message = useMessage(); const message = useMessage();
const formValue: any = ref({ const formValue: any = ref({

View File

@ -1,6 +1,6 @@
<!-- 市况 --> <!-- 市况 -->
<script setup lang="ts"> <script setup lang="ts">
import { Chart1, Chart2, Chart3, Chart4, Chart5, Chart6 } from './MarketData' import { Chart1, Chart3, Chart4, Chart5, Chart6 } from './MarketData'
import HomeHead from '@/views/home/components/HomeHead.vue' import HomeHead from '@/views/home/components/HomeHead.vue'
import AppBlock from '@/components/AppBlock.vue' import AppBlock from '@/components/AppBlock.vue'
import AppNewsBox from '@/components/AppNewsBox.vue' import AppNewsBox from '@/components/AppNewsBox.vue'

View File

@ -1,62 +1,71 @@
import { fileURLToPath, URL } from "node:url"; import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from "vite"; import { defineConfig } from 'vite'
import vue from "@vitejs/plugin-vue"; import vue from '@vitejs/plugin-vue'
import vueJsx from "@vitejs/plugin-vue-jsx"; import vueJsx from '@vitejs/plugin-vue-jsx'
import Unocss from "unocss/vite"; import Unocss from 'unocss/vite'
import { presetUno } from "unocss"; import { presetUno } from 'unocss'
import AutoImport from "unplugin-auto-import/vite"; import AutoImport from 'unplugin-auto-import/vite'
import Components from 'unplugin-vue-components/vite'; import Components from 'unplugin-vue-components/vite'
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'; import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
import ViteCompression from 'vite-plugin-compression'; import ViteCompression from 'vite-plugin-compression'
import PurgeIcons from 'vite-plugin-purge-icons'; import PurgeIcons from 'vite-plugin-purge-icons'
// https://vitejs.dev/config/ // https://vitejs.dev/config/
export default defineConfig({ export default defineConfig({
server: { server: {
proxy: { proxy: {
'/test-api': '/test-api': {
{ target: 'http://admin.echo.mteam01.com/openApi/',
target:"http://admin.echo.mteam01.com/openApi/", changeOrigin: true,
changeOrigin: true, rewrite: (path) => path.replace(/^\/test-api/, '') // 设置重写的路径
rewrite: (path) => path.replace(/^\/test-api/, '') // 设置重写的路径 }
},} }
},
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
},
}, plugins: [
resolve: { vue(),
alias: { vueJsx(),
"@": fileURLToPath(new URL("./src", import.meta.url)), Unocss({
}, presets: [presetUno()]
}, }),
AutoImport({
plugins: [ imports: ['vue', 'vue-router', '@vueuse/core'], // 自动导入vue和vue-router相关函数
vue(), dts: 'src/types/auto-import.d.ts',
vueJsx(), // eslint报错解决 https://blog.csdn.net/sayUonly/article/details/123482912
Unocss({ eslintrc: {
presets: [presetUno()], enabled: false, // Default `false`
}), filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
AutoImport({ globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
imports: ["vue", "vue-router", "@vueuse/core"], // 自动导入vue和vue-router相关函数 },
dts: "src/types/auto-import.d.ts", resolvers: [ElementPlusResolver()]
// eslint报错解决 https://blog.csdn.net/sayUonly/article/details/123482912 }),
eslintrc: { Components({
enabled: false, // Default `false` resolvers: [ElementPlusResolver()]
filepath: "./.eslintrc-auto-import.json", // Default `./.eslintrc-auto-import.json` }),
globalsPropValue: true, // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable') PurgeIcons(),
}, ViteCompression({
resolvers: [ algorithm: 'gzip', // 选择压缩算法,支持 'gzip' 或 'brotli'
ElementPlusResolver(), ext: '.gz', // 压缩后文件的扩展名
], verbose: false
}), })
Components({ ],
resolvers: [ ElementPlusResolver(), build: {
], chunkSizeWarningLimit: 4000,
}), sourcemap: false, // Builds sourcemaps for better debugging but could be disabled for performance
PurgeIcons(), minify: 'esbuild', // Use 'terser' for minimizing your codes, it could be 'esbuild' but 'terser' is more accurate
ViteCompression({ rollupOptions: {
algorithm: 'gzip', // 选择压缩算法,支持 'gzip' 或 'brotli' treeshake: true // Enable tree-shaking
ext: '.gz', // 压缩后文件的扩展名 },
}), terserOptions: {
], compress: {
// pure_funcs: ['console.log', 'console.info'] // Remove console.log and console.info from production build
}); }
}
}
})