fix: BUG修改
This commit is contained in:
kun
parent
7c076f6b5d
commit
422824d7e1
@ -135,8 +135,8 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, onMounted, watch } from "vue";
|
||||
import { getAIprojectPage, getAIQuestionPage, addAIrecords, getAiMonitorDev } from "@/api/modules/goverment";
|
||||
import { videoList, videoDataAdd, videoDataEdit, videoDataDelete, getengineeringPage } from "@/api/modules/enterpriseApi";
|
||||
import { getAIQuestionPage, addAIrecords, getAiMonitorDev } from "@/api/modules/goverment";
|
||||
import { videoDataAdd, videoDataEdit, videoDataDelete } from "@/api/modules/enterpriseApi";
|
||||
import Pagination from "@/components/ProTable/components/Pagination.vue";
|
||||
import { ElMessage, UploadProps } from "element-plus";
|
||||
import type { FormRules, FormInstance, UploadInstance } from "element-plus";
|
||||
@ -147,14 +147,14 @@ import { useHandleData } from "@/hooks/useHandleData";
|
||||
import LeftMenu from "@/components/LeftMenu/LeftMenu.vue";
|
||||
import type { ResAiProjectPage, ResAiEngineerPage } from "@/api/types/government/AIwaring";
|
||||
import changeTheme from "@/components/changeTheme/index.vue";
|
||||
import { getDustprojectPage, getDustengineeringPage } from "@/api/modules/goverment";
|
||||
import { getUnmannedProjectPage, getUnmannedEngineeringPage, getUnmannedPage } from "@/api/modules/goverment";
|
||||
const pages = ref({
|
||||
pageNo: 1,
|
||||
pageSize: 7,
|
||||
total: 0
|
||||
});
|
||||
const records = ref<ResAiProjectPage[] | ResAiEngineerPage[]>([]);
|
||||
const active = ref(1);
|
||||
const active = ref(0);
|
||||
const upload = ref<UploadInstance>();
|
||||
const fileList = ref([]);
|
||||
const store = GlobalStore();
|
||||
@ -236,7 +236,7 @@ const searchSn = ref("");
|
||||
const searchName = ref<string>("");
|
||||
// 页面的项目名称和工程名称的div点击事件
|
||||
const onSearch = async (params: ResAiProjectPage | ResAiEngineerPage) => {
|
||||
const { result } = await getAIQuestionPage(
|
||||
const { result } = await getUnmannedPage(
|
||||
active.value === 0
|
||||
? { projectSn: (params as ResAiProjectPage).projectSn, pageNo: pageable.value.pageNo, pageSize: pageable.value.pageSize }
|
||||
: {
|
||||
@ -246,32 +246,33 @@ const onSearch = async (params: ResAiProjectPage | ResAiEngineerPage) => {
|
||||
}
|
||||
);
|
||||
pageable.value.total = Number(result.total);
|
||||
videoData.value.records = result.records;
|
||||
active.value === 0
|
||||
? (searchSn.value = (params as ResAiProjectPage).projectSn)
|
||||
: (searchSn.value = (params as ResAiEngineerPage).engineeringSn);
|
||||
active.value === 0
|
||||
? (searchName.value = (params as ResAiProjectPage).projectName)
|
||||
: (searchName.value = (params as ResAiEngineerPage).engineeringName);
|
||||
getVideoData();
|
||||
// getVideoData();
|
||||
};
|
||||
// leftMenu页面的搜索按钮
|
||||
const onSearchInput = async (params: string) => {
|
||||
console.log(params);
|
||||
if (active.value === 0) {
|
||||
const { result } = await getAIprojectPage({ projectName: params, ...pages.value });
|
||||
const { result } = await getUnmannedProjectPage({ projectName: params, ...pages.value });
|
||||
records.value = result.records;
|
||||
} else {
|
||||
const { result } = await getengineeringPage({ engineeringName: params, ...pages.value });
|
||||
const { result } = await getUnmannedEngineeringPage({ engineeringName: params, ...pages.value });
|
||||
records.value = result.records;
|
||||
}
|
||||
};
|
||||
// leftMenu页面的分页
|
||||
const onCurChange = async (params: number) => {
|
||||
if (active.value === 0) {
|
||||
const { result } = await getAIprojectPage({ ...pages.value, pageNo: params });
|
||||
const { result } = await getUnmannedProjectPage({ ...pages.value, pageNo: params });
|
||||
records.value = result.records;
|
||||
} else {
|
||||
const { result } = await getengineeringPage({ ...pages.value, pageNo: params });
|
||||
const { result } = await getUnmannedEngineeringPage({ ...pages.value, pageNo: params });
|
||||
records.value = result.records;
|
||||
pages.value.total = +result.total;
|
||||
}
|
||||
@ -294,7 +295,7 @@ const handleEditItem = (index: number, row: any) => {
|
||||
visible.value = true;
|
||||
};
|
||||
const getVideoData = async () => {
|
||||
const res = await videoList({ ...pageable.value, ...form.value });
|
||||
const res = await getUnmannedPage({ ...pageable.value, ...form.value });
|
||||
videoData.value.records = res.result.records;
|
||||
console.log(videoData.value);
|
||||
console.log(res);
|
||||
@ -367,8 +368,8 @@ const onDatePicker = () => {
|
||||
form.value.endTime = form.value.createTime[1];
|
||||
};
|
||||
// 获取项目名称分页
|
||||
const getAIproPage = async () => {
|
||||
const { result } = await getDustprojectPage(pages.value);
|
||||
const getProPage = async () => {
|
||||
const { result } = await getUnmannedProjectPage(pages.value);
|
||||
records.value = result.records;
|
||||
records.value.map(item => {
|
||||
let showGif = false;
|
||||
@ -377,8 +378,8 @@ const getAIproPage = async () => {
|
||||
pages.value.total = Number(result.total);
|
||||
};
|
||||
// 获取工程名称分页
|
||||
const getAIengPage = async () => {
|
||||
const { result } = await getDustengineeringPage(pages.value);
|
||||
const getEngPage = async () => {
|
||||
const { result } = await getUnmannedEngineeringPage(pages.value);
|
||||
records.value = result.records;
|
||||
records.value.map(item => {
|
||||
let showGif = false;
|
||||
@ -394,12 +395,10 @@ watch(
|
||||
// console.log(value);
|
||||
|
||||
if (value === 0) {
|
||||
await getAIproPage();
|
||||
await getproList();
|
||||
await getProPage();
|
||||
onSearch(records.value[0]);
|
||||
} else {
|
||||
await getAIengPage();
|
||||
await getengList();
|
||||
await getEngPage();
|
||||
onSearch(records.value[0]);
|
||||
}
|
||||
},
|
||||
@ -409,7 +408,7 @@ watch(
|
||||
);
|
||||
onMounted(async () => {
|
||||
getVideoData();
|
||||
await getAIengPage();
|
||||
await getProPage();
|
||||
onSearch(records.value[0]);
|
||||
searchSn.value = (records.value as ResAiProjectPage[])[0].projectSn;
|
||||
searchName.value = (records.value as ResAiProjectPage[])[0].projectName;
|
||||
|
||||
@ -2,7 +2,7 @@
|
||||
<div class="warning-page">
|
||||
<LeftMenu
|
||||
v-model="active"
|
||||
:tabs="[]"
|
||||
:tabs="['项目名称', '工程名称']"
|
||||
:records="records"
|
||||
@change-page="onCurChange"
|
||||
@search="onSearchInput"
|
||||
@ -44,8 +44,14 @@
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, onMounted, watch } from "vue";
|
||||
import { getAIprojectPage, getAIQuestionPage, addAIrecords, getAiMonitorDev } from "@/api/modules/goverment";
|
||||
import { videoList, videoDataAdd, videoDataEdit, videoDataDelete, getengineeringPage } from "@/api/modules/enterpriseApi";
|
||||
import {
|
||||
getDustprojectPage,
|
||||
getDustengineeringPage,
|
||||
getAIQuestionPage,
|
||||
addAIrecords,
|
||||
getAiMonitorDev
|
||||
} from "@/api/modules/goverment";
|
||||
import { videoList, videoDataAdd, videoDataEdit, videoDataDelete } from "@/api/modules/enterpriseApi";
|
||||
import Pagination from "@/components/ProTable/components/Pagination.vue";
|
||||
import { ElMessage, UploadProps } from "element-plus";
|
||||
import type { FormRules, FormInstance, UploadInstance } from "element-plus";
|
||||
@ -64,7 +70,7 @@ const pages = ref({
|
||||
total: 0
|
||||
});
|
||||
const records = ref<ResAiProjectPage[] | ResAiEngineerPage[]>([]);
|
||||
const active = ref(1);
|
||||
const active = ref(0);
|
||||
const fileList = ref([]);
|
||||
const store = GlobalStore();
|
||||
// 表格配置项
|
||||
@ -200,123 +206,73 @@ const onSearch = async (params: ResAiProjectPage | ResAiEngineerPage) => {
|
||||
const onSearchInput = async (params: string) => {
|
||||
console.log(params);
|
||||
if (active.value === 0) {
|
||||
const { result } = await getAIprojectPage({ projectName: params, ...pages.value });
|
||||
const { result } = await getDustprojectPage({ projectName: params, ...pages.value });
|
||||
records.value = result.records;
|
||||
} else {
|
||||
const { result } = await getengineeringPage({ engineeringName: params, ...pages.value });
|
||||
const { result } = await getDustengineeringPage({ engineeringName: params, ...pages.value });
|
||||
records.value = result.records;
|
||||
}
|
||||
};
|
||||
// leftMenu页面的分页
|
||||
const onCurChange = async (params: number) => {
|
||||
if (active.value === 0) {
|
||||
const { result } = await getAIprojectPage({ ...pages.value, pageNo: params });
|
||||
const { result } = await getDustprojectPage({ ...pages.value, pageNo: params });
|
||||
records.value = result.records;
|
||||
} else {
|
||||
const { result } = await getengineeringPage({ ...pages.value, pageNo: params });
|
||||
const { result } = await getDustengineeringPage({ ...pages.value, pageNo: params });
|
||||
records.value = result.records;
|
||||
pages.value.total = +result.total;
|
||||
}
|
||||
pages.value.total = +res.result.total;
|
||||
};
|
||||
// 删除用户信息
|
||||
const deleteAccount = async (params: jxj_User.ResUserList) => {
|
||||
await useHandleData(videoDataDelete, { id: params.id }, `删除`);
|
||||
getVideoData();
|
||||
};
|
||||
const handleSearch = () => {
|
||||
console.log(666);
|
||||
getVideoData();
|
||||
};
|
||||
const handleEditItem = (index: number, row: any) => {
|
||||
title.value = "编辑录像";
|
||||
formData.value = { ...row };
|
||||
console.log(formData.value);
|
||||
fileList.value = reactive([{ name: "文件", url: row.videoUrl }]);
|
||||
visible.value = true;
|
||||
};
|
||||
const getVideoData = async () => {
|
||||
const res = await videoList({ ...pageable.value, ...form.value });
|
||||
videoData.value.records = res.result.records;
|
||||
console.log(videoData.value);
|
||||
console.log(res);
|
||||
};
|
||||
const handleExceed: UploadProps["onExceed"] = files => {
|
||||
// console.log(1111);
|
||||
// upload.value!.clearFiles();
|
||||
// const file = files[0] as UploadRawFile;
|
||||
// file.uid = genFileId();
|
||||
// // fileList.value = file;
|
||||
// upload.value!.handleStart(file);
|
||||
// upload.value?.submit();
|
||||
};
|
||||
|
||||
const uploadSuccess = (response: any) => {
|
||||
ElMessage.success("上传成功");
|
||||
formData.value.videoUrl = response.result.url;
|
||||
fileList.value = [{ name: response.result.originalFilename, url: response.result.downloadPath }];
|
||||
};
|
||||
const onRemove: UploadProps["onRemove"] = (file, uploadFiles) => {
|
||||
formData.value.videoUrl = "";
|
||||
fileList.value = reactive([]);
|
||||
};
|
||||
// 新增影像
|
||||
const addVideoData = () => {
|
||||
title.value = "新增录像";
|
||||
formData.value = reactive<formData>({
|
||||
title: "",
|
||||
uploadTime: "",
|
||||
remark: "",
|
||||
videoUrl: ""
|
||||
// 获取项目名称分页
|
||||
const getProPage = async () => {
|
||||
const { result } = await getDustprojectPage(pages.value);
|
||||
records.value = result.records;
|
||||
records.value.map(item => {
|
||||
let showGif = false;
|
||||
item.showGif = showGif;
|
||||
});
|
||||
fileList.value = reactive([]);
|
||||
visible.value = true;
|
||||
};
|
||||
const confirm = async (formEl: FormInstance | undefined, form: any) => {
|
||||
// 标记表单校验
|
||||
if (!formEl) return;
|
||||
await formEl.validate(async (valid, fields) => {
|
||||
if (valid) {
|
||||
console.log(666);
|
||||
console.log(searchSn.value);
|
||||
formData.value.engineeringSn = searchSn.value;
|
||||
if (formData.value.id) {
|
||||
const res = await videoDataEdit(form);
|
||||
ElMessage.success("编辑成功");
|
||||
visible.value = false;
|
||||
getVideoData();
|
||||
} else {
|
||||
const res = await videoDataAdd(form);
|
||||
ElMessage.success("保存成功");
|
||||
visible.value = false;
|
||||
getVideoData();
|
||||
}
|
||||
} else {
|
||||
console.log("error submit!", fields);
|
||||
ElMessage({
|
||||
showClose: true,
|
||||
message: "请完善表单信息！",
|
||||
type: "error"
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
// 页面的分页
|
||||
const handleCurrentChange = async (page: number) => {};
|
||||
// form日期选择后改变入参
|
||||
const onDatePicker = () => {
|
||||
form.value.startTime = form.value.createTime[0];
|
||||
form.value.endTime = form.value.createTime[1];
|
||||
pages.value.total = Number(result.total);
|
||||
};
|
||||
// 获取工程名称分页
|
||||
const getAIengPage = async () => {
|
||||
const { result } = await getengineeringPage(pages.value);
|
||||
const getEngPage = async () => {
|
||||
const { result } = await getDustengineeringPage(pages.value);
|
||||
records.value = result.records;
|
||||
records.value.map(item => {
|
||||
let showGif = false;
|
||||
item.showGif = showGif;
|
||||
});
|
||||
pages.value.total = +result.total;
|
||||
};
|
||||
watch(
|
||||
() => active.value,
|
||||
async (value: number) => {
|
||||
pages.value.pageNo = 1;
|
||||
pages.value.total = 0;
|
||||
// console.log(value);
|
||||
|
||||
if (value === 0) {
|
||||
await getProPage();
|
||||
onSearch(records.value[0]);
|
||||
} else {
|
||||
await getEngPage();
|
||||
onSearch(records.value[0]);
|
||||
}
|
||||
},
|
||||
{
|
||||
deep: true
|
||||
}
|
||||
);
|
||||
onMounted(async () => {
|
||||
getVideoData();
|
||||
await getAIengPage();
|
||||
await getProPage();
|
||||
onSearch(records.value[0]);
|
||||
searchSn.value = (records.value as ResAiProjectPage[])[0].projectSn;
|
||||
searchName.value = (records.value as ResAiProjectPage[])[0].projectName;
|
||||
|
||||
@ -1,8 +1,325 @@
|
||||
<template>
|
||||
<div class="">实名制考勤</div>
|
||||
<div class="table-box">
|
||||
<div class="statistics-top">
|
||||
<div class="sta-item" v-for="(item, index) in statisticsOption" :key="index">
|
||||
<div class="sta-num">
|
||||
<span>{{ item.name }}</span>
|
||||
<span v-if="item.prop == 'inServiceWorker' || item.prop == 'workerAttendanceTotal'">{{
|
||||
item.value ? item.value + "人" : 0
|
||||
}}</span>
|
||||
<span v-if="item.prop == 'ratio'">{{ item.value ? item.value + "%" : 0 }}</span>
|
||||
<span v-if="item.prop == 'workerAttendanceNum'">{{ item.value ? item.value + "人次" : 0 }}</span>
|
||||
</div>
|
||||
<img :src="item.img" alt="" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="statistics-search">
|
||||
<el-card shadow="never" class="topCard">
|
||||
<span style="margin: 0 10px 2px 0">人员分类</span>
|
||||
<el-select v-model="searchForm.personType" placeholder="请选择">
|
||||
<el-option v-for="item in categoryList" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
<span style="margin: 0 10px 2px 20px">提交时间</span>
|
||||
<el-date-picker
|
||||
v-model="searchForm.dateRange"
|
||||
style="width: 300px"
|
||||
type="daterange"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
>
|
||||
</el-date-picker>
|
||||
<el-button class="hzStyle" type="primary" style="margin-left: 20px" @click="handleSubmit(ruleFormRef)">发送</el-button>
|
||||
</el-card>
|
||||
</div>
|
||||
<div class="statistics-echart">
|
||||
<el-card shadow="never">
|
||||
<div class="count-title">出勤统计</div>
|
||||
<div ref="echartsRef" class="card content-box"></div>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="tsx" name="ProjectSupervisionRecord">
|
||||
import { ref, reactive, nextTick, computed } from "vue";
|
||||
import { ref, reactive, nextTick, onMounted } from "vue";
|
||||
import { ElMessage, ElMessageBox, ElTree, FormInstance } from "element-plus";
|
||||
import { useRouter } from "vue-router";
|
||||
import { ColumnProps } from "@/components/ProTable/interface";
|
||||
import { useHandleData } from "@/hooks/useHandleData";
|
||||
import ProTable from "@/components/ProTable/index.vue";
|
||||
import { getRelevanceList } from "@/api/modules/common";
|
||||
import { jxj_User } from "@/api/types";
|
||||
import engineeringDrawer from "@/components/engineeringDrawer/index.vue";
|
||||
import allEngineering from "@/components/allEngineering/index.vue";
|
||||
import TreeFilter from "@/components/TreeFilter/index.vue";
|
||||
import AMap from "@/components/AMap/AMap.vue";
|
||||
import { editRolePermissions, getTreemRoleList, getTreeByIdList } from "@/api/modules/goverment";
|
||||
import DialogForm from "@/components/DialogForm/index.vue";
|
||||
import { attendanceStatistics } from "@/api/modules/goverment";
|
||||
|
||||
import { Delete } from "@element-plus/icons-vue";
|
||||
import { GlobalStore } from "@/stores";
|
||||
import * as echarts from "echarts";
|
||||
import { useEcharts } from "@/hooks/useEcharts";
|
||||
import { start } from "repl";
|
||||
const statisticsOption = ref([
|
||||
{
|
||||
name: "在职人数",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/在职人数.png", import.meta.url).href,
|
||||
prop: "inServiceWorker"
|
||||
},
|
||||
{
|
||||
name: "今日出勤总数",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/出勤总数.png", import.meta.url).href,
|
||||
prop: "workerAttendanceTotal"
|
||||
},
|
||||
{
|
||||
name: "今日出勤率",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/出勤率.png", import.meta.url).href,
|
||||
prop: "ratio"
|
||||
},
|
||||
{
|
||||
name: "今日考勤次数",
|
||||
value: 0,
|
||||
img: new URL("@/assets/images/govermentImg/考勤次数.png", import.meta.url).href,
|
||||
prop: "workerAttendanceNum"
|
||||
}
|
||||
]);
|
||||
const echartsRef = ref<HTMLElement>();
|
||||
|
||||
const searchForm = ref({
|
||||
personType: null,
|
||||
dateRange: []
|
||||
});
|
||||
const categoryList = ref([
|
||||
{
|
||||
label: "管理",
|
||||
value: 1
|
||||
},
|
||||
{
|
||||
label: "工人",
|
||||
value: 2
|
||||
}
|
||||
]);
|
||||
// 点击发送按钮
|
||||
const handleSubmit = async (formEl: FormInstance | undefined) => {
|
||||
if (!formEl) return;
|
||||
await formEl.validate(async (valid, fields) => {
|
||||
if (valid) {
|
||||
} else {
|
||||
console.log("error submit!", fields);
|
||||
ElMessage({
|
||||
showClose: true,
|
||||
message: "请完善表单信息！",
|
||||
type: "error"
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
const getStatistics = async () => {
|
||||
const res = await attendanceStatistics();
|
||||
statisticsOption.value.map(item => {
|
||||
item.value = res.result[item.prop];
|
||||
});
|
||||
console.log(res);
|
||||
};
|
||||
onMounted(() => {
|
||||
getStatistics();
|
||||
let myChart: echarts.ECharts = echarts.init(echartsRef.value as HTMLElement);
|
||||
let option: echarts.EChartsOption = {
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
type: "cross",
|
||||
crossStyle: {
|
||||
color: "#c4c4c4"
|
||||
}
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
left: 60,
|
||||
top: 120,
|
||||
width: "94%"
|
||||
},
|
||||
legend: {
|
||||
right: 0,
|
||||
top: 0,
|
||||
textStyle: {
|
||||
color: "#c4c4c4"
|
||||
},
|
||||
data: ["出勤总数(人)", "在职总数(人)", "出勤率(%)"]
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: "category",
|
||||
data: ["1月", "2月", "3月", "4月", "5月", "6月", "7月"],
|
||||
axisPointer: {
|
||||
type: "shadow"
|
||||
}
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
name: "单位(人)",
|
||||
nameTextStyle: {
|
||||
align: "right",
|
||||
color: "#c4c4c4"
|
||||
},
|
||||
min: 0,
|
||||
max: 250,
|
||||
interval: 50
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "出勤率(%)",
|
||||
nameTextStyle: {
|
||||
color: "#c4c4c4"
|
||||
},
|
||||
min: 0,
|
||||
max: 25,
|
||||
interval: 5
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "出勤总数(人)",
|
||||
type: "bar",
|
||||
barWidth: 18,
|
||||
itemStyle: {
|
||||
borderRadius: [11, 11, 11, 11]
|
||||
},
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + " ml";
|
||||
}
|
||||
},
|
||||
data: [2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3]
|
||||
},
|
||||
{
|
||||
name: "在职总数(人)",
|
||||
type: "bar",
|
||||
barWidth: 18,
|
||||
itemStyle: {
|
||||
borderRadius: [11, 11, 11, 11]
|
||||
},
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + " ml";
|
||||
}
|
||||
},
|
||||
data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3]
|
||||
},
|
||||
{
|
||||
name: "出勤率(%)",
|
||||
type: "line",
|
||||
smooth: true,
|
||||
yAxisIndex: 1,
|
||||
tooltip: {
|
||||
valueFormatter: function (value) {
|
||||
return value + " °C";
|
||||
}
|
||||
},
|
||||
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2]
|
||||
}
|
||||
]
|
||||
};
|
||||
useEcharts(myChart, option);
|
||||
});
|
||||
</script>
|
||||
<style scoped lang="scss"></style>
|
||||
<style scoped lang="scss">
|
||||
.table-box {
|
||||
.statistics-top {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.sta-item {
|
||||
width: 405px;
|
||||
min-width: 320px;
|
||||
height: 113px;
|
||||
background: #092945;
|
||||
border-radius: 8px 8px 8px 8px;
|
||||
opacity: 1;
|
||||
display: flex;
|
||||
.sta-num {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-top: 20px;
|
||||
margin-left: 42px;
|
||||
margin-right: auto;
|
||||
span:first-child {
|
||||
font-size: 16px;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
color: #ffffff;
|
||||
}
|
||||
span:last-child {
|
||||
font-size: 32px;
|
||||
font-family: OPPOSans-Heavy, OPPOSans;
|
||||
font-weight: 800;
|
||||
color: #c4c4c4;
|
||||
}
|
||||
}
|
||||
> img {
|
||||
width: 44px;
|
||||
height: 40px;
|
||||
margin-right: 22px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.statistics-search {
|
||||
margin-top: 20px;
|
||||
.topCard {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #092945;
|
||||
:deep(.el-card__body) {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
span {
|
||||
color: #c4c4c4;
|
||||
}
|
||||
:deep() {
|
||||
.el-input__wrapper {
|
||||
background-color: transparent;
|
||||
box-shadow: 0 0 0 1px #087ba4 inset;
|
||||
}
|
||||
.el-range-input,
|
||||
.el-input__inner {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.statistics-echart {
|
||||
margin-top: 20px;
|
||||
position: relative;
|
||||
.count-title {
|
||||
position: absolute;
|
||||
left: 30px;
|
||||
top: 26px;
|
||||
z-index: 1000;
|
||||
font-size: 20px;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #c4c4c4;
|
||||
border-left: 2px solid #008bff;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.card {
|
||||
width: 100%;
|
||||
height: 759px;
|
||||
padding: 0;
|
||||
}
|
||||
:deep() {
|
||||
.el-card {
|
||||
background: #092945;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background-color: #f6f6f6;
|
||||
// background-color: #f6f6f6;
|
||||
// padding: 0 20px;
|
||||
// overflow: hidden;
|
||||
.middle-video {
|
||||
@ -11,10 +11,11 @@
|
||||
flex: 1;
|
||||
.title-video {
|
||||
height: 56px;
|
||||
background-color: #fff;
|
||||
background-color: #092945;
|
||||
margin-bottom: 20px;
|
||||
padding: 0 36px;
|
||||
border-radius: 8px;
|
||||
color: #ffffff;
|
||||
img {
|
||||
cursor: pointer;
|
||||
}
|
||||
@ -38,7 +39,7 @@
|
||||
.right-form {
|
||||
width: 15vw;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
background: #092945;
|
||||
border-radius: 8px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@ -46,9 +47,20 @@
|
||||
.date-form {
|
||||
display: flex;
|
||||
padding: 15px 12px;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
border-bottom: 1px solid #09314e;
|
||||
.searchBtn {
|
||||
margin-left: 10px;
|
||||
background: #087ba4;
|
||||
border-radius: 4px;
|
||||
}
|
||||
:deep() {
|
||||
.el-input__wrapper {
|
||||
background-color: transparent;
|
||||
box-shadow: 0 0 0 1px #087ba4 inset;
|
||||
}
|
||||
.el-range-input {
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
}
|
||||
.right-header {
|
||||
@ -59,14 +71,16 @@
|
||||
// flex: 1;
|
||||
// height: 120px;
|
||||
padding: 12px;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
border-bottom: 1px solid #09314e;
|
||||
.title {
|
||||
color: #333;
|
||||
color: #ffffff;
|
||||
font-family: "siyuan_Medium";
|
||||
}
|
||||
.desc {
|
||||
margin-top: 4px;
|
||||
.question {
|
||||
color: #797979;
|
||||
color: #c4c4c4;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-size: 12px;
|
||||
}
|
||||
.date {
|
||||
@ -74,15 +88,58 @@
|
||||
align-items: flex-end;
|
||||
justify-content: space-between;
|
||||
margin-top: 37px;
|
||||
|
||||
span {
|
||||
color: rgba(102, 102, 102, 0.8);
|
||||
color: rgba(196, 196, 196, 0.65);
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-size: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep(.el-pagination) {
|
||||
.el-pagination__goto {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.el-pagination__classifier {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.el-input__wrapper {
|
||||
color: var(--el-color-primary);
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
box-shadow: 0 0 0 1px var(--el-color-primary, var(--el-color-primary)) inset;
|
||||
height: 26px;
|
||||
}
|
||||
.el-input__inner {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.el-pager li {
|
||||
border: none;
|
||||
box-shadow: 0 0 0 1px var(--el-color-primary, var(--el-color-primary)) inset;
|
||||
background-color: transparent;
|
||||
color: white;
|
||||
border: none;
|
||||
height: 26px;
|
||||
}
|
||||
.el-pager li:active {
|
||||
color: var(--el-color-primary);
|
||||
border: none;
|
||||
height: 26px;
|
||||
}
|
||||
.el-pagination__total {
|
||||
color: var(--el-color-primary);
|
||||
}
|
||||
.btn-prev,
|
||||
.btn-next,
|
||||
.btn-prev:disabled,
|
||||
.btn-next:disabled {
|
||||
color: var(--el-color-primary);
|
||||
background-color: transparent;
|
||||
border: 1px solid var(--el-color-primary);
|
||||
height: 26px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -97,13 +154,24 @@
|
||||
width: 290px;
|
||||
border-radius: 8px;
|
||||
height: 100%;
|
||||
background-color: #fff;
|
||||
background: #092945;
|
||||
overflow: auto;
|
||||
:deep(.el-tabs__nav-wrap) {
|
||||
// overflow: auto;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
:deep(.el-tabs__nav-wrap::after) {
|
||||
background-color: #09314e;
|
||||
}
|
||||
:deep() {
|
||||
.el-tabs__item {
|
||||
color: #c4c4c4;
|
||||
}
|
||||
.el-tabs__item.is-active {
|
||||
color: #0bc4f0;
|
||||
}
|
||||
}
|
||||
.treefilter {
|
||||
padding: 0 18px 18px 18px;
|
||||
// min-height: 100%;
|
||||
|
||||
@ -131,7 +131,9 @@
|
||||
<div class="date">
|
||||
<span>{{ item.createTime }}</span>
|
||||
|
||||
<el-button v-show="!item.showForm" @click="handleEditItem(item)" type="primary" size="small">查看</el-button>
|
||||
<el-button class="hzStyle" v-show="!item.showForm" @click="handleEditItem(item)" type="primary" size="small"
|
||||
>查看</el-button
|
||||
>
|
||||
<el-button v-show="item.showForm" @click="OnClose(item)" type="primary" size="small">收起</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user