renkang/xj-screen
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
zk
2023-12-11 13:25:13 +08:00
parent bc15167485
commit c9663bb3ba
7 changed files with 149 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env.development
+1 -1
View File
@@ -1,2 +1,2 @@
// 王昊地址
VITE_GLOB_API_URL=http://192.168.1.16
VITE_GLOB_API_URL=http://192.168.1.6
src/assets/less/index.less
+45
View File
@@ -57,6 +57,51 @@
background-color: rgba(0, 0, 0, 0.3);
}
.ant-select-dropdown {
background-color: #00152b !important;
border-right: 1px solid #1b7ef2;
border-left: 1px solid #1b7ef2;
border-bottom: 1px solid #1b7ef2;
}
.ant-select-item {
color: #1b7ef2 !important;
}
//框背景色
.ant-select:not(.ant-select-customize-input) .ant-select-selector {
color: #1b7ef2 !important;
background-color: transparent !important;
border: 1px solid #1b7ef2 !important;
}
.ant-select-item-option-selected {
color: #ffffff !important;
}
// 选中字体颜色
.ant-select-selection-item {
//color: #1b7ef2 !important;
color: #fff;
}
.ant-select-item-option-active {
background-color: transparent !important;
}
.ant-select-item-option-active:hover {
background-color: #002e64 !important;
}
// 箭头颜色
.ant-select-arrow {
color: #1b7ef2 !important;
}
.ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
background-color: #002e64 !important;
}
//直升机
.helicopter {
width: 60px;
src/components/chinaMap/chinaMap.vue
+1 -3
View File
@@ -396,7 +396,6 @@
flex: 1;
height: calc(100% + 22px);
margin: 10px 0;
//border: 1px solid red;
}
.map-legend {
@@ -404,7 +403,6 @@
bottom: 15px;
left: 10px;
width: 200px;
//border: 1px solid red;
display: flex;
flex-wrap: wrap;
@@ -458,4 +456,4 @@
}
}
}
</style>
</style>
src/components/secondaryScreen/commonApi.ts
+7
View File
@@ -0,0 +1,7 @@
import { get } from '/@/api/request.ts';
export enum Api {
depart = 'sys/sysDepart/allSecondaryDeparts',
}
export const allSecondaryDeparts = () => get(Api.depart);
src/components/secondaryScreen/secondMap/secondMap.vue
+13 -7
View File
@@ -2,14 +2,11 @@
<div class="center-map">
<div class="china-map-box">
<div class="form-container">
<!-- <a-select placeholder="选择单位" v-model:value="selectValue" class="type-select" :options="selectOptions">-->
<!-- <a-select-option value="全部数据">全部数据</a-select-option>-->
<!-- </a-select>-->
<!-- <a-select v-model:value="selectValue" class="type-select" :options="selectOptions">-->
<!-- <a-select-option value="全部数据">全部数据</a-select-option>-->
<!-- </a-select>-->
<slot name="rightForm"></slot>
</div>
<div style="flex: 1; overflow: hidden; margin: 0 0 10px">
<div id="mapContainer" class="mapContainer"></div>
</div>
<div class="mapContainer" id="mapContainer"></div>
<div v-show="false" id="container"></div>
<div v-show="false" id="panel"></div>
</div>
@@ -45,8 +42,17 @@
position: relative;
}
.form-container {
position: absolute;
//right: 9px;
right: 0;
top: 17px;
z-index: 1;
}
.mapContainer {
flex: 1;
height: calc(100% + 22px);
margin: 10px 0;
}
}
src/components/secondaryScreen/secondMap/secondMapHooks.ts
+55
View File
@@ -13,3 +13,58 @@
// },
// ];
import {onMounted, ref} from "vue";
import {allSecondaryDeparts} from "/@/components/secondaryScreen/commonApi";
export function useDepart({selectOption = [],}) {
const orgCode = ref();
const option = ref([]);
const fieldNames = {label: 'departName', value: 'orgCode',}
onMounted(() => {
if (selectOption && Array.isArray(selectOption) && selectOption.length > 0) {
setOption(selectOption);
} else {
getOptionData();
}
});
function setOption(option) {
option.value = selectOption || option;
}
async function getOptionData() {
const {result, code} = await allSecondaryDeparts();
if (code == 200) {
option.value = result;
}
}
return {
orgCode,
option,
setOption,
fieldNames
};
}
export function useTimeType(t) {
const type = ref(t || '')
const timeRangeOption = [
{
label: '近一周',
value: 'week'
},
{
label: '近一月',
value: 'month'
},
{
label: '近一年',
value: 'year'
}
]
return {
type,
timeRangeOption
}
}
src/views/indexSon.vue
+27 -22
View File
@@ -19,7 +19,18 @@
</template>
</div>
<div class="body-d-middle">
<SecondMap />
<SecondMap>
<template #rightForm>
<a-select
placeholder="选择单位"
v-model:value="orgCode"
class="type-select"
:options="option"
:fieldNames="fieldNames"
></a-select>
<a-select placeholder="选择时间范围" v-model:value="type" class="type-select" :options="timeRangeOption"></a-select>
</template>
</SecondMap>
</div>
<div class="body-d-right">
<one-r />
@@ -36,12 +47,12 @@
import OneR from '/@/components/secondaryScreen/screen-right/oneR.vue';
import TwoR from '/@/components/secondaryScreen/screen-right/twoR.vue';
import ThreeR from '/@/components/secondaryScreen/screen-right/threeR.vue';
import SecondMap from '/@/components/secondaryScreen/secondMap/secondMap.vue';
import * as dayjs from 'dayjs';
import SecondMap from '/@/components/secondaryScreen/secondMap/secondMap';
import router from '/@/router';
import ItemD from '/@/components/item-d/item-d.vue';
import { useDepart, useTimeType } from '/@/components/secondaryScreen/secondMap/secondMapHooks.ts';
import { useTopTime } from '/@/utils/utils.ts';
const dayTimeO = ref();
const dayTimeT = ref();
const dataList = ref([
{
@@ -94,31 +105,19 @@
}, 1000);
}
function getTime() {
dayTimeO.value = dayjs().format('YYYY年MM月DD日 HH时mm分ss秒');
dayTimeT.value =
dayjs().diff(dayjs('2018-10-01'), 'day') +
'天' +
getZero(dayjs().diff(dayjs(dayjs().format('YYYY-MM-DD') + ' 00:00:00'), 'hours')) +
'时' +
getZero(dayjs().diff(dayjs(dayjs().format('YYYY-MM-DD HH') + ':00:00'), 'minutes')) +
'分' +
getZero(dayjs().diff(dayjs(dayjs().format('YYYY-MM-DD HH:mm') + ':00'), 'seconds')) +
'秒';
}
init();
function getZero(num: any) {
if (num < 10) {
return '0' + num;
}
return num;
function getTime() {
const { timeRight } = useTopTime();
dayTimeT.value = timeRight;
}
function clickBack() {
router.go(-1);
}
init();
const { orgCode, option, fieldNames } = useDepart({});
const { type, timeRangeOption } = useTimeType('week');
</script>
<style lang="less" scoped>
.outer {
@@ -219,6 +218,12 @@
display: flex;
flex-direction: column;
}
.type-select {
width: 120px;
color: #008cff;
margin-right: 10px;
}
}
.bottom-d {