update
parent
031b7e89d0
commit
9a040f9627
42
11.txt
42
11.txt
|
|
@ -6,4 +6,44 @@
|
|||
5.品质和碳中和 字体放大； --
|
||||
6.外部情报 留言板 列表 已回复； ---
|
||||
7.碳中和内容管理的 查看范围；
|
||||
8.碳中和相关活动报告-- 显示其他的活动 后面排.；
|
||||
8.碳中和相关活动报告-- 显示其他的活动 后面排.；
|
||||
|
||||
wang123_
|
||||
urfhsdkjdwerwnvsojj
|
||||
|
||||
|
||||
[
|
||||
{
|
||||
年份：2023，
|
||||
data:[
|
||||
{
|
||||
type:DIS,
|
||||
铜原材料使用量合计:xxx,
|
||||
铜原材料碳排放量合计:xxx,
|
||||
... （铁，铝、树脂 两个合计，list里面放对应明细）
|
||||
list:[
|
||||
{
|
||||
类型：铜，
|
||||
原材料使用量:xx,
|
||||
原材料碳排放量量:xx,
|
||||
},
|
||||
....
|
||||
]
|
||||
},
|
||||
{
|
||||
type:DSZ,
|
||||
铜原材料使用量合计:xxx,
|
||||
铜原材料碳排放量合计:xxx,
|
||||
... （铁，铝、树脂 两个合计，list里面放对应明细）
|
||||
list:[
|
||||
{
|
||||
类型：铜，
|
||||
原材料使用量:xx,
|
||||
原材料碳排放量量:xx,
|
||||
},
|
||||
....
|
||||
]
|
||||
},
|
||||
]
|
||||
},
|
||||
]
|
||||
|
|
@ -29,11 +29,14 @@ declare module 'vue' {
|
|||
ElFormItem: typeof import('element-plus/es')['ElFormItem']
|
||||
ElIcon: typeof import('element-plus/es')['ElIcon']
|
||||
ElInput: typeof import('element-plus/es')['ElInput']
|
||||
ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
|
||||
ElOption: typeof import('element-plus/es')['ElOption']
|
||||
ElPagination: typeof import('element-plus/es')['ElPagination']
|
||||
ElProgress: typeof import('element-plus/es')['ElProgress']
|
||||
ElRadio: typeof import('element-plus/es')['ElRadio']
|
||||
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
|
||||
ElRow: typeof import('element-plus/es')['ElRow']
|
||||
ElSelect: typeof import('element-plus/es')['ElSelect']
|
||||
ElTable: typeof import('element-plus/es')['ElTable']
|
||||
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
|
||||
ElTabPane: typeof import('element-plus/es')['ElTabPane']
|
||||
|
|
|
|||
13
src/App.vue
13
src/App.vue
|
|
@ -1,11 +1,12 @@
|
|||
<script setup lang="ts">
|
||||
import { RouterView } from "vue-router";
|
||||
import { useFullscreen, useFavicon, useTitle } from "@vueuse/core";
|
||||
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn'
|
||||
import FitScreen from "@fit-screen/vue";
|
||||
import { NMessageProvider } from "naive-ui";
|
||||
import { useUserStore } from "@/stores/modules/user";
|
||||
|
||||
import { NConfigProvider } from 'naive-ui'
|
||||
import { zhCN as NZhCN, dateZhCN } from 'naive-ui'
|
||||
// 全屏
|
||||
const fitscreenRef = ref<HTMLElement | null>(null);
|
||||
const { toggle } = useFullscreen(fitscreenRef);
|
||||
|
|
@ -41,6 +42,8 @@ const pageClass = computed(() => {
|
|||
}
|
||||
return "page"; // 默认类名
|
||||
});
|
||||
|
||||
const locale = computed(() => zhCn)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -52,7 +55,11 @@ const pageClass = computed(() => {
|
|||
mode="fit"
|
||||
:class="pageClass"
|
||||
>
|
||||
<RouterView />
|
||||
<n-config-provider :locale="NZhCN" :date-locale="dateZhCN">
|
||||
<el-config-provider :locale="locale">
|
||||
<RouterView />
|
||||
</el-config-provider>
|
||||
</n-config-provider>
|
||||
</FitScreen>
|
||||
</NMessageProvider>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1250,6 +1250,75 @@ export async function timeStat(data: any){
|
|||
return http.post(`/moduleStat/timeStat`,data)
|
||||
}
|
||||
|
||||
/**
|
||||
* 网站外部足迹 https://console-docs.apipost.cn/preview/24b343ac43bb13e7/d871c156cc579e86?target_id=5edbf818-b7c7-426f-83c0-fb16f48c196c
|
||||
*/
|
||||
export async function externalTimeStat(data: any){
|
||||
return http.post(`/moduleStat/externalTimeStat`,data)
|
||||
}
|
||||
|
||||
/**
|
||||
* csr供应商月份列表 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchCsrSupplier(params: any){
|
||||
return http.get(`/csrSupplier/statList`,{params})
|
||||
}
|
||||
|
||||
/**
|
||||
* csr供应商右侧排行列表（分页） https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchCsrSupplierTopList(params: any){
|
||||
return http.get(`/csrSupplier/topList`,{params})
|
||||
}
|
||||
/**
|
||||
* csr供应商右侧排行列表（分页） https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchCsrSupplierList(params: any){
|
||||
return http.get(`/csrSupplier/statMonthList`,{params})
|
||||
}
|
||||
/**
|
||||
* csr供应商更新时间 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchCsrSupplierTaskInfo(params?: any){
|
||||
return http.get(`/csrSupplier/taskInfo`,{params})
|
||||
}
|
||||
/**
|
||||
* csr原材料-列表(分页) https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchMaterialPage(params?: any){
|
||||
return http.get(`/material/getPage`,{params})
|
||||
}
|
||||
/**
|
||||
* csr原材料-删除 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchMaterialPageDel(params?: any){
|
||||
return http.get(`/material/delInfo`,{params})
|
||||
}
|
||||
/**
|
||||
* csr原材料-主图 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchStatListlBar(params?: any){
|
||||
return http.get(`/material/statList`,{params})
|
||||
}
|
||||
/** !!!!!!
|
||||
* csr原材料-饼图 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchStatListlPie(params?: any){
|
||||
return http.get(`/material/proportionList`,{params})
|
||||
}
|
||||
/**
|
||||
* csr原材料-填报数据 https://console-docs.apipost.cn/preview/9ac14c51f96ce4d8/75274687248efb1c?target_id=5e2e22e5-fab5-4c46-8a93-8f0c3a3675cb
|
||||
*/
|
||||
export async function fetchMaterialAddInfo(data?: any){
|
||||
return http.post(`/material/addInfo`,data)
|
||||
}
|
||||
|
||||
/**
|
||||
* 查看模块查看范围历史 https://console-docs.apipost.cn/preview/d9d2c859db1009cd/18265d950ad924e4?target_id=4c25a720-44f2-472e-be82-c2eaf41d9a43
|
||||
*/
|
||||
export async function fetchGetViewScope(params?: any){
|
||||
return http.get(`/common/getViewScope`,{params})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ input {
|
|||
}
|
||||
input:-webkit-autofill,
|
||||
input:-webkit-autofill:hover,
|
||||
input:-webkit-autofill:focus,
|
||||
// input:-webkit-autofill:focus,
|
||||
input:-webkit-autofill:active {
|
||||
font-size: inherit !important;
|
||||
-webkit-box-shadow: none !important;
|
||||
|
|
|
|||
|
|
@ -16,6 +16,8 @@ const message = useMessage()
|
|||
const store = useUserStore()
|
||||
const header = { 'token': store.user.token }
|
||||
|
||||
const showEditTime = ref(false);
|
||||
const editDFormRef = ref(null);
|
||||
const dataA = ref([])
|
||||
const dataB = ref([])
|
||||
const dataC = ref([])
|
||||
|
|
@ -68,6 +70,7 @@ async function getDataC() {
|
|||
const dataDIS = ref()
|
||||
const dataDSZ = ref()
|
||||
const dataDISH = ref()
|
||||
const timeObj = ref<any>({});
|
||||
onMounted(async () => {
|
||||
getDataA();
|
||||
getDataB();
|
||||
|
|
@ -76,8 +79,10 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const getFazhu=async ()=>{
|
||||
timeObj.value = {}
|
||||
const { data:fazhu} = await amountList()
|
||||
fazhu.forEach((i: { number: string; amount: any }) => {
|
||||
fazhu.forEach((i: { number: string; amount: any,updateDate: string }) => {
|
||||
timeObj.value[i.number] = i.updateDate;
|
||||
if(i.number=='DIS'){
|
||||
dataDIS.value = i.amount
|
||||
}
|
||||
|
|
@ -252,6 +257,7 @@ const userList = ref()
|
|||
const showModal = ref(false)
|
||||
const flg = ref()
|
||||
const setUserList =ref()
|
||||
const editD = ref<any>({})
|
||||
async function getUser(moduleId: any) {
|
||||
showModal.value = !showModal.value
|
||||
flg.value = moduleId
|
||||
|
|
@ -280,25 +286,46 @@ async function getUser(moduleId: any) {
|
|||
showModal.value = data
|
||||
}
|
||||
const shomkD =ref(false)
|
||||
const fazhus = ref()
|
||||
// const fazhus = ref()
|
||||
const numbers = ref()
|
||||
const fazhu= (str: any,number: any ) =>{
|
||||
numbers.value = str
|
||||
fazhus.value = number
|
||||
// fazhus.value = number
|
||||
editD.value.fazhus = number
|
||||
editD.value.time = timeObj.value[str]
|
||||
shomkD.value = true
|
||||
|
||||
}
|
||||
const submitFazhu=async()=>{
|
||||
const number = numbers.value
|
||||
const amount = fazhus.value
|
||||
console.log(typeof(number),typeof(amount))
|
||||
const {code,msg} = await updateAmount({number,amount})
|
||||
if (code === 200) {
|
||||
shomkD.value = false
|
||||
message.success("修改成功")
|
||||
getFazhu()
|
||||
editDFormRef.value.validate(async (valid: any) => {
|
||||
if (!valid) return
|
||||
console.log("🚀 ~ file: index.vue:301 ~ valid:", valid)
|
||||
const number = numbers.value
|
||||
const amount = editD.value.fazhus
|
||||
const {code,msg} = await updateAmount({number,amount,updateDate:editD.value.time})
|
||||
if (code === 200) {
|
||||
shomkD.value = false
|
||||
message.success("修改成功")
|
||||
getFazhu()
|
||||
}
|
||||
else message.warning(msg)
|
||||
})
|
||||
}
|
||||
else message.warning(msg)
|
||||
|
||||
const rules = {
|
||||
fazhus: [
|
||||
{
|
||||
required: true,
|
||||
message: "不能为空",
|
||||
trigger: "blur"
|
||||
}
|
||||
],
|
||||
time: [
|
||||
{
|
||||
required: true,
|
||||
message: "不能为空",
|
||||
trigger: "blur"
|
||||
}
|
||||
]
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
|
|
@ -316,14 +343,17 @@ const submitFazhu=async()=>{
|
|||
<el-tab-pane name="DIS">
|
||||
<template #label>
|
||||
<span class="custom-tabs-label">
|
||||
|
||||
<span class="text-20px">DIS</span>
|
||||
</span>
|
||||
</template>
|
||||
<div class=" cont relative w100% h800px overflow-y-auto">
|
||||
<div class="flex items-center">
|
||||
<el-button type="primary" @click="handleEditA('addYear')" class="my20px">新增</el-button>
|
||||
<span class="text-18px ml-20px"> 发注金额：{{dataDIS||0}} 百万元</span>
|
||||
<el-button type="primary" @click="fazhu('DIS',dataDIS)" class="my20px ml-10px">{{activeName}}发注金额修改</el-button>
|
||||
<span class="text-18px ml-20px"> 更新日：{{timeObj.DIS}}</span>
|
||||
<!-- <el-button type="info" @click="fazhu('DIS',dataDIS)" class="my20px ml-10px">{{activeName}}修改更新日</el-button> -->
|
||||
</div>
|
||||
<!-- <el-button type="primary" @click="getUser(1)" > 查看范围</el-button> -->
|
||||
<el-table :data="dataA" style="width: 95%"
|
||||
row-key="id"
|
||||
|
|
@ -355,9 +385,13 @@ const submitFazhu=async()=>{
|
|||
</span>
|
||||
</template>
|
||||
<div>
|
||||
<div class="flex items-center">
|
||||
<el-button type="primary" @click="handleEditB('addYear')" class="my20px">新增</el-button>
|
||||
<span class="text-18px ml-20px"> 发注金额：{{dataDSZ||0}} 百万元</span>
|
||||
<el-button type="primary" @click="fazhu('DSZ',dataDSZ)" class="my20px ml-10px">{{activeName}}发注金额修改</el-button>
|
||||
<span class="text-18px ml-20px"> 更新日：{{timeObj.DSZ}} </span>
|
||||
<!-- <el-button type="info" @click="fazhu('DSZ',dataDSZ)" class="my20px ml-10px">{{activeName}}修改更新日</el-button> -->
|
||||
</div>
|
||||
<!-- <el-button type="primary" @click="getUser(2)" > 查看范围</el-button> -->
|
||||
<el-table :data="dataB" style="width: 95%"
|
||||
row-key="id"
|
||||
|
|
@ -391,9 +425,13 @@ const submitFazhu=async()=>{
|
|||
</template>
|
||||
|
||||
<div>
|
||||
<div class="flex items-center">
|
||||
<el-button type="primary" @click="handleEditC('addYear')" class="my20px">新增</el-button>
|
||||
<span class="text-18px ml-20px"> 发注金额：{{dataDISH||0}} 百万元</span>
|
||||
<el-button type="primary" @click="fazhu('DISH',dataDISH)" class="my20px ml-10px">{{activeName}}发注金额修改</el-button>
|
||||
<span class="text-18px ml-20px"> 更新日:{{timeObj.DISH}} </span>
|
||||
<!-- <el-button type="info" @click="editDate('DISH',dataDISH)" class="my20px ml-10px">{{activeName}}修改更新日</el-button> -->
|
||||
</div>
|
||||
<!-- <el-button type="primary" @click="getUser(3)" > 查看范围</el-button> -->
|
||||
<el-table :data="dataC" style="width: 95%"
|
||||
row-key="id"
|
||||
|
|
@ -569,10 +607,20 @@ const submitFazhu=async()=>{
|
|||
</n-modal>
|
||||
<n-modal v-model:show="shomkD">
|
||||
<div class="bg-#FFF p30px">
|
||||
<el-form label-width="120px" :inline="true">
|
||||
<el-form-item label="发注金额">
|
||||
<el-input v-model="fazhus" type="number"> </el-input>
|
||||
</el-form-item>
|
||||
<el-form label-width="120px" :inline="true" ref="editDFormRef" :model="editD" :rules="rules">
|
||||
<el-form-item label="发注金额" prop="fazhus">
|
||||
<el-input v-model="editD.fazhus" type="number"> </el-input>
|
||||
</el-form-item>
|
||||
<br>
|
||||
<el-form-item label="更新日" prop="time">
|
||||
<el-date-picker
|
||||
v-model="editD.time"
|
||||
type="date"
|
||||
placeholder="选择日期"
|
||||
size="default"
|
||||
value-format="YYYY-MM-DD"
|
||||
/>
|
||||
</el-form-item>
|
||||
<br>
|
||||
</el-form>
|
||||
<hr class="mb15px border-#f1f1f1">
|
||||
|
|
@ -580,6 +628,7 @@ const submitFazhu=async()=>{
|
|||
<el-button class="flex-center" type="primary" @click="submitFazhu">确认</el-button>
|
||||
</div>
|
||||
</n-modal>
|
||||
|
||||
</template>
|
||||
|
||||
<style lang="less">
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@ watch(
|
|||
<div class="text-18px ml40px mr25px">{{ day }}</div>
|
||||
<div class="text-18px">{{ week }}</div>
|
||||
</div>
|
||||
<div class="q-wrapper flex-1 mt30px text-#142142 flex flex-col bg-#fff p30px">
|
||||
<div class="q-wrapper flex-1 mt30px text-#142142 flex flex-col bg-#fff p30px min-h-870px">
|
||||
<div v-if="listData && listData.length > 0"
|
||||
class="mt8px cursor-pointer flex items-center p15px pl20px text-18px max-w-100%"
|
||||
style="display: flex; flex-wrap: wrap; justify-content: space-between">
|
||||
|
|
|
|||
|
|
@ -55,7 +55,8 @@ onMounted(async () => {
|
|||
const { data: _dishList } = await getHomeList({number: "DISH"}) //汇率
|
||||
const { data:fazhu} = await amountList()
|
||||
fazhu.forEach((i: { number: string; amount: any }) => {
|
||||
timeObj.value[i.number] = i.modifyTime?.substring(0, 10) || ''
|
||||
// timeObj.value[i.number] = i.modifyTime?.substring(0, 10) || ''
|
||||
timeObj.value[i.number] = i.updateDate || ''
|
||||
if(i.number=='DIS'){
|
||||
dataDIS.value = i.amount
|
||||
}
|
||||
|
|
@ -209,6 +210,13 @@ const thisSelect = (e) => {
|
|||
state.title = e
|
||||
}
|
||||
|
||||
function formatNumber(num = 0) {
|
||||
num = +num;
|
||||
const roundedNum:string = num.toFixed(2);
|
||||
const [wholePart, decimalPart] = roundedNum.split('.');
|
||||
const formattedDecimalPart = decimalPart.padEnd(2, '0');
|
||||
return `${wholePart}.${formattedDecimalPart}`;
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
|
|
@ -359,34 +367,34 @@ const thisSelect = (e) => {
|
|||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">合计</th>
|
||||
<td>{{addDIS1}}%</td>
|
||||
<td>{{addDIS2}}%</td>
|
||||
<td>{{addDIS3}}%</td>
|
||||
<td>{{formatNumber(addDIS1)}}%</td>
|
||||
<td>{{formatNumber(addDIS2)}}%</td>
|
||||
<td>{{formatNumber(addDIS3)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th rowspan="2">C/D</th>
|
||||
<th>交涉</th>
|
||||
<td :rowspan="disList[0].budget ==disList[1].budget?'2':''">{{disList[0].budget}}%</td>
|
||||
<td :rowspan="disList[0].monthOne ==disList[1].monthOne?'2':''">{{disList[0].monthOne}}%</td>
|
||||
<td :rowspan="disList[0].monthTwo ==disList[1].monthTwo?'2':''">{{disList[0].monthTwo}}%</td>
|
||||
<td :rowspan="disList[0].budget ==disList[1].budget?'2':''">{{formatNumber(disList[0].budget)}}%</td>
|
||||
<td :rowspan="disList[0].monthOne ==disList[1].monthOne?'2':''">{{formatNumber(disList[0].monthOne)}}%</td>
|
||||
<td :rowspan="disList[0].monthTwo ==disList[1].monthTwo?'2':''">{{formatNumber(disList[0].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>THEME</th>
|
||||
<td v-if="disList[1].budget !=disList[0].budget">{{disList[1].budget}}%</td>
|
||||
<td v-if="disList[1].monthOne !=disList[0].monthOne">{{disList[1].monthOne}}%</td>
|
||||
<td v-if="disList[1].monthTwo !=disList[0].monthTwo">{{disList[1].monthTwo}}%</td>
|
||||
<td v-if="disList[1].budget !=disList[0].budget">{{formatNumber(disList[1].budget)}}%</td>
|
||||
<td v-if="disList[1].monthOne !=disList[0].monthOne">{{formatNumber(disList[1].monthOne)}}%</td>
|
||||
<td v-if="disList[1].monthTwo !=disList[0].monthTwo">{{formatNumber(disList[1].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">市况</th>
|
||||
<td>{{disList[2].budget}}%</td>
|
||||
<td>{{disList[2].monthOne}}%</td>
|
||||
<td>{{disList[2].monthTwo}}%</td>
|
||||
<td>{{formatNumber(disList[2].budget)}}%</td>
|
||||
<td>{{formatNumber(disList[2].monthOne)}}%</td>
|
||||
<td>{{formatNumber(disList[2].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">為替レート</th>
|
||||
<td>{{disList[3].budget}}%</td>
|
||||
<td>{{disList[3].monthOne}}%</td>
|
||||
<td>{{disList[3].monthTwo}}%</td>
|
||||
<td>{{formatNumber(disList[3].budget)}}%</td>
|
||||
<td>{{formatNumber(disList[3].monthOne)}}%</td>
|
||||
<td>{{formatNumber(disList[3].monthTwo)}}%</td>
|
||||
</tr>
|
||||
</table>
|
||||
<table class="data-table" border v-if="activeCard5NavKey === 'DSZ'">
|
||||
|
|
@ -414,34 +422,34 @@ const thisSelect = (e) => {
|
|||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">合计</th>
|
||||
<td>{{addDSZ1}}%</td>
|
||||
<td>{{addDSZ2}}%</td>
|
||||
<td>{{addDSZ3}}%</td>
|
||||
<td>{{formatNumber(addDSZ1)}}%</td>
|
||||
<td>{{formatNumber(addDSZ2)}}%</td>
|
||||
<td>{{formatNumber(addDSZ3)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th rowspan="2">C/D</th>
|
||||
<th>交涉</th>
|
||||
<td :rowspan="dszList[0].budget ==dszList[1].budget?'2':''">{{dszList[0].budget}}%</td>
|
||||
<td :rowspan="dszList[0].monthOne ==dszList[1].monthOne?'2':''">{{dszList[0].monthOne}}%</td>
|
||||
<td :rowspan="dszList[0].monthTwo ==dszList[1].monthTwo?'2':''">{{dszList[0].monthTwo}}%</td>
|
||||
<td :rowspan="dszList[0].budget ==dszList[1].budget?'2':''">{{formatNumber(dszList[0].budget)}}%</td>
|
||||
<td :rowspan="dszList[0].monthOne ==dszList[1].monthOne?'2':''">{{formatNumber(dszList[0].monthOne)}}%</td>
|
||||
<td :rowspan="dszList[0].monthTwo ==dszList[1].monthTwo?'2':''">{{formatNumber(dszList[0].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>THEME</th>
|
||||
<td v-if="dszList[1].budget !=dszList[0].budget">{{dszList[1].budget}}%</td>
|
||||
<td v-if="dszList[1].monthOne !=dszList[0].monthOne">{{dszList[1].monthOne}}%</td>
|
||||
<td v-if="dszList[1].monthTwo !=dszList[0].monthTwo">{{dszList[1].monthTwo}}%</td>
|
||||
<td v-if="dszList[1].budget !=dszList[0].budget">{{formatNumber(dszList[1].budget)}}%</td>
|
||||
<td v-if="dszList[1].monthOne !=dszList[0].monthOne">{{formatNumber(dszList[1].monthOne)}}%</td>
|
||||
<td v-if="dszList[1].monthTwo !=dszList[0].monthTwo">{{formatNumber(dszList[1].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">市况</th>
|
||||
<td>{{dszList[2].budget}}%</td>
|
||||
<td>{{dszList[2].monthOne}}%</td>
|
||||
<td>{{dszList[2].monthTwo}}%</td>
|
||||
<td>{{formatNumber(dszList[2].budget)}}%</td>
|
||||
<td>{{formatNumber(dszList[2].monthOne)}}%</td>
|
||||
<td>{{formatNumber(dszList[2].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">為替レート</th>
|
||||
<td>{{dszList[3].budget}}%</td>
|
||||
<td>{{dszList[3].monthOne}}%</td>
|
||||
<td>{{dszList[3].monthTwo}}%</td>
|
||||
<td>{{formatNumber(dszList[3].budget)}}%</td>
|
||||
<td>{{formatNumber(dszList[3].monthOne)}}%</td>
|
||||
<td>{{formatNumber(dszList[3].monthTwo)}}%</td>
|
||||
</tr>
|
||||
</table>
|
||||
<table class="data-table" border v-if="activeCard5NavKey === 'DISH'">
|
||||
|
|
@ -469,34 +477,34 @@ const thisSelect = (e) => {
|
|||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">合计</th>
|
||||
<td>{{addDISH1}}%</td>
|
||||
<td>{{addDISH2}}%</td>
|
||||
<td>{{addDISH3}}%</td>
|
||||
<td>{{formatNumber(addDISH1)}}%</td>
|
||||
<td>{{formatNumber(addDISH2)}}%</td>
|
||||
<td>{{formatNumber(addDISH3)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th rowspan="2">C/D</th>
|
||||
<th>交涉</th>
|
||||
<td :rowspan="dishList[0].budget ==dishList[1].budget?'2':''">{{dishList[0].budget}}%</td>
|
||||
<td :rowspan="dishList[0].monthOne ==dishList[1].monthOne?'2':''">{{dishList[0].monthOne}}%</td>
|
||||
<td :rowspan="dishList[0].monthTwo ==dishList[1].monthTwo?'2':''">{{dishList[0].monthTwo}}%</td>
|
||||
<td :rowspan="dishList[0].budget ==dishList[1].budget?'2':''">{{formatNumber(dishList[0].budget)}}%</td>
|
||||
<td :rowspan="dishList[0].monthOne ==dishList[1].monthOne?'2':''">{{formatNumber(dishList[0].monthOne)}}%</td>
|
||||
<td :rowspan="dishList[0].monthTwo ==dishList[1].monthTwo?'2':''">{{formatNumber(dishList[0].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>THEME</th>
|
||||
<td v-if="dishList[1].budget !=dishList[0].budget">{{dishList[1].budget}}%</td>
|
||||
<td v-if="dishList[1].monthOne !=dishList[0].monthOne">{{dishList[1].monthOne}}%</td>
|
||||
<td v-if="dishList[1].monthTwo !=dishList[0].monthTwo">{{dishList[1].monthTwo}}%</td>
|
||||
<td v-if="dishList[1].budget !=dishList[0].budget">{{formatNumber(dishList[1].budget)}}%</td>
|
||||
<td v-if="dishList[1].monthOne !=dishList[0].monthOne">{{formatNumber(dishList[1].monthOne)}}%</td>
|
||||
<td v-if="dishList[1].monthTwo !=dishList[0].monthTwo">{{formatNumber(dishList[1].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">市况</th>
|
||||
<td>{{dishList[2].budget}}%</td>
|
||||
<td>{{dishList[2].monthOne}}%</td>
|
||||
<td>{{dishList[2].monthTwo}}%</td>
|
||||
<td>{{formatNumber(dishList[2].budget)}}%</td>
|
||||
<td>{{formatNumber(dishList[2].monthOne)}}%</td>
|
||||
<td>{{formatNumber(dishList[2].monthTwo)}}%</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th colspan="2">為替レート</th>
|
||||
<td>{{dishList[3].budget}}%</td>
|
||||
<td>{{dishList[3].monthOne}}%</td>
|
||||
<td>{{dishList[3].monthTwo}}%</td>
|
||||
<td>{{formatNumber(dishList[3].budget)}}%</td>
|
||||
<td>{{formatNumber(dishList[3].monthOne)}}%</td>
|
||||
<td>{{formatNumber(dishList[3].monthTwo)}}%</td>
|
||||
</tr>
|
||||
</table>
|
||||
<!-- <img src="@/assets/images/xiaogouzi1.jpg" class="w-full h-full cover" v-if="activeCard5NavKey === 'DSZ'"/>
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@ import { useUserStore } from '@/stores/modules/user'
|
|||
const store = useUserStore()
|
||||
|
||||
const { push } = useRouter()
|
||||
const route = useRoute()
|
||||
const userCode = ['admin', 'csr_dandang', 'tech_service'].includes(
|
||||
store.user.roleCode
|
||||
)
|
||||
|
|
@ -26,7 +27,7 @@ const Content = [
|
|||
{ key: '1-4', component: () => <CSRContent2 /> },
|
||||
]
|
||||
|
||||
const activeNav = ref('1-4')
|
||||
const activeNav = ref(route.query.key || '1-4')
|
||||
const activeContent = computed(() => {
|
||||
const nav = unref(activeNav)
|
||||
const curContent = Content.find((i) => nav.includes(i.key))
|
||||
|
|
@ -38,6 +39,10 @@ const shomks = () => {
|
|||
// push('csr/modifyCsr2')
|
||||
push({ name: 'modifyCsrCarbon' })
|
||||
}
|
||||
|
||||
watch(activeNav, (newVal) => {
|
||||
push({ path: '/Home/csr',replace:true, query: { key: newVal } })
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -49,9 +54,9 @@ const shomks = () => {
|
|||
<div class="h-full relative flex flex-col">
|
||||
<div class="flex flex-end ml10px mt27px">
|
||||
<div class="flex-1"></div>
|
||||
<!-- <el-button class="absolute right-5 top-[-8px]" v-if="userCode && activeNav === '1-2'" type="primary" @click="shomks"
|
||||
<el-button class="absolute right-5 top-[-8px]" v-if="userCode && activeNav === '1-2'" type="primary" @click="shomks"
|
||||
>管理</el-button
|
||||
> -->
|
||||
>
|
||||
<!-- <div class="px16px py8px cursor-pointer text-20px" v-for="nav in Navs" :key="nav.name">{{ nav.name }}</div> -->
|
||||
</div>
|
||||
<div class="flex-1 mt30px text-#142142 flex gap-30px h-825px">
|
||||
|
|
|
|||
|
|
@ -41,7 +41,7 @@ const setSwiperRef2 = (swiper: any) => {
|
|||
}
|
||||
const pageInfo = reactive({
|
||||
currentPage: 1,
|
||||
pageSize: 4,
|
||||
pageSize: 100,
|
||||
total: 10
|
||||
})
|
||||
const swiperList = ref()
|
||||
|
|
|
|||
|
|
@ -3,44 +3,121 @@ import {
|
|||
charData,
|
||||
charData2,
|
||||
pieData1,
|
||||
pieData2,
|
||||
liQuid,
|
||||
liQuids
|
||||
} from './CSRDatas'
|
||||
import zhCn from 'element-plus/dist/locale/zh-cn.mjs'
|
||||
// const { chartRef, option } = charData()
|
||||
// const { chartRef: chartRef1, option: option1 } = charData2()
|
||||
// const { chartRef: chartRefP1, option: optionP1 } = pieData1()
|
||||
import { NNumberAnimation } from "naive-ui";
|
||||
import { NNumberAnimation,NDatePicker } from "naive-ui";
|
||||
import { ref, onMounted } from 'vue'
|
||||
import {
|
||||
fetchStatListlBar,fetchStatListlPie
|
||||
} from '@/api/daikin/base'
|
||||
|
||||
const option = ref({});
|
||||
const yearrange = ref([new Date(2020,0).valueOf(), new Date().valueOf()])
|
||||
const pieYear = ref('20')
|
||||
const option = ref<any>({});
|
||||
const option1 = ref({});
|
||||
const optionP1 = ref<any>({});
|
||||
const chartRef = ref(null);
|
||||
const chartRef = ref<any>(null);
|
||||
const chartRef1 = ref(null);
|
||||
const chartRefP1 = ref(null);
|
||||
const locale = computed(() => zhCn)
|
||||
const YearTime1 = ref('2020')
|
||||
const YearTime2 = ref('2023')
|
||||
const YearTime1 = ref<any>('2020')
|
||||
const YearTime2 = ref<any>('2023')
|
||||
const flgs = ref(3)
|
||||
const cardsClick = (it) => {
|
||||
flgs.value = it
|
||||
console.log(flgs.value)
|
||||
// dataInfo.treeSource = it
|
||||
}
|
||||
const numberObj:any ={
|
||||
'Fe':'铁',
|
||||
'Cu':'铜',
|
||||
'Al':'铝',
|
||||
'shuzhi':'树脂'
|
||||
}
|
||||
const numberList = ['Al','Fe','Cu','shuzhi']
|
||||
const pieDecObj = ref<any>({});
|
||||
numberList.forEach((item) => {
|
||||
pieDecObj.value[item + 1] = 0
|
||||
pieDecObj.value[item + 2] = 0
|
||||
})
|
||||
const statListlBarData = ref([])
|
||||
const getStatListlBar = async ([startYear, endYear] = [2020, 2023]) => {
|
||||
const { data } = await fetchStatListlBar({
|
||||
startYear,
|
||||
endYear
|
||||
})
|
||||
const index = Math.abs(endYear - startYear)
|
||||
const arr = []
|
||||
const serieOne = []
|
||||
const serieTwo = []
|
||||
for (let i = 0; i <= index; i++) {
|
||||
const year = Number(startYear) + i
|
||||
arr.push(year)
|
||||
const item = data.find((it:any) => +it.year === year)
|
||||
serieOne.push(item ? item.dis : 0)
|
||||
serieTwo.push(item ? item.dsz : 0)
|
||||
}
|
||||
option.value.xAxis.data = arr
|
||||
option.value.series[0].data = serieOne
|
||||
option.value.series[1].data = serieTwo
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
const statListlPieData = ref([])
|
||||
const getStatListlPie = async ( year = '2020', channel = 'DIS') => {
|
||||
numberList.forEach((item) => {
|
||||
pieDecObj.value[item + 1] = 0
|
||||
pieDecObj.value[item + 2] = 0
|
||||
})
|
||||
const { data = [] } = await fetchStatListlPie({
|
||||
year,
|
||||
channel
|
||||
})
|
||||
data.forEach((item:any) => {
|
||||
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] || '-'
|
||||
})
|
||||
optionP1.value.series[1].data.push({
|
||||
name: numberObj[item],
|
||||
value: pieDecObj.value[item + 2] || '-'
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
onMounted( () => {
|
||||
const char = charData()
|
||||
option.value = char.option.value
|
||||
chartRef.value = char.chartRef.value
|
||||
console.log("🚀 ~ file: CSRContent22.vue:36 ~ option:", option)
|
||||
// chartRef.value = char.chartRef.value
|
||||
const char1 = charData2()
|
||||
option1.value = char1.option.value
|
||||
chartRef1.value = char1.chartRef.value
|
||||
const charP1 = pieData1()
|
||||
optionP1.value = charP1.option.value
|
||||
chartRefP1.value = charP1.chartRef.value
|
||||
getStatListlBar()
|
||||
getStatListlPie()
|
||||
})
|
||||
|
||||
const chartClick = (it:any) => {
|
||||
getStatListlPie(it.name, it.seriesName)
|
||||
pieYear.value = (+it.name).toString().substring(2)
|
||||
}
|
||||
|
||||
const handleDateChange = (val:any) => {
|
||||
getStatListlBar(val)
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
|
@ -91,31 +168,44 @@ onMounted(() => {
|
|||
</div>
|
||||
</div>
|
||||
<div class="w-full h-450px">
|
||||
<VChart ref="chartRef" :option="option" autoresize />
|
||||
<VChart @click="chartClick" ref="chartRef" :option="option" autoresize />
|
||||
</div>
|
||||
<div class="absolute top-91% flex items-center">
|
||||
<!-- <div class="absolute top-91% flex items-center">
|
||||
日期：<el-config-provider :locale="locale">
|
||||
<el-date-picker
|
||||
v-model="YearTime1"
|
||||
:style="{ width: '100px' }"
|
||||
type="year"
|
||||
class=""
|
||||
:clearable="false"
|
||||
/>
|
||||
—
|
||||
<el-date-picker
|
||||
v-model="YearTime2"
|
||||
:style="{ width: '100px' }"
|
||||
type="year"
|
||||
:clearable="false"
|
||||
/>
|
||||
</el-config-provider>
|
||||
</div> -->
|
||||
<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" />
|
||||
</div>
|
||||
</div>
|
||||
<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">
|
||||
SMM牌号低碳铝价格&价差
|
||||
</div>
|
||||
<div class="w-full h-340px pt-4">
|
||||
<div class="w-full h-340px pt-4 relative">
|
||||
<VChart ref="chartRef1" :option="option1" />
|
||||
<div
|
||||
class="absolute flex flex-col w-full h-full z-200 top-0 left-0 text-center bg-red justify-center items-center"
|
||||
style="background-color: rgba(255, 255, 255, 0.8)"
|
||||
>
|
||||
<img src="@/assets/images/chah.png" />
|
||||
<br />
|
||||
<div class="text-#5683DB text-36px">【做成中,敬请期待】</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="absolute top-12px left-2 flex items-center">
|
||||
<el-config-provider :locale="locale">
|
||||
|
|
@ -142,42 +232,24 @@ onMounted(() => {
|
|||
<div class="w-full h-70% bg-#fff" style="border-radius: 25px 25px 0 0">
|
||||
<div class="text-center text-#265DD5 text-22px py20px font-extrabold">
|
||||
原材料用量及碳排放量占比图<br />
|
||||
<span class="text-16px mt10px"> (FY20BASE基准)</span>
|
||||
<span class="text-16px mt10px"> (FY{{pieYear}}BASE基准)</span>
|
||||
</div>
|
||||
<div class="w-full h-400px">
|
||||
<VChart ref="chartRefP1" :option="optionP1" autoresize />
|
||||
</div>
|
||||
<div class="m20px h-100px bg-#F5F8FF p10px">
|
||||
<div class="py5px">
|
||||
<div class="box-border pr-20px mx-20px h-130px bg-#F5F8FF p10px">
|
||||
<div class="py5px" v-for="n in numberList" :key="n">
|
||||
<!-- <n-number-animation show-separator :from="0" :to="10700"/>吨，碳排放量159,158吨-->
|
||||
<span class="text-18px font-bold text-#3164BF">铝</span
|
||||
<span class="text-18px font-bold text-#3164BF">{{ numberObj[n] }}</span
|
||||
>
|
||||
<span class="ml5px">使用量
|
||||
<n-number-animation show-separator :from="0" :duration="0" :to="10700"/>吨，碳排放量
|
||||
<n-number-animation show-separator :from="0" :duration="0" :to="159158"/>吨
|
||||
</span>
|
||||
</div>
|
||||
<div class="py5px">
|
||||
<span class="text-18px font-bold text-#3164BF">铁</span
|
||||
>
|
||||
<!-- <span class="ml5px">使用量72,645吨，碳排放量165,731吨</span> -->
|
||||
<span class="ml5px">使用量
|
||||
<n-number-animation show-separator :from="0" :duration="0" :to="72645"/>吨，碳排放量
|
||||
<n-number-animation show-separator :from="0" :duration="0" :to="165731"/>吨
|
||||
</span>
|
||||
</div>
|
||||
<div class="py5px">
|
||||
<span class="text-18px font-bold text-#3164BF">铜</span
|
||||
>
|
||||
<!-- <span class="ml5px">使用量0.000吨，碳排放量0.000吨</span> -->
|
||||
<span class="ml5px">使用量
|
||||
<n-number-animation show-separator :from="0" :duration="0" :to="14682"/>吨，碳排放量
|
||||
<n-number-animation show-separator :from="0" :duration="0" :to="78942"/>吨
|
||||
<n-number-animation show-separator :from="0" :duration="300" :to="pieDecObj[`${n}1`]"/>吨，碳排放量
|
||||
<n-number-animation show-separator :from="0" :duration="300" :to="pieDecObj[`${n}2`]"/>吨
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="w-full h-28.5% bg-#fff px20px">
|
||||
<div class="relative w-full h-28.5% bg-#fff px20px">
|
||||
<div class="text-#000 text-22px py20px font-extrabold">
|
||||
2023年9月7日价格
|
||||
</div>
|
||||
|
|
@ -189,13 +261,13 @@ onMounted(() => {
|
|||
><span> 元/吨</span> -->
|
||||
</div>
|
||||
<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> 元/吨</span> -->
|
||||
</div>
|
||||
<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> 元/吨</span> -->
|
||||
|
|
@ -206,6 +278,14 @@ onMounted(() => {
|
|||
<span class="text-#265DD5">行情展示 (cneeex.com)</span> <br />
|
||||
<div class="ml-82px mt-6px">SMM网站</div>
|
||||
</div>
|
||||
<div
|
||||
class="absolute flex flex-col w-full h-full z-200 top-0 left-0 text-center bg-red justify-center items-center"
|
||||
style="background-color: rgba(255, 255, 255, 0.8)"
|
||||
>
|
||||
<img src="@/assets/images/chah.png" class="h-130px object-contain" />
|
||||
<br />
|
||||
<div class="text-#5683DB text-36px">【做成中,敬请期待】</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -222,4 +302,7 @@ onMounted(() => {
|
|||
background: #ecf3ff;
|
||||
}
|
||||
}
|
||||
:deep(.n-date-picker){
|
||||
width: 200px !important;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,28 +1,103 @@
|
|||
<script setup lang="ts">
|
||||
import { NDatePicker } from "naive-ui";
|
||||
// import {message} from '@/utils/message'
|
||||
import {fetchCsrSupplier,fetchCsrSupplierList,fetchCsrSupplierTopList,fetchCsrSupplierTaskInfo} from '@/api/daikin/base'
|
||||
|
||||
const query = ref<any>({
|
||||
year: '',
|
||||
supplierName:''
|
||||
})
|
||||
query.value.year = new Date().getFullYear() + ''
|
||||
const calendar = [4,5,6,7,8,9,10,11,12,1,2,3]
|
||||
const calendarShow = new Date().getMonth() + 1
|
||||
const nowIndexMonth = calendar.indexOf(calendarShow)
|
||||
const updateTime = ref('');
|
||||
|
||||
|
||||
const value = ref(new Date().valueOf())
|
||||
const input = ref()
|
||||
const options =[{
|
||||
value: 'guide',
|
||||
label: 'Guide',
|
||||
}]
|
||||
|
||||
const handleChange = (value) => {
|
||||
console.log(value)
|
||||
const handleChange = () => {
|
||||
getCsrSupplier()
|
||||
getCsrSupplierList()
|
||||
}
|
||||
|
||||
const isDateDisabled = (date) => {
|
||||
const isDateDisabled = (date:any) => {
|
||||
return date > new Date()
|
||||
}
|
||||
const csrSupplier = ref<any>([])
|
||||
const csrSupplierObj = ref<any>({});
|
||||
const months = ['04','05','06','07','08','09','10','11','12','01','02','03']
|
||||
|
||||
const getCsrSupplier = ()=>{
|
||||
months.forEach((item:any)=>{
|
||||
csrSupplierObj.value[item] = {month:item}
|
||||
})
|
||||
const req = {...query.value}
|
||||
fetchCsrSupplier(req).then(({data={}})=>{
|
||||
const resData = Object.keys(data) || []
|
||||
try {
|
||||
csrSupplier.value = resData.length ? resData.map(key => {
|
||||
const obj = data[key] || {}
|
||||
const month = String(key).split('-')?.[1] || ''
|
||||
Object.assign(csrSupplierObj.value[month], obj)
|
||||
return {
|
||||
key,
|
||||
month,
|
||||
data: obj,
|
||||
}
|
||||
}) : []
|
||||
} catch (error) {
|
||||
}
|
||||
console.log("🚀 ~ file: CSRContent23.vue:50 ~ csrSupplierObj:", csrSupplierObj)
|
||||
if(!csrSupplier.value.length) {
|
||||
// message.warning('暂无数据')
|
||||
csrSupplierObj.value = {}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const csrSupplierList = ref<any>([])
|
||||
const selMonth = ref('')
|
||||
const getCsrSupplierList = (index?:any) => {
|
||||
const month = (index || index=== 0) ? query.value.year +'-'+ months[index] : ''
|
||||
csrSupplierList.value = []
|
||||
selMonth.value = ''
|
||||
const req = {pageNum:1,pageSize:10,...query.value,month}
|
||||
req.supplierName ? fetchCsrSupplierList(req).then((res : any)=>{
|
||||
csrSupplierList.value = (res.rows || []).filter((item:any) => item.submitunCount > 0)
|
||||
}) : fetchCsrSupplierTopList(req).then((res : any)=>{
|
||||
csrSupplierList.value = (res.rows || []).filter((item:any) => item.submitunCount > 0)
|
||||
});
|
||||
selMonth.value = month ? +months[index] + '月' : ''
|
||||
}
|
||||
|
||||
const getCsrSupplierTaskInfo = ()=>{
|
||||
fetchCsrSupplierTaskInfo().then((res)=>{
|
||||
updateTime.value = res.data?.updateTime
|
||||
})
|
||||
}
|
||||
|
||||
const handleMonth = (index:number) => {
|
||||
getCsrSupplierList(index)
|
||||
}
|
||||
|
||||
getCsrSupplier()
|
||||
getCsrSupplierList()
|
||||
getCsrSupplierTaskInfo()
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex w-full rounded-18px">
|
||||
<!-- <AppBlock> -->
|
||||
<!-- <img src="./images/goudongxi2.png" class="w-full h-full" /> -->
|
||||
<div class="w-full bg-#f4f4f4 flex flex-wrap justify-between h-full rd-25px">
|
||||
<div class="relative overflow-hidden w-full bg-#f4f4f4 flex flex-wrap justify-between h-full rd-25px">
|
||||
<div
|
||||
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"
|
||||
style="background-color: rgba(255, 255, 255, 0.8)"
|
||||
>
|
||||
<img src="@/assets/images/chah.png" class="h-300px object-contain" />
|
||||
<br />
|
||||
<div class="text-#5683DB text-46px mt-10">【做成中,敬请期待】</div>
|
||||
</div>
|
||||
<div class="cards">
|
||||
<div class="cards_title">供方月度碳排放数据提交情况</div>
|
||||
<div class="!text-18px right-20 pt30px text-#4E7EE8 ">
|
||||
|
|
@ -32,10 +107,10 @@ const isDateDisabled = (date) => {
|
|||
</div>
|
||||
<div class="flex w-full h-80px p20px items-center mt10px">
|
||||
<div>
|
||||
<n-date-picker v-model:value="value" type="year" @change:value="handleChange" placeholder="" :is-date-disabled="isDateDisabled" />
|
||||
<el-date-picker v-model="query.year" type="year" @change="handleChange" placeholder="" :disabled-date="isDateDisabled" :clearable="false" value-format="YYYY" />
|
||||
</div>
|
||||
<el-input v-model="input" class="w-50 m-2" placeholder="供方名" prefix-icon="Search" width="150px"/>
|
||||
<el-button type="primary">查询</el-button>
|
||||
<el-input v-model.trim="query.supplierName" class="w-50 m-2" placeholder="供方名" prefix-icon="Search" width="150px"/>
|
||||
<el-button type="primary" @click="handleChange">查询</el-button>
|
||||
</div>
|
||||
<div class="w-full h-730px p20px">
|
||||
<el-row :gutter="10" v-if="false">
|
||||
|
|
@ -52,24 +127,28 @@ const isDateDisabled = (date) => {
|
|||
</div></el-col>
|
||||
</el-row>
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="8"><div class="times" >
|
||||
<!-- <div class="text-#d3d2d2 text-18px font-bold absolute left-40% top-45%"><span class="text-60px">4</span>月</div> -->
|
||||
<div class="text-#fff text-18px font-bold absolute left-40% top-24px"><span class="text-24px">4</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-col :span="8"><div class="time" >
|
||||
<el-col :span="8" v-for="(it,i) in months" :key="i">
|
||||
<div :class=" i <= nowIndexMonth ? 'times' : 'time'" @click="handleMonth(i)" >
|
||||
<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">
|
||||
<div class="text-#fff text-18px font-bold absolute left-40% top-24px"><span class="text-24px">{{ +it }}</span>月</div>
|
||||
<div class="bg-#fff w-140px absolute top-70px text-#A0C6B5 text-18px font-bold p10px left-10% rounded-xl">已提交：{{csrSupplierObj[it]?.submitedCount || 0 }}</div>
|
||||
<div class="bg-#fff w-140px absolute top-110px text-red text-18px font-bold p10px left-10% rounded-xl">未提交：{{ csrSupplierObj[it]?.submitunCount || 0 }}</div>
|
||||
</template>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="8" v-if="false"><div class="time" >
|
||||
<div class="text-#d3d2d2 text-18px font-bold absolute left-38% top-45%"><span class="text-60px">5</span>月</div>
|
||||
<template v-if="false">
|
||||
<div class="bg-#fff w-120px absolute top-70px text-#A0C6B5 text-16px font-bold p10px left-15% rounded-xl">已提交：45</div>
|
||||
<div class="bg-#fff w-120px absolute top-110px text-red text-16px font-bold p10px left-15% rounded-xl">未提交：100</div>
|
||||
</template>
|
||||
</div></el-col>
|
||||
<el-col :span="8"><div class="time">
|
||||
<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">
|
||||
<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>
|
||||
|
|
@ -83,7 +162,7 @@ const isDateDisabled = (date) => {
|
|||
<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">
|
||||
<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>
|
||||
|
|
@ -94,7 +173,7 @@ const isDateDisabled = (date) => {
|
|||
<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">
|
||||
<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">
|
||||
|
|
@ -113,22 +192,27 @@ const isDateDisabled = (date) => {
|
|||
</div>
|
||||
<div class="cards">
|
||||
|
||||
<div class="cards_title">未提交供应商明细</div>
|
||||
<div class="!text-18px right-20px pt30px text-#4E7EE8 ">
|
||||
<span class="text-#ababab">更新时间：2023-9-24 21:37:39</span>
|
||||
<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">
|
||||
<div ref="msgScoll" class="px20px w-full h800px cent_box overflow-y-auto mt-12px">
|
||||
|
||||
<div v-if="true" class=" text-18px text-#808696 bg-#F4F8FF items-center flex py10px rd-5px mt10px" v-for="(i, key) in 9" :key="i">
|
||||
<div class="truncate2" @click="toDetail(i,'App_E_Message')">
|
||||
<span class="text-#fff bg-#407DF1 px5px rounded-20px mr-5px inlineFlex">{{ ++key }}</span>
|
||||
<span>{{'供应商名称' + i}} </span>
|
||||
<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-w150px max-w150px text-#000">3次未提交</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">
|
||||
<el-button>提醒</el-button>
|
||||
<!-- 暂不开发 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>
|
||||
|
|
@ -183,8 +267,8 @@ const isDateDisabled = (date) => {
|
|||
}
|
||||
}
|
||||
.truncate2 {
|
||||
max-width:250px;
|
||||
min-width:250px;
|
||||
max-width:360px;
|
||||
min-width:360px;
|
||||
overflow: hidden;
|
||||
padding: 5px 10px;
|
||||
line-height: 30px;
|
||||
|
|
@ -197,4 +281,9 @@ const isDateDisabled = (date) => {
|
|||
text-decoration: none
|
||||
}
|
||||
}
|
||||
:deep{
|
||||
.el-empty__description > p{
|
||||
font-size: 28px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -391,14 +391,14 @@ export function charData() {
|
|||
// ]
|
||||
// },
|
||||
|
||||
xAxis: { type: 'category', data: form.value.lable4.name.split(',') },
|
||||
xAxis: { type: 'category', data: [] },
|
||||
yAxis: {},
|
||||
series: [
|
||||
{
|
||||
name: 'DIS',
|
||||
type: 'bar',
|
||||
barWidth: '30%',
|
||||
data: form.value.lable4.year.split(','),
|
||||
data: [],
|
||||
label: {
|
||||
show: false
|
||||
}
|
||||
|
|
@ -412,7 +412,7 @@ export function charData() {
|
|||
formatter: '{c}%'
|
||||
},
|
||||
barWidth: '30%',
|
||||
data: form.value.lable4.date.split(',')
|
||||
data: []
|
||||
}
|
||||
// { name: '预测/实绩用量', type: 'line' }
|
||||
]
|
||||
|
|
@ -594,17 +594,17 @@ export function pieData1() {
|
|||
orient: 'vertical',
|
||||
data: [
|
||||
{
|
||||
name: '原材料碳排放量（吨）',
|
||||
name: '原材料使用量（吨）',
|
||||
itemStyle: { color: '#f8cbad', borderWidth: 0 }
|
||||
},
|
||||
{
|
||||
name: '原材料使用量（吨）',
|
||||
name: '原材料碳排放量（吨）',
|
||||
itemStyle: { color: '#acc1fb', borderWidth: 0 }
|
||||
}
|
||||
],
|
||||
selectedMode: false,
|
||||
left: 10,
|
||||
top: 30
|
||||
top: 25
|
||||
},
|
||||
title: {
|
||||
text: form.value.lable8.name,
|
||||
|
|
@ -616,10 +616,10 @@ export function pieData1() {
|
|||
trigger: 'item'
|
||||
},
|
||||
grid: {
|
||||
left: '20',
|
||||
// top: '100',
|
||||
right: '70',
|
||||
bottom: '10',
|
||||
// left: '20',
|
||||
// // top: '100',
|
||||
// right: '70',
|
||||
// bottom: '10',
|
||||
containLabel: true
|
||||
},
|
||||
// legend: {
|
||||
|
|
@ -629,44 +629,23 @@ export function pieData1() {
|
|||
// },
|
||||
series: [
|
||||
{
|
||||
name: '原材料碳排放量（吨）',
|
||||
center: ['50%', '56%'],
|
||||
name: '原材料使用量（吨）',
|
||||
type: 'pie',
|
||||
selectedMode: 'single',
|
||||
radius: [0, '60%'],
|
||||
radius: [0, '50%'],
|
||||
// silent: 'ture', //图形是否不响应和触发鼠标事件，默认为 false，即响应和触发鼠标事件。
|
||||
// avoidLabelOverlap: false,
|
||||
// legendHoverLink: false,
|
||||
label: {
|
||||
position: 'inner',
|
||||
fontSize: 14,
|
||||
fontSize: 16,
|
||||
formatter: '{b}：{c}'
|
||||
},
|
||||
labelLine: {
|
||||
show: false
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: 159158,
|
||||
name: '铝',
|
||||
label: { color: '#000', fontSize: '16px', fontWeight: '' }
|
||||
},
|
||||
{
|
||||
value: 165731,
|
||||
name: '铁',
|
||||
label: { color: '#000', fontSize: '16px', fontWeight: '' }
|
||||
},
|
||||
{
|
||||
value: 78942,
|
||||
name: '铜',
|
||||
// selected: true,
|
||||
label: { color: '#000', fontSize: '16px', fontWeight: '' }
|
||||
},
|
||||
{
|
||||
value: 10000,
|
||||
name: '树脂',
|
||||
label: { color: '#000', fontSize: '16px', fontWeight: '' }
|
||||
}
|
||||
],
|
||||
data: [],
|
||||
// 自定义颜色
|
||||
itemStyle: {
|
||||
// emphasis: {
|
||||
|
|
@ -686,9 +665,10 @@ export function pieData1() {
|
|||
// hoverAnimation: false,
|
||||
},
|
||||
{
|
||||
name: '原材料使用量（吨）',
|
||||
center: ['50%', '56%'],
|
||||
name: '原材料碳排放量（吨）',
|
||||
type: 'pie',
|
||||
radius: ['55%', '80%'],
|
||||
radius: ['50%', '80%'],
|
||||
avoidLabelOverlap: false,
|
||||
itemStyle: {
|
||||
// borderRadius: 10,
|
||||
|
|
@ -739,12 +719,7 @@ export function pieData1() {
|
|||
// }
|
||||
// }
|
||||
},
|
||||
data: [
|
||||
{ value: 0.0, name: '铝' },
|
||||
{ value: 0.0, name: '铁' },
|
||||
{ value: 0.0, name: '铜' },
|
||||
{ value: 0.0, name: '树脂' }
|
||||
]
|
||||
data: []
|
||||
// 自定义颜色
|
||||
// itemStyle: {
|
||||
// borderColor: '#fff',
|
||||
|
|
|
|||
|
|
@ -180,7 +180,7 @@
|
|||
<script setup lang="ts">
|
||||
import HomeHead from '@/views/home/components/HomeHead.vue'
|
||||
import { useUserStore } from '@/stores/modules/user'
|
||||
import { updateFootprint,getFootprintList,saveFootprintUser,delFootprint} from '@/api/daikin/base'
|
||||
import { updateFootprint,getFootprintList,saveFootprintUser,delFootprint,fetchGetViewScope} from '@/api/daikin/base'
|
||||
import { NModal, useMessage, NSelect } from "naive-ui";
|
||||
import UserList from '@/views/home/intelligence/process/UserPages.vue'
|
||||
|
||||
|
|
@ -485,8 +485,8 @@ async function getUser(row) {
|
|||
// if(row.id&&row.userList){
|
||||
// setUserList.value = row.userList
|
||||
// }
|
||||
// const {data: userArr} = await getBPCUser({moduleId})
|
||||
// setUserList.value = userArr
|
||||
const {data: userArr} = await fetchGetViewScope({moduleId:row})
|
||||
setUserList.value = userArr
|
||||
|
||||
}
|
||||
// 获取子组件传过来的值
|
||||
|
|
|
|||
|
|
@ -161,22 +161,24 @@ function getLastSubstring(str: string): string {
|
|||
<thead
|
||||
style="background-color: #E7EDFF;color: #000;height: 50px;width: 220px; border: 1px solid #417BEF;">
|
||||
<tr class="text-20px leading-50px">
|
||||
<th width="28%"><img src="@/assets/images/baiot@2x.png" class="w35px mt--7px mr-5px" />标题</th>
|
||||
<th width="28%"><img src="@/assets/images/scbmm@2x.png" class="w35px mt--7px mr-5px" />上传部门</th>
|
||||
<th width="28%"><img src="@/assets/images/riqii@2x.png" class="w35px mt--7px mr-5px" />上传日期</th>
|
||||
<th width="20%"><img src="@/assets/images/baiot@2x.png" class="w35px mt--7px mr-5px" />标题</th>
|
||||
<th width="20%"><img src="@/assets/images/scbmm@2x.png" class="w35px mt--7px mr-5px" />上传科室</th>
|
||||
<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="16%">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class=" h650px overflow-auto absolute w100% ">
|
||||
<tr class="w-full flex leading-50px" v-for="it in tableData">
|
||||
<td class="w28% h50px cursor-pointer overflow-hidden text-left pl25px truncate text-#000" >
|
||||
<td class="w20% h50px cursor-pointer overflow-hidden text-left pl25px truncate text-#000" >
|
||||
|
||||
<span :title="it.title" > {{it.title}}</span>
|
||||
|
||||
|
||||
</td>
|
||||
<td class="w28% h50px">{{it.deptName}}</td>
|
||||
<td class="w28% h50px">{{it.createTime}}</td>
|
||||
<td class="w20% h50px">{{it.deptName}}</td>
|
||||
<td class="w20% h50px">{{it.parentDeptName}}</td>
|
||||
<td class="w20% h50px">{{it.createTime}}</td>
|
||||
<td class="w16% h50px">
|
||||
<el-button style="color: #000;" @click="openUrl(it)">预览</el-button>
|
||||
<el-button style="color: #000;" @click="downloads(it)">下载</el-button>
|
||||
|
|
|
|||
|
|
@ -1,225 +1,303 @@
|
|||
<script setup lang="ts">
|
||||
import HomeHead from "@/views/home/components/HomeHead.vue";
|
||||
import { timeStat } from '@/api/daikin/base';
|
||||
import { formatDate } from '@/utils/format';
|
||||
import { Chart1 } from "./indexData";
|
||||
import zhCn from "element-plus/lib/locale/lang/zh-cn";
|
||||
const currentDate = new Date();
|
||||
const currentDates = new Date();
|
||||
import HomeHead from '@/views/home/components/HomeHead.vue'
|
||||
import { timeStat,externalTimeStat } from '@/api/daikin/base'
|
||||
import { formatDate } from '@/utils/format'
|
||||
import { Chart1 } from './indexData'
|
||||
import zhCn from 'element-plus/lib/locale/lang/zh-cn'
|
||||
const currentDate = new Date()
|
||||
const currentDates = new Date()
|
||||
const value1 = ref<[Date, Date]>([
|
||||
currentDate.setMonth(currentDate.getMonth()),
|
||||
new Date()
|
||||
currentDate.setMonth(currentDate.getMonth()),
|
||||
new Date()
|
||||
])
|
||||
const value2 = ref<[Date, Date]>([
|
||||
currentDates.setMonth(currentDates.getMonth()),
|
||||
new Date()
|
||||
])
|
||||
const { chartRef: chartRef1, option: chartOption1, states } = Chart1()
|
||||
const states = reactive<any>({
|
||||
startTime:formatDate(value1.value[0]).substring(0,10),
|
||||
endTime: formatDate(value1.value[1]).substring(0,10),
|
||||
// timeType:2,
|
||||
})
|
||||
const chartRef1 = ref()
|
||||
const chartRef2 = ref()
|
||||
const chartOption1 = ref({});
|
||||
const chartOption2 = ref({});
|
||||
const primary = ref(1)
|
||||
const primarys = ref(2)
|
||||
const activeName = ref('inside')
|
||||
|
||||
|
||||
|
||||
const clickButton = (id) => {
|
||||
primary.value = id
|
||||
state.timeType = id
|
||||
primary.value = id
|
||||
state.timeType = id
|
||||
}
|
||||
const clickButtons = (id) => {
|
||||
primarys.value = id
|
||||
states.timeType = id
|
||||
primarys.value = id
|
||||
states.timeType = id
|
||||
}
|
||||
const timenFirst = (value) => {
|
||||
console.log(value)
|
||||
state.startTime = formatDate(value[0]).substring(0, 10)
|
||||
state.endTime = formatDate(value[1]).substring(0, 10)
|
||||
states.startTime = formatDate(value[0]).substring(0, 10)
|
||||
states.endTime = formatDate(value[1]).substring(0, 10)
|
||||
console.log(value)
|
||||
state.startTime = formatDate(value[0]).substring(0, 10)
|
||||
state.endTime = formatDate(value[1]).substring(0, 10)
|
||||
states.startTime = formatDate(value[0]).substring(0, 10)
|
||||
states.endTime = formatDate(value[1]).substring(0, 10)
|
||||
}
|
||||
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
|
||||
startTime: formatDate(value1.value[0]).substring(0, 10),
|
||||
endTime: formatDate(value1.value[1]).substring(0, 10)
|
||||
// timeType:1
|
||||
})
|
||||
const dataList = ref()
|
||||
const getDat = async () => {
|
||||
const { data } = await timeStat(state)
|
||||
const { data } = await timeStat(state)
|
||||
dataList.value = data
|
||||
let xAxisData:any[]=[]
|
||||
let siomesData:any[]=[]
|
||||
data.forEach((item: { moduleName: any; visitCount: any; })=>{
|
||||
xAxisData.push(item.moduleName)
|
||||
siomesData.push(item.visitCount)
|
||||
})
|
||||
chartOption1.value = Chart1(xAxisData,siomesData)
|
||||
}
|
||||
const ss = computed(() => [state.startTime, state.endTime, state.timeType]);
|
||||
watch(() => unref(ss),
|
||||
async (v) => {
|
||||
console.log(state.type)
|
||||
getDat()
|
||||
|
||||
},
|
||||
{ immediate: true, deep: true },
|
||||
const externalList = ref()
|
||||
const getExternalTimeStat = async () => {
|
||||
const { data } = await externalTimeStat(state)
|
||||
externalList.value = data
|
||||
let xAxisData:any[]=[]
|
||||
let siomesData:any[]=[]
|
||||
data.forEach((item: { moduleName: any; visitCount: any; })=>{
|
||||
xAxisData.push(item.moduleName)
|
||||
siomesData.push(item.visitCount)
|
||||
})
|
||||
chartOption2.value = Chart1(xAxisData,siomesData)
|
||||
// chartOption2.value.height=3000
|
||||
// chartOption2.value.width=1000
|
||||
}
|
||||
const ss = computed(() => [state.startTime, state.endTime, state.timeType])
|
||||
watch(
|
||||
() => unref(ss),
|
||||
async (v) => {
|
||||
console.log(state.type)
|
||||
getDat()
|
||||
getExternalTimeStat()
|
||||
},
|
||||
{ immediate: true, deep: true }
|
||||
)
|
||||
|
||||
onMounted(() => {
|
||||
// getDat()
|
||||
console.log(formatDate(value1.value[0]).substring(0, 10))
|
||||
// getDat()
|
||||
// console.log(formatDate(value1.value[0]).substring(0, 10))
|
||||
|
||||
})
|
||||
const shortcuts = [
|
||||
{
|
||||
text: '今天',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
// {
|
||||
// text: '昨天',
|
||||
// value: () => {
|
||||
// let start = new Date()
|
||||
// let end = new Date()
|
||||
// start.setTime(start.getTime() - 3600 * 1000 * 24)
|
||||
// end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
// start.setHours(0, 0, 0)
|
||||
// end.setHours(23, 59, 59)
|
||||
// return [start, end]
|
||||
// }
|
||||
// },
|
||||
{
|
||||
text: '近7天',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '近15天',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 15)
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '近30天',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '近3月',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
]
|
||||
|
||||
|
||||
{
|
||||
text: '今天',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
// {
|
||||
// text: '昨天',
|
||||
// value: () => {
|
||||
// let start = new Date()
|
||||
// let end = new Date()
|
||||
// start.setTime(start.getTime() - 3600 * 1000 * 24)
|
||||
// end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
// start.setHours(0, 0, 0)
|
||||
// end.setHours(23, 59, 59)
|
||||
// return [start, end]
|
||||
// }
|
||||
// },
|
||||
{
|
||||
text: '近7天',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '近15天',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 15)
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '近30天',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
},
|
||||
{
|
||||
text: '近3月',
|
||||
value: () => {
|
||||
let start = new Date()
|
||||
let end = new Date()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
|
||||
end.setTime(end.getTime() - 3600 * 1000 * 24)
|
||||
start.setHours(0, 0, 0)
|
||||
end.setHours(23, 59, 59)
|
||||
return [start, end]
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
const handleClick = ({paneName}:any) => {
|
||||
paneName === 'out' && getExternalTimeStat()
|
||||
paneName === 'inside' && getDat()
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<HomeHead class="top"></HomeHead>
|
||||
<div class="w-full h-834px mt30px rd-20px bg-#fff p30px">
|
||||
|
||||
<div>
|
||||
<span class="text-#000">日期: </span>
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker v-model="value1" type="daterange" range-separator="到" start-placeholder="开始时间"
|
||||
end-placeholder="结束时间" size="small" @change="timenFirst" :shortcuts="shortcuts" />
|
||||
|
||||
</el-config-provider>
|
||||
<el-button type="primary" :icon="Search" size="small" class="ml20px mt--5px">搜素</el-button>
|
||||
<!-- <el-button :type="primary == 1 ? 'primary' : ''" :icon="Search" class="!ml100px mt--5px"
|
||||
<HomeHead class="top"></HomeHead>
|
||||
<div class="w-full h-834px mt30px rd-20px bg-#fff p30px overflow-hidden">
|
||||
<div>
|
||||
<span class="text-#000">日期: </span>
|
||||
<el-config-provider :locale="zhCn">
|
||||
<el-date-picker
|
||||
v-model="value1"
|
||||
type="daterange"
|
||||
range-separator="到"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
size="small"
|
||||
@change="timenFirst"
|
||||
:shortcuts="shortcuts"
|
||||
/>
|
||||
</el-config-provider>
|
||||
<el-button
|
||||
type="primary"
|
||||
:icon="Search"
|
||||
size="small"
|
||||
class="ml20px mt--5px"
|
||||
>搜素</el-button
|
||||
>
|
||||
<!-- <el-button :type="primary == 1 ? 'primary' : ''" :icon="Search" class="!ml100px mt--5px"
|
||||
@click="clickButton(1)">本日</el-button>
|
||||
<el-button :type="primary == 2 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
|
||||
@click="clickButton(2)">本周</el-button>
|
||||
<el-button :type="primary == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
|
||||
@click="clickButton(3)">本月</el-button> -->
|
||||
</div>
|
||||
|
||||
<div class="mt50px w-full">
|
||||
|
||||
|
||||
<span class="cardfoot text-#000 p30px mx10px my10px text-center text-18px font-bold" v-if="dataList"
|
||||
v-for="i in dataList">
|
||||
<span>{{ i.moduleName }}</span><br>
|
||||
<br>
|
||||
<span class="mt10px">{{ i.visitCount }}</span>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
<div class="mt50px w-full">
|
||||
<!-- <div class="relative w-full h-50px flex">
|
||||
<el-button :type="primarys == 2 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
|
||||
@click="clickButtons(2)">本周</el-button>
|
||||
<el-button :type="primarys == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
|
||||
@click="clickButtons(3)">本月</el-button>
|
||||
<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>
|
||||
<el-tabs class="mt-20px" v-model="activeName" @tab-click="handleClick">
|
||||
<el-tab-pane label="本部足迹" name="inside">
|
||||
<div class="mt20px w-full">
|
||||
<span
|
||||
class="cardfoot text-#000 p30px mx10px my10px text-center text-18px font-bold"
|
||||
v-if="dataList"
|
||||
v-for="i in dataList"
|
||||
>
|
||||
<span>{{ i.moduleName }}</span
|
||||
><br />
|
||||
<br />
|
||||
<span class="mt10px">{{ i.visitCount }}</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="mt10px w-full">
|
||||
<!-- <div class="relative w-full h-50px flex">
|
||||
<el-button :type="primarys == 2 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
|
||||
@click="clickButtons(2)">本周</el-button>
|
||||
<el-button :type="primarys == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
|
||||
@click="clickButtons(3)">本月</el-button>
|
||||
<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="yyy" ref="chartRef1" :option="chartOption1" />
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="外部足迹" name="out">
|
||||
</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="dataList"
|
||||
v-for="i in externalList"
|
||||
>
|
||||
<span>{{ i.moduleName }}</span
|
||||
><br />
|
||||
<br />
|
||||
<span class="mt10px">{{ i.visitCount }}</span>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
</div> -->
|
||||
<div class="w-full h-400px">
|
||||
<VChart ref="chartRef1" :option="chartOption1" />
|
||||
<div class="mt10px w-full">
|
||||
<!-- <div class="relative w-full h-50px flex">
|
||||
<el-button :type="primarys == 2 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
|
||||
@click="clickButtons(2)">本周</el-button>
|
||||
<el-button :type="primarys == 3 ? 'primary' : ''" :icon="Search" class="!ml30px mt--5px"
|
||||
@click="clickButtons(3)">本月</el-button>
|
||||
<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>
|
||||
|
||||
<style lang="less">
|
||||
<style lang="less" scoped>
|
||||
.cardfoot {
|
||||
display: inline-block;
|
||||
height: 120px;
|
||||
width: 220px;
|
||||
background-image: url('@/assets/images/bg-card.svg');
|
||||
background-size: cover;
|
||||
border-radius: 18px;
|
||||
box-shadow: 0px 6px 10px -2px rgba(43, 42, 42, 0.25)
|
||||
display: inline-block;
|
||||
height: 120px;
|
||||
width: 220px;
|
||||
background-image: url('@/assets/images/bg-card.svg');
|
||||
background-size: cover;
|
||||
border-radius: 18px;
|
||||
box-shadow: 0px 6px 10px -2px rgba(43, 42, 42, 0.25);
|
||||
}
|
||||
|
||||
.cardfoot:hover {
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 9px 20px 7px rgba(92, 78, 218, 0.25);
|
||||
color: #2042b4;
|
||||
background-color: #fff;
|
||||
box-shadow: 0px 9px 20px 7px rgba(92, 78, 218, 0.25);
|
||||
color: #2042b4;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.top {
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
position: absolute;
|
||||
right: 30px;
|
||||
top: -92px;
|
||||
}
|
||||
</style>
|
||||
::v-deep{
|
||||
.el-tabs__item{
|
||||
font-size: 16px !important;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -21,68 +21,97 @@ const states = reactive<any>({
|
|||
})
|
||||
|
||||
|
||||
export function Chart1() {
|
||||
// export function Chart1() {
|
||||
|
||||
const chartRef = ref()
|
||||
const optionRef = ref()
|
||||
async function getDat() {
|
||||
const {data} = await timeStat(states)
|
||||
let xAxisData:any[]=[]
|
||||
let siomesData:any[]=[]
|
||||
data.map((item: { moduleName: any; visitCount: any; })=>{
|
||||
xAxisData.push(item.moduleName)
|
||||
siomesData.push(item.visitCount)
|
||||
})
|
||||
console.log(xAxisData,siomesData)
|
||||
if(!data) return
|
||||
// let {LME,SMM} = data[state.type]
|
||||
// const chartRef = ref()
|
||||
// const optionRef = ref()
|
||||
// async function getDat() {
|
||||
// const {data} = await timeStat(states)
|
||||
// let xAxisData:any[]=[]
|
||||
// let siomesData:any[]=[]
|
||||
// data.map((item: { moduleName: any; visitCount: any; })=>{
|
||||
// xAxisData.push(item.moduleName)
|
||||
// siomesData.push(item.visitCount)
|
||||
// })
|
||||
// console.log(xAxisData,siomesData)
|
||||
// if(!data) return
|
||||
// // let {LME,SMM} = data[state.type]
|
||||
|
||||
const option = {
|
||||
// const option = {
|
||||
|
||||
// height: '450px', // 设置图表高度为 400 像素
|
||||
grid: { left: '10', top: 90, right: '10', bottom: '10', containLabel: true },
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
// legend: {
|
||||
// data: ["SMM", "LME"],
|
||||
// right: 20,
|
||||
// top: 10,
|
||||
// },
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data:xAxisData
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
data: siomesData,
|
||||
color: '#8F97F8',
|
||||
type: 'bar',
|
||||
// // height: '450px', // 设置图表高度为 400 像素
|
||||
// grid: { left: '10', top: 90, right: '10', bottom: '10', containLabel: true },
|
||||
// tooltip: {
|
||||
// trigger: 'axis'
|
||||
// },
|
||||
// // legend: {
|
||||
// // data: ["SMM", "LME"],
|
||||
// // right: 20,
|
||||
// // top: 10,
|
||||
// // },
|
||||
// xAxis: {
|
||||
// type: 'category',
|
||||
// data:xAxisData
|
||||
// },
|
||||
// yAxis: [
|
||||
// {
|
||||
// type: 'value'
|
||||
// }
|
||||
// ],
|
||||
// series: [
|
||||
// {
|
||||
// data: siomesData,
|
||||
// color: '#8F97F8',
|
||||
// type: 'bar',
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
optionRef.value = option
|
||||
}
|
||||
const ss = computed(() => [states.timeType,states.startTime,states.endTime])
|
||||
watch(() => unref(ss),
|
||||
async (v) => {
|
||||
console.log(states.timeType)
|
||||
getDat()
|
||||
// }
|
||||
// ]
|
||||
// }
|
||||
// optionRef.value = option
|
||||
// }
|
||||
// const ss = computed(() => [states.timeType,states.startTime,states.endTime])
|
||||
// watch(() => unref(ss),
|
||||
// async (v) => {
|
||||
// console.log(states.timeType)
|
||||
// getDat()
|
||||
|
||||
// },
|
||||
// { immediate: true, deep: true },
|
||||
// )
|
||||
// watchEffect(() => {
|
||||
// const option = chartRef.value;
|
||||
// chartRef.value = option;
|
||||
// });
|
||||
|
||||
// return { chartRef, option: optionRef, states }
|
||||
// }
|
||||
|
||||
export function Chart1(xAxisData:any =[],siomesData:any=[],options={}) {
|
||||
const option = {
|
||||
width: '100%',
|
||||
// height: '450px', // 设置图表高度为 400 像素
|
||||
grid: { left: '10', top: 90, right: '10', bottom: '10', containLabel: true },
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
{ immediate: true, deep: true },
|
||||
)
|
||||
watchEffect(() => {
|
||||
const option = chartRef.value;
|
||||
chartRef.value = option;
|
||||
});
|
||||
|
||||
return { chartRef, option: optionRef, states }
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data:xAxisData
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
data: siomesData,
|
||||
color: '#8F97F8',
|
||||
type: 'bar',
|
||||
|
||||
}
|
||||
]
|
||||
}
|
||||
return {...option,...options}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -277,7 +277,7 @@ async function deleteGroups(id) {
|
|||
<el-table-column type="selection" width="55" />
|
||||
<el-table-column property="nickName" label="用户名称" width="220" />
|
||||
<el-table-column property="dept.deptName" label="科室" width="180" />
|
||||
<el-table-column property="dept.deptName" label="部门" width="180" />
|
||||
<el-table-column property="dept.parentDeptName" label="部门" width="180" />
|
||||
<el-table-column property="positionName" label="职位" width="120" />
|
||||
|
||||
<el-table-column property="name" label="操作" width="220">
|
||||
|
|
|
|||
|
|
@ -241,7 +241,7 @@ function getLastSubstring(str: string): string {
|
|||
}"
|
||||
:cell-style="{ 'text-align': 'center', height: '70px', 'font-size': '18px' }"
|
||||
>
|
||||
<el-table-column prop="createTime" label="时间" width="130px" />
|
||||
<el-table-column prop="createTime" label="时间" width="134px" />
|
||||
<el-table-column prop="cate" label="类别" width="100px" />
|
||||
<el-table-column prop="title" label="详情" />
|
||||
<el-table-column prop="filePathList" label="情报追踪">
|
||||
|
|
@ -306,7 +306,8 @@ function getLastSubstring(str: string): string {
|
|||
:data="dataA"
|
||||
stripe
|
||||
height="400px"
|
||||
style="width: 100%"
|
||||
style="width: 100%;"
|
||||
scrollbar-always-on
|
||||
:header-cell-style="{
|
||||
'text-align': 'center',
|
||||
'background-color': '#417BEF',
|
||||
|
|
@ -380,7 +381,7 @@ function getLastSubstring(str: string): string {
|
|||
}"
|
||||
:cell-style="{ 'text-align': 'center', height: '70px', 'font-size': '18px' }"
|
||||
>
|
||||
<el-table-column prop="createTime" label="时间" width="132px" />
|
||||
<el-table-column prop="createTime" label="时间" width="134px" />
|
||||
<el-table-column prop="title" label="详情" width="110px" />
|
||||
<el-table-column prop="source" label="来源" width="110px" />
|
||||
<el-table-column
|
||||
|
|
|
|||
Loading…
Reference in New Issue