police-mailbox
/
mailbox-lan-vue
7
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

大屏样式调整以及轮播地图调整

master
21819 2 years ago
parent
99e0e02dc7
commit
9694b645b1
7 changed files with 394 additions and 379 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 464
      src/views/datascreen/countyData.vue
  2. 242
      src/views/datascreen/index.vue
  3. 11
      src/views/work/Dissatisfied.vue
  4. 11
      src/views/work/Done.vue
  5. 11
      src/views/work/Fav.vue
  6. 23
      src/views/work/Query.vue
  7. 11
      src/views/work/Todo.vue

464
src/views/datascreen/countyData.vue
Unescape View File

@ -11,13 +11,14 @@
<div class="name-title">
今日值班
</div>
<div >
<el-tabs v-model="dutyActiveName" class="echart-tabs" type="card" @tab-click="dutyResetTimer">
<div>
<el-tabs v-model="dutyActiveName" class="echart-tabs" type="card" @tab-click="dutyResetTimer">
<el-tab-pane label="市局" name="dutySj">
<div class="boxRightMailCon">
<ul class="dutyUl">
<li v-for="item in dutySjList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile }}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
@ -27,7 +28,8 @@
<el-tab-pane label="本单位" name="dutyFj">
<ul class="dutyUl">
<li v-for="item in dutyList.dutyFjList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile }}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
@ -36,7 +38,8 @@
<el-tab-pane label="大队" name="dutyZd">
<ul class="dutyUl">
<li v-for="item in dutyList.dutyDdList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile }}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
@ -44,7 +47,8 @@
<el-tab-pane label="派出所" name="dutyBw">
<ul class="dutyUl">
<li v-for="item in dutyList.dutyPcsList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile }}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
@ -58,14 +62,14 @@
派出所三率排名
</div>
<div id="graduate">
<el-tabs v-model="rateActiveName" class="echart-tabs" @tab-click="rateResetTimer" type="card" >
<el-tabs v-model="rateActiveName" class="echart-tabs" @tab-click="rateResetTimer" type="card">
<el-tab-pane label="办结率" name="completionRate">
<div class="ratesbox rates">
<ul class="h100">
<li v-for="item in completeList" :key="item.id">
<span>{{ item.name }}</span>
<div class="ratenav">
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
</div>
<div class="ratesum">
<p>{{ item.rate }}<span class="ratespan"><i>{{ item.completed }} / </i>{{ item.sum }}</span></p>
@ -81,7 +85,7 @@
<li v-for="item in rateMap.resolvedList" :key="item.id">
<span>{{ item.name }}</span>
<div class="ratenav">
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
</div>
<div class="ratesum">
<p>{{ item.rate }}<span class="ratespan"><i>{{ item.resolved }} / </i>{{ item.sum }}</span></p>
@ -97,7 +101,7 @@
<li v-for="item in rateMap.satisfiedList" :key="item.id">
<span>{{ item.name }}</span>
<div class="ratenav">
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
</div>
<div class="ratesum">
<p>{{ item.rate }}<span class="ratespan"><i>{{ item.satisfied }} / </i>{{ item.sum }}</span></p>
@ -118,12 +122,42 @@
<div class="border-console ">
<div class="console-div">
<ul class="clearfix">
<li><h2 class="bulebg">{{ consoleMap.todaySum }}</h2><span>今日来信</span></li>
<li><h2 class="yellowbg">{{ consoleMap.allSum }}</h2><span>来信总数</span></li>
<li><h2 class="bulebg">{{ consoleMap.completed }}</h2><span>办结总数</span></li>
<li><h2 class="yellowbg">{{ consoleMap.completedrate }}</h2><span>办结率</span></li>
<li><h2 class="bulebg">{{ consoleMap.satisfiedrate }}</h2><span>满意率</span></li>
<li><h2 class="bulebg">{{ consoleMap.resolvedrate }}</h2><span>解决率</span></li>
<li>
<h2 class="bulebg">{{ consoleMap.todaySum }}</h2><span>今日来信</span>
</li>
<li>
<h2 class="yellowbg">{{ consoleMap.allSum }}</h2><span>来信总数</span>
</li>
<li>
<h2 class="bulebg">{{ consoleMap.completed }}</h2><span>办结总数</span>
</li>
<li>
<el-popover placement="right-start" title="办结率计算方式" :width="200" trigger="hover" show-after="700"
:content="completedrateContent" popper-class="custom-popover-style">
<template #reference>
<h2 class="yellowbg" v-show="consoleMap.completedrate">{{ consoleMap.completedrate }}</h2>
</template>
</el-popover>
<span>办结率</span>
</li>
<li>
<el-popover placement="right-start" title="满意率计算方式" :width="200" trigger="hover" show-after="700"
:content="satisfiedrateContent" popper-class="custom-popover-style">
<template #reference>
<h2 class="bulebg" v-show="consoleMap.satisfiedrate">{{ consoleMap.satisfiedrate }}</h2>
</template>
</el-popover>
<span>满意率</span>
</li>
<li>
<el-popover placement="right-start" title="解决率计算方式" :width="200" trigger="hover" show-after="700"
:content="resolvedrateContent" popper-class="custom-popover-style">
<template #reference>
<h2 class="yellowbg" v-show="consoleMap.resolvedrate">{{ consoleMap.resolvedrate }}</h2>
</template>
</el-popover>
<span>解决率</span>
</li>
</ul>
</div>
@ -136,74 +170,37 @@
来信趋势
</div>
<div v-if="seenDay" class="trendOptions">
<el-select
v-model="trendDayValue"
class="m-2"
:placeholder="selectTrend"
size="small"
style="width: 100px;z-index: 3000;"
@change="getMailTrend"
popper-class="blueBack"
>
<el-option
v-for="item in trendDayOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<el-select v-model="trendDayValue" class="m-2" :placeholder="selectTrend" size="small"
style="width: 100px;z-index: 3000;" @change="getMailTrend" popper-class="blueBack">
<el-option v-for="item in trendDayOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<div v-if="seenWeek" class="trendOptions">
<el-select
v-model="trendWeekValue"
class="m-2"
:placeholder="selectTrend"
size="small"
style="width: 100px;z-index: 3000"
@change="getMailTrend"
popper-class="blueBack"
>
<el-option
v-for="item in trendWeekOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
<el-select v-model="trendWeekValue" class="m-2" :placeholder="selectTrend" size="small"
style="width: 100px;z-index: 3000" @change="getMailTrend" popper-class="blueBack">
<el-option v-for="item in trendWeekOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
</div>
<div v-if="seenMonth" class="trendOptions">
<el-select
v-model="trendMonthValue"
class="m-2"
:placeholder="selectTrend"
size="small"
style="width: 100px;z-index: 3000"
@change="getMailTrend"
popper-class="blueBack"
>
<el-option
v-for="item in trendMonthOptions"
:key="item.value"
:label="item.label"
:value="item.value"
style="height:auto;max-height:300px;padding:0;"
/>
<el-select v-model="trendMonthValue" class="m-2" :placeholder="selectTrend" size="small"
style="width: 100px;z-index: 3000" @change="getMailTrend" popper-class="blueBack">
<el-option v-for="item in trendMonthOptions" :key="item.value" :label="item.label" :value="item.value"
style="height:auto;max-height:300px;padding:0;" />
</el-select>
</div>
<div ref="tabsContainer">
<el-tabs v-model="trendActiveName" class="trend-tabs" type="card" @tab-click="trendResetTimer" >
<el-tabs v-model="trendActiveName" class="trend-tabs" type="card" @tab-click="trendResetTimer">
<el-tab-pane label="按天计算" name="dayTrend">
<div ref="day_echart" id="dayEchart" :style="{ width: chartWidth + 'px' }"></div>
</el-tab-pane>
<el-tab-pane label="按周计算" name="weekTrend" >
<div ref="week_echart" id="weekEchart" :style="{ width: chartWidth + 'px' }" ></div>
<el-tab-pane label="按周计算" name="weekTrend">
<div ref="week_echart" id="weekEchart" :style="{ width: chartWidth + 'px' }"></div>
</el-tab-pane>
<el-tab-pane label="按月计算" name="monthTrend" >
<div ref="month_echart" id="monthEchart" :style="{ width: chartWidth + 'px' }" ></div>
<el-tab-pane label="按月计算" name="monthTrend">
<div ref="month_echart" id="monthEchart" :style="{ width: chartWidth + 'px' }"></div>
</el-tab-pane>
</el-tabs>
</div>
@ -212,13 +209,14 @@
</div>
<div class="main-right">
<div class="box-container">
<div class="name-title" >
<div class="name-title">
信件动态
</div>
<div class="boxLeftMailCon">
<ul class="mailUl">
<li v-for="item in peopleMaillist" :key="item.id" @click="queryDetails(item)">
<p>{{ item.contactName }} ：{{ item.contactPhone }}<span class="mailULspan">{{ item.mailState }}</span></p>
<li v-for="item in peopleMaillist" :key="item.id" @click="queryDetails(item)">
<p>{{ item.contactName }} ：{{ item.contactPhone }}<span class="mailULspan">{{ item.mailState }}</span>
</p>
<p>{{ formatDate(item.createTime) }}</p>
</li>
</ul>
@ -233,13 +231,13 @@
<div class=" boxnav paim">
<ul class="h100">
<li v-for="item in mailTypeRankList" :key="item.id">
<span>{{item.rownumber}}</span>
<span>{{ item.rownumber }}</span>
<div class="pmnav">
<p>{{ item.category }}</p>
<div class="pmbar"><span :style="{ width: item.countrate }"></span><i></i></div>
</div>
<div class="pmsum">
<p>{{item.sumcount}}</p>
<p>{{ item.sumcount }}</p>
</div>
</li>
@ -250,55 +248,78 @@
</div>
</div>
<details-popup
v-if="showDetails"
ref="detailsRef"
@success="closeDetails"
@close="closeDetails"
/>
<details-popup v-if="showDetails" ref="detailsRef" @success="closeDetails" @close="closeDetails" />
</div>
</div>
</template>
<style >
<style>
@import 'assets/css/index.css';
body{
body {
background-color: #030b39;
}
.body{
background-image: url('@/assets/bg.png'); /* 背景图片的路径 */
background-size: cover; /* 背景图片大小适应容器 */
.body {
background-image: url('@/assets/bg.png');
/* 背景图片的路径 */
background-size: cover;
/* 背景图片大小适应容器 */
}
.ratebar i{ line-height: 2rem; font-style: normal; padding-left: 1rem; color: #49bcf7; font-size: 1.6rem; }
.ratenav{
.ratebar i {
line-height: 2rem;
font-style: normal;
padding-left: 1rem;
color: #49bcf7;
font-size: 1.6rem;
}
.ratenav {
/* width:calc(100% - 5rem)*/
width: 200px;
}
.ratenav p{color: #fff; font-size: 1.5rem; padding-bottom: 0.5rem; white-space: nowrap;
overflow: hidden; text-overflow: ellipsis;}
.rates li>span{width: 120px; height: 3rem;font-family: PingFang-SC-Regular;
.ratenav p {
color: #fff;
font-size: 1.5rem;
padding-bottom: 0.5rem;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.rates li>span {
width: 120px;
height: 3rem;
font-family: PingFang-SC-Regular;
font-size: 16px;
color: #FFFFFF;
text-align: right;
font-weight: 400; line-height: 3rem; padding-right: 5px; border-radius: .05rem; margin-right: .1rem; }
.ratesum{
font-weight: 400;
line-height: 3rem;
padding-right: 5px;
border-radius: .05rem;
margin-right: .1rem;
}
.ratesum {
font-size: 1.6rem;
}
</style>
<script lang="ts" setup>
import { ref,onMounted,watch ,onBeforeUpdate ,onBeforeMount,onUnmounted} from 'vue'
import { ref, onMounted, watch, onBeforeUpdate, onBeforeMount, onUnmounted } from 'vue'
import type { TabsPaneContext } from 'element-plus'
import * as echarts from 'echarts';
import chinaJSON from "./changsha.json";
import yuhuaJSON from "@/static/430111.json";
import { peopleMail, dutyDay ,threeRate,consoleData,mailTypeRank,mailTrend,mapCountyData,currentCountyMapJSON} from '@/api/datascreen'
import { peopleMail, dutyDay, threeRate, consoleData, mailTypeRank, mailTrend, mapCountyData, currentCountyMapJSON } from '@/api/datascreen'
import { useRouter } from "vue-router";
import {menuLists} from "~/api/perms/menu.ts";
import { menuLists } from "~/api/perms/menu.ts";
import DetailsPopup from './details.vue'
const detailsRef = shallowRef<InstanceType<typeof DetailsPopup>>()
const showDetails = ref(false)
@ -309,17 +330,17 @@ const trendActiveName = ref('dayTrend')
const dutyActiveName = ref('dutySj')
let currentParams= reactive([]) as any[];
let currentMapJSON= reactive([]) as any[];
let peopleMaillist= ref([]);
let dutyList = ref([]);
let typeRankList= ref([]);
let rateMap = ref([]);
let mailTrendMap = ref([]);
let consoleMap = ref([]);
let mailTypeRankList= reactive([]) as any[];
let completeList = reactive([]) as any[];
let dutySjList= reactive([]) as any[];
let currentParams = reactive([]) as any[];
let currentMapJSON = reactive([]) as any[];
let peopleMaillist = ref([]);
let dutyList = ref([]);
let typeRankList = ref([]);
let rateMap = ref([]);
let mailTrendMap = ref([]);
let consoleMap = ref([]);
let mailTypeRankList = reactive([]) as any[];
let completeList = reactive([]) as any[];
let dutySjList = reactive([]) as any[];
const intervalTimeRate = 3500; // 自动切换的间隔时间，单位为毫秒
const intervalTimeTrend = 3000; // 自动切换的间隔时间，单位为毫秒
@ -328,22 +349,22 @@ let intervalIdRate: NodeJS.Timeout | null = null;
let intervalIdTrend: NodeJS.Timeout | null = null;
let intervalIdDuty: NodeJS.Timeout | null = null;
let carouselTime : NodeJS.Timeout | null = null;
let carouselTime: NodeJS.Timeout | null = null;
let dayXList= reactive([]) as any[];
let dayYList= reactive([]) as any[];
let weekXList= reactive([]) as any[];
let weekYList= reactive([]) as any[];
let monthXList= reactive([]) as any[];
let monthYList= reactive([]) as any[];
let dayXList = reactive([]) as any[];
let dayYList = reactive([]) as any[];
let weekXList = reactive([]) as any[];
let weekYList = reactive([]) as any[];
let monthXList = reactive([]) as any[];
let monthYList = reactive([]) as any[];
let map = ref('map');
let mapDataList= reactive([]) as any[];
let dataIndex=0
let mapDataList = reactive([]) as any[];
let dataIndex = 0
let currentIndex = 0;
let chartWidth=900;
let chartWidth = 900;
const tabsContainer = ref(null);
let day_echart = ref(null);
@ -353,11 +374,11 @@ let week_echart = ref(null);
let trendDayValue = ref('15')
let trendWeekValue = ref('7')
let trendMonthValue = ref('2024')
const selectTrend= "请选择"
let seenDay=true
let seenWeek=false
let seenMonth=false
let mapShow=true
const selectTrend = "请选择"
let seenDay = true
let seenWeek = false
let seenMonth = false
let mapShow = true
let trendDayOptions = [
{
value: '15',
@ -381,14 +402,14 @@ let trendWeekOptions = [
}
]
let trendMonthOptions =reactive([]) as any[];
let trendMonthOptions = reactive([]) as any[];
const selectYear = (year) =>{
var myDate= new Date();
var startYear=myDate.getFullYear()-year;//起始年份
var endYear=myDate.getFullYear();//结束年份
for (var i=startYear;i<=endYear;i++) {
var obj = {"value":i,"label":i};
const selectYear = (year) => {
var myDate = new Date();
var startYear = myDate.getFullYear() - year;//起始年份
var endYear = myDate.getFullYear();//结束年份
for (var i = startYear; i <= endYear; i++) {
var obj = { "value": i, "label": i };
trendMonthOptions.push(obj);
}
}
@ -397,6 +418,9 @@ const selectYear = (year) =>{
const getConsoleDataMap = async () => {
try {
consoleMap = await consoleData(currentParams)
completedrateContent.value = '办结率=解决数/已办结数\n' + consoleMap.value.completedrate + '=' + consoleMap.value.completed + '/' + consoleMap.value.completedsum
satisfiedrateContent.value = '满意率=满意数/已办结数\n' + consoleMap.value.satisfiedrate + '=' + consoleMap.value.satisfied + '/' + consoleMap.value.satisfiedsum
resolvedrateContent.value = '解决率=解决数/来信总数\n' + consoleMap.value.resolvedrate + '=' + consoleMap.value.resolved + '/' + consoleMap.value.resolvedsum
} catch (error) {
}
@ -440,7 +464,7 @@ const getDutyDay = async () => {
} catch (error) {
}
}
const getThreeRate= async () => {
const getThreeRate = async () => {
try {
rateMap = await threeRate(currentParams)
rateMap.completeList.forEach((element: any) => {
@ -450,7 +474,7 @@ const getThreeRate= async () => {
}
}
const getMailTrend= async () => {
const getMailTrend = async () => {
try {
const params = reactive({
day: trendDayValue.value,
@ -460,14 +484,14 @@ const getMailTrend= async () => {
})
mailTrendMap = await mailTrend(params)
dayXList=mailTrendMap.dayXList
dayYList=mailTrendMap.dayYList;
dayXList = mailTrendMap.dayXList
dayYList = mailTrendMap.dayYList;
dayEcharts()
weekXList=mailTrendMap.weekXList;
weekYList= mailTrendMap.weekYList;
weekXList = mailTrendMap.weekXList;
weekYList = mailTrendMap.weekYList;
weekEcharts()
monthXList= mailTrendMap.monthXList;
monthYList=mailTrendMap.monthYList;
monthXList = mailTrendMap.monthXList;
monthYList = mailTrendMap.monthYList;
monthEcharts()
} catch (error) {
}
@ -490,7 +514,7 @@ onMounted(() => {
// let r = window.location.href.substr(1).match(reg); //获取url中"?"符后的字符串并正则匹配
// let context = '';
// if (r) context = r[2];
currentParams=router.currentRoute.value.query
currentParams = router.currentRoute.value.query
selectYear(10)
getCurrentMapJSON()
getThreeRate();
@ -505,7 +529,7 @@ onMounted(() => {
startDutyAutoSwitch();
dayEcharts()
const width = tabsContainer.value.offsetWidth - 40;
chartWidth= width;
chartWidth = width;
});
@ -521,7 +545,7 @@ onUnmounted(() => {
});
const formatDate=(value)=>{
const formatDate = (value) => {
const date = new Date(value);
return date.toLocaleString();
}
@ -547,21 +571,21 @@ const startTrendAutoSwitch = () => {
intervalIdTrend = setInterval(() => {
if (trendActiveName.value === 'dayTrend') {
trendActiveName.value = 'weekTrend';
seenDay=false
seenWeek=true
seenMonth=false
seenDay = false
seenWeek = true
seenMonth = false
weekEcharts()
} else if (trendActiveName.value === 'weekTrend') {
trendActiveName.value = 'monthTrend';
seenDay=false
seenWeek=false
seenMonth=true
seenDay = false
seenWeek = false
seenMonth = true
monthEcharts()
} else {
trendActiveName.value = 'dayTrend';
seenDay=true
seenWeek=false
seenMonth=false
seenDay = true
seenWeek = false
seenMonth = false
dayEcharts()
}
}, intervalTimeTrend);
@ -609,28 +633,28 @@ const clearDutyTimer = () => {
}
};
const rateResetTimer = () => {
const width = tabsContainer.value.offsetWidth ;
chartWidth= width;
const width = tabsContainer.value.offsetWidth;
chartWidth = width;
clearRateTimer();
startRateAutoSwitch();
};
const trendResetTimer = (pane: TabsPaneContext, ev: Event) => {
const width = tabsContainer.value.offsetWidth ;
chartWidth= width;
const width = tabsContainer.value.offsetWidth;
chartWidth = width;
if (pane.paneName === 'dayTrend') {
seenDay=true
seenWeek=false
seenMonth=false
seenDay = true
seenWeek = false
seenMonth = false
} else if (pane.paneName === 'weekTrend') {
seenDay=false
seenWeek=true
seenMonth=false
seenDay = false
seenWeek = true
seenMonth = false
} else {
seenDay=false
seenWeek=false
seenMonth=true
seenDay = false
seenWeek = false
seenMonth = true
}
dayEcharts()
monthEcharts()
@ -640,8 +664,8 @@ const trendResetTimer = (pane: TabsPaneContext, ev: Event) => {
};
const dutyResetTimer = () => {
const width = tabsContainer.value.offsetWidth ;
chartWidth= width;
const width = tabsContainer.value.offsetWidth;
chartWidth = width;
clearDutyTimer();
startDutyAutoSwitch();
};
@ -649,9 +673,9 @@ const dutyResetTimer = () => {
const changsMap = () =>{
const changsMap = () => {
echarts.registerMap("map", currentMapJSON.geometry as any);
let myMap = echarts.init(map.value);
let myMap = echarts.init(map.value);
//设置配置项
myMap.setOption({
geo: {
@ -662,22 +686,22 @@ const changsMap = () =>{
show: mapShow,
trigger: 'item',
position: 'right',
formatter: function(params){
formatter: function (params) {
if (typeof params.data === 'undefined') {
}else{
var tt ='<div class="tooltip">'+
'<div class="tooltip-title" > '+params.name+'</div>'+
'<div class="tooltip-content" >'+
'<ul class="tooltip-ul">'+
'<li>今日来信 <span>'+params.data.todaysum+'</span></li>'+
'<li>来信总数 <span>'+params.data.allsum+'</span></li>'+
'<li>办结总数 <span>'+params.data.completed+'</span></li>'+
'<li>办结率 <span>'+params.data.completedrate+'</span></li>'+
'<li>解决率 <span>'+params.data.resolvedrate+'</span></li>'+
'<li>满意率 <span>'+params.data.satisfiedrate+'</span></li>'+
' </ul></div></div>'
} else {
var tt = '<div class="tooltip">' +
'<div class="tooltip-title" > ' + params.name + '</div>' +
'<div class="tooltip-content" >' +
'<ul class="tooltip-ul">' +
'<li>今日来信 <span>' + params.data.todaysum + '</span></li>' +
'<li>来信总数 <span>' + params.data.allsum + '</span></li>' +
'<li>办结总数 <span>' + params.data.completed + '</span></li>' +
'<li>办结率 <span>' + params.data.completedrate + '</span></li>' +
'<li>解决率 <span>' + params.data.resolvedrate + '</span></li>' +
'<li>满意率 <span>' + params.data.satisfiedrate + '</span></li>' +
' </ul></div></div>'
return tt;
}
},
@ -708,7 +732,7 @@ const changsMap = () =>{
},
calculable: true,
inRange: {
color: ['#D34343','#F6A149', '#4987F6']
color: ['#D34343', '#F6A149', '#4987F6']
}
},
series: [
@ -823,7 +847,7 @@ const switchRegion = () => {
}
};
const dayEcharts=() => {
const dayEcharts = () => {
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(day_echart.value);
@ -837,12 +861,12 @@ const dayEcharts=() => {
}
},
legend: {
top:'0%',
top: '0%',
right: '0%',
data:['信件数'],
data: ['信件数'],
textStyle: {
color: 'rgba(255,255,255,.5)',
fontSize:'12',
fontSize: '12',
}
},
grid: {
@ -856,10 +880,10 @@ const dayEcharts=() => {
xAxis: [{
type: 'category',
boundaryGap: false,
axisLabel: {
axisLabel: {
textStyle: {
color: "rgba(255,255,255,.6)",
fontSize:12,
fontSize: 12,
},
},
axisLine: {
@ -873,8 +897,8 @@ const dayEcharts=() => {
}, {
axisPointer: {show: false},
axisLine: { show: false},
axisPointer: { show: false },
axisLine: { show: false },
position: 'bottom',
offset: 20,
@ -884,16 +908,16 @@ const dayEcharts=() => {
yAxis: [{
type: 'value',
axisTick: {show: false},
axisTick: { show: false },
axisLine: {
lineStyle: {
color: 'rgba(255,255,255,.1)'
}
},
axisLabel: {
axisLabel: {
textStyle: {
color: "rgba(255,255,255,.6)",
fontSize:12,
fontSize: 12,
},
},
@ -947,12 +971,12 @@ const dayEcharts=() => {
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option);
window.addEventListener("resize",function(){
window.addEventListener("resize", function () {
myChart.resize(chartWidth);
});
}
const monthEcharts=() => {
const monthEcharts = () => {
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(month_echart.value);
let option1 = {
@ -965,12 +989,12 @@ const monthEcharts=() => {
}
},
legend: {
top:'0%',
top: '0%',
right: '0%',
data:['信件数'],
data: ['信件数'],
textStyle: {
color: 'rgba(255,255,255,.5)',
fontSize:'12',
fontSize: '12',
}
},
grid: {
@ -984,10 +1008,10 @@ const monthEcharts=() => {
xAxis: [{
type: 'category',
boundaryGap: false,
axisLabel: {
axisLabel: {
textStyle: {
color: "rgba(255,255,255,.6)",
fontSize:12,
fontSize: 12,
},
},
axisLine: {
@ -1001,8 +1025,8 @@ const monthEcharts=() => {
}, {
axisPointer: {show: false},
axisLine: { show: false},
axisPointer: { show: false },
axisLine: { show: false },
position: 'bottom',
offset: 20,
@ -1012,16 +1036,16 @@ const monthEcharts=() => {
yAxis: [{
type: 'value',
axisTick: {show: false},
axisTick: { show: false },
axisLine: {
lineStyle: {
color: 'rgba(255,255,255,.1)'
}
},
axisLabel: {
axisLabel: {
textStyle: {
color: "rgba(255,255,255,.6)",
fontSize:12,
fontSize: 12,
},
},
@ -1075,13 +1099,13 @@ const monthEcharts=() => {
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option1);
window.addEventListener("resize",function(){
window.addEventListener("resize", function () {
myChart.resize(chartWidth);
});
}
const weekEcharts=() => {
const weekEcharts = () => {
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(week_echart.value);
let option1 = {
@ -1094,12 +1118,12 @@ const weekEcharts=() => {
}
},
legend: {
top:'0%',
top: '0%',
right: '0%',
data:['信件数'],
data: ['信件数'],
textStyle: {
color: 'rgba(255,255,255,.5)',
fontSize:'12',
fontSize: '12',
}
},
grid: {
@ -1113,10 +1137,10 @@ const weekEcharts=() => {
xAxis: [{
type: 'category',
boundaryGap: false,
axisLabel: {
axisLabel: {
textStyle: {
color: "rgba(255,255,255,.6)",
fontSize:12,
fontSize: 12,
},
},
axisLine: {
@ -1126,12 +1150,12 @@ const weekEcharts=() => {
},
data: weekXList
data: weekXList
}, {
axisPointer: {show: false},
axisLine: { show: false},
axisPointer: { show: false },
axisLine: { show: false },
position: 'bottom',
offset: 20,
@ -1141,16 +1165,16 @@ const weekEcharts=() => {
yAxis: [{
type: 'value',
axisTick: {show: false},
axisTick: { show: false },
axisLine: {
lineStyle: {
color: 'rgba(255,255,255,.1)'
}
},
axisLabel: {
axisLabel: {
textStyle: {
color: "rgba(255,255,255,.6)",
fontSize:12,
fontSize: 12,
},
},
@ -1204,12 +1228,12 @@ const weekEcharts=() => {
// 使用刚指定的配置项和数据显示图表。
myChart.setOption(option1);
window.addEventListener("resize",function(){
window.addEventListener("resize", function () {
myChart.resize(chartWidth);
});
}
const queryDetails = async (data: any) => {
mapShow=false
mapShow = false
changsMap()
showDetails.value = true
await nextTick()
@ -1217,13 +1241,11 @@ const queryDetails = async (data: any) => {
detailsRef.value?.getDetail(data)
}
const closeDetails=()=>{
mapShow=true
const closeDetails = () => {
mapShow = true
changsMap()
showDetails.value = false
}
</script>
<style lang="less">
</style>
<style lang="less"></style>

242
src/views/datascreen/index.vue
Unescape View File

@ -14,47 +14,47 @@
<div>
<el-tabs v-model="dutyActiveName" class="echart-tabs" type="card" @tab-click="dutyResetTimer">
<el-scrollbar>
<el-tab-pane label="市局专班" name="dutySj">
<div class="boxRightMailCon">
<el-tab-pane label="市局专班" name="dutySj">
<div class="boxRightMailCon">
<ul class="dutyUl">
<li v-for="item in dutySjList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
</div>
</el-tab-pane>
<el-tab-pane label="分县市局" name="dutyFj">
<ul class="dutyUl">
<li v-for="item in dutySjList" :key="item.id">
<li v-for="item in dutyList.dutyFjList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
</div>
</el-tab-pane>
<el-tab-pane label="分县市局" name="dutyFj">
<ul class="dutyUl">
<li v-for="item in dutyList.dutyFjList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</el-tab-pane>
<el-tab-pane label="支队" name="dutyZd">
<ul class="dutyUl">
<li v-for="item in dutyList.dutyZdList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
</ul>
</el-tab-pane>
<el-tab-pane label="部委组警校" name="dutyBw">
<ul class="dutyUl">
<li v-for="item in dutyList.dutyBwList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</el-tab-pane>
<el-tab-pane label="支队" name="dutyZd">
<ul class="dutyUl">
<li v-for="item in dutyList.dutyZdList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
</el-tab-pane>
<el-tab-pane label="部委组警校" name="dutyBw">
<ul class="dutyUl">
<li v-for="item in dutyList.dutyBwList" :key="item.id">
<p><span class="dutyDept">{{ item.departName }}</span> <span class="dutyULspan">{{ item.mobile
}}</span> <span class="dutyULspan">{{ item.policeName }}</span></p>
</li>
</ul>
</el-tab-pane>
</el-scrollbar>
</ul>
</el-tab-pane>
</el-scrollbar>
</el-tabs>
</div>
@ -70,7 +70,7 @@
<ul class="h100">
<li v-for="item in completeList" :key="item.id">
<span>{{ item.name }}</span>
<div class="ratenav">
<div class="ratenav" width="80%">
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
</div>
<div class="ratesum">
@ -86,7 +86,7 @@
<ul class="h100">
<li v-for="item in rateMap.resolvedList" :key="item.id">
<span>{{ item.name }}</span>
<div class="ratenav">
<div class="ratenav" width="80%">
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
</div>
<div class="ratesum">
@ -102,7 +102,7 @@
<ul class="h100">
<li v-for="item in rateMap.satisfiedList" :key="item.id">
<span>{{ item.name }}</span>
<div class="ratenav">
<div class="ratenav" width="80%">
<div class="ratebar"><span :style="{ width: item.rate }"></span></div>
</div>
<div class="ratesum">
@ -296,10 +296,10 @@ let dutyList = ref([]);
let typeRankList = ref([]);
let rateMap = ref([]);
let mailTrendMap = ref([]);
let consoleMap = ref([]);
let mailTypeRankList = reactive([]) as any[];
let completeList = reactive([]) as any[];
let dutySjList = reactive([]) as any[];
const consoleMap = ref({});
const completedrateContent = ref('')
const satisfiedrateContent = ref('')
const resolvedrateContent = ref('')
@ -379,11 +379,11 @@ const selectYear = (year) => {
//console大屏数据
const getConsoleDataMap = async () => {
try {
consoleMap = await consoleData()
console.log(consoleMap)
completedrateContent.value = '办结率=办结数/来信总数\n' + consoleMap.completedrate + '=' + consoleMap.completed + '/' + consoleMap.completedsum
satisfiedrateContent.value = '满意率=满意数/来信总数\n' + consoleMap.satisfiedrate + '=' + consoleMap.satisfied + '/' + consoleMap.satisfiedsum
resolvedrateContent.value = '解决率=解决数/来信总数\n' + consoleMap.resolvedrate + '=' + consoleMap.resolved + '/' + consoleMap.resolvedsum
consoleMap.value = await consoleData()
console.log(consoleMap.value)
completedrateContent.value = '办结率=解决数/已办结数\n' + consoleMap.value.completedrate + '=' + consoleMap.value.completed + '/' + consoleMap.value.completedsum
satisfiedrateContent.value = '满意率=满意数/已办结数\n' + consoleMap.value.satisfiedrate + '=' + consoleMap.value.satisfied + '/' + consoleMap.value.satisfiedsum
resolvedrateContent.value = '解决率=解决数/来信总数\n' + consoleMap.value.resolvedrate + '=' + consoleMap.value.resolved + '/' + consoleMap.value.resolvedsum
} catch (error) {
}
}
@ -635,23 +635,26 @@ const changsMap = () => {
trigger: 'item',
position: 'right',
formatter: function (params) {
if (typeof params.data === 'undefined') {
} else {
var tt = '<div class="tooltip">' +
'<div class="tooltip-title" > ' + params.name + '</div>' +
'<div class="tooltip-content" >' +
'<ul class="tooltip-ul">' +
'<li>今日来信 <span>' + params.data.todaysum + '</span></li>' +
'<li>来信总数 <span>' + params.data.allsum + '</span></li>' +
'<li>办结总数 <span>' + params.data.completed + '</span></li>' +
'<li>办结率 <span>' + params.data.completedrate + '</span></li>' +
'<li>解决率 <span>' + params.data.resolvedrate + '</span></li>' +
'<li>满意率 <span>' + params.data.satisfiedrate + '</span></li>' +
' </ul></div></div>'
return tt;
}
const data = params.data || {
todaysum: 0,
allsum: 0,
completed: 0,
completedrate: '0%',
resolvedrate: '0%',
satisfiedrate: '0%'
};
var tt = '<div class="tooltip">' +
'<div class="tooltip-title" > ' + params.name + '</div>' +
'<div class="tooltip-content" >' +
'<ul class="tooltip-ul">' +
'<li>今日来信 <span>' + data.todaysum + '</span></li>' +
'<li>来信总数 <span>' + data.allsum + '</span></li>' +
'<li>办结总数 <span>' + data.completed + '</span></li>' +
'<li>办结率 <span>' + data.completedrate + '</span></li>' +
'<li>解决率 <span>' + data.resolvedrate + '</span></li>' +
'<li>满意率 <span>' + data.satisfiedrate + '</span></li>' +
' </ul></div></div>'
return tt;
},
backgroundColor: '#031577', //
borderColor: '#0A2F86',
@ -715,94 +718,79 @@ const changsMap = () => {
}
const intervalTime = 3000; // 定时器间隔时间设置为3000毫秒
const switchRegion = () => {
const chart = echarts.getInstanceByDom(map.value);
const chart = echarts.getInstanceByDom(map.value); // 获取echarts实例
if (!chart) {
console.error('ECharts实例未找到');
return;
}
const option = chart.getOption();
const mapSeriesIndex = option.series.findIndex((series) => series.type === 'map');
if (mapSeriesIndex >= 0) {
const mapData = option.series[mapSeriesIndex].data;
const regionCount = mapData.length;
const prevIndex = currentIndex;
currentIndex = (currentIndex + 1) % regionCount;
//mapData[prevIndex].selected = false; // 取消上一个区域的选中状态
// mapData[currentIndex].selected = true; // 设置当前区域为选中状态
var hourIndex = 0;
carouselTime = setInterval(() => {
//dispatchAction echarts的API：触发图表行为
chart.dispatchAction({
type: "downplay", //downplay 取消高亮指定的数据图形
seriesIndex: 0
});
chart.dispatchAction({
type: "highlight", //highLight 高亮指定的数据图形
seriesIndex: 0, //系列index
dataIndex: hourIndex //数据index
});
chart.dispatchAction({
type: "showTip", //showTip 显示提示框
seriesIndex: 0,
dataIndex: hourIndex
});
hourIndex++;
//当循环到数组当中的最后一条数据后，重新进行循环
if (hourIndex > mapData.length) {
hourIndex = 0;
}
}, 3000);
//鼠标移入组件时停止轮播
chart.on("mousemove", (e) => {
clearInterval(carouselTime); //清除循环
chart.dispatchAction({
type: "downplay",
seriesIndex: 0,
});
chart.dispatchAction({
type: "highlight",
seriesIndex: 0,
dataIndex: e.dataIndex
});
chart.dispatchAction({
type: "showTip",
seriesIndex: 0,
dataIndex: e.dataIndex
});
});
//鼠标移出组件时恢复轮播
chart.on("mouseout", () => {
if (!mapData || mapData.length === 0) {
console.warn('地图数据为空');
return; // 没有数据时直接返回
}
// 停止已有的轮播（如果有）
clearInterval(carouselTime);
// 设置定时器轮播逻辑
const startCarousel = () => {
carouselTime = setInterval(() => {
chart.dispatchAction({
type: "downplay",
seriesIndex: 0,
currentIndex = (currentIndex + 1) % mapData.length; // 更新当前索引
// 触发echarts的行为
chart.dispatchAction({
type: "downplay", // 取消高亮
seriesIndex: mapSeriesIndex
});
chart.dispatchAction({
type: "highlight", // 高亮显示当前index的数据
seriesIndex: mapSeriesIndex,
dataIndex: currentIndex
});
chart.dispatchAction({
type: "showTip", // 显示当前数据的tooltip
seriesIndex: mapSeriesIndex,
dataIndex: currentIndex
});
}, intervalTime);
};
// 鼠标移入组件时停止轮播
chart.off('mousemove'); // 先取消之前可能存在的事件绑定
chart.on("mousemove", (e) => {
clearInterval(carouselTime);
if (e.dataIndex !== undefined) {
chart.dispatchAction({
type: "highlight",
seriesIndex: 0,
dataIndex: hourIndex
seriesIndex: mapSeriesIndex,
dataIndex: e.dataIndex
});
chart.dispatchAction({
type: "showTip",
seriesIndex: 0,
dataIndex: hourIndex
seriesIndex: mapSeriesIndex,
dataIndex: e.dataIndex
});
hourIndex++;
if (hourIndex > mapData.length) {
hourIndex = 0;
}
}, 3000);
}
});
chart.setOption(option);
// 鼠标移出组件时恢复轮播
chart.off('mouseout'); // 先取消之前可能存在的事件绑定
chart.on("mouseout", () => {
startCarousel();
});
startCarousel(); // 开始轮播
}
};
const dayEcharts = () => {
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(day_echart.value);

11
src/views/work/Dissatisfied.vue
Unescape View File

@ -96,12 +96,7 @@
</el-table-column>
<el-table-column prop="contactName" label="姓名" align="center" width="80" />
<el-table-column prop="contactPhone" label="联系电话" width="120" align="center" />
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column prop="mailCategory" label="信件分类" width="120" align="center" />
<el-table-column prop="content" label="信件内容" show-overflow-tooltip align="center" />
<el-table-column label="信件状态" width="90" align="center">
@ -130,6 +125,12 @@
</el-text>
</template>
</el-table-column>
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" width="120" align="center">
<template #default="{ row }">

11
src/views/work/Done.vue
Unescape View File

@ -96,11 +96,7 @@
</el-table-column>
<el-table-column prop="contactName" label="姓名" align="center" width="80" />
<el-table-column prop="contactPhone" label="联系电话" width="120" align="center" />
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column prop="mailCategory" label="信件分类" align="center" width="120"/>
<el-table-column label="信件状态" width="90" align="center">
@ -135,6 +131,11 @@
</div>
</template>
</el-table-column>
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center">
<template #default="{ row }">
<el-button type="primary" link @click="handleMail(row)">详情</el-button>

11
src/views/work/Fav.vue
Unescape View File

@ -80,11 +80,7 @@
</el-table-column>
<el-table-column prop="contactName" label="姓名" align="center" width="80" />
<el-table-column prop="contactPhone" label="联系电话" width="120" align="center" />
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column prop="mailCategory" label="信件分类" width="120" align="center" />
<el-table-column prop="content" label="信件内容" align="center" show-overflow-tooltip />
<el-table-column label="信件状态" width="90" align="center">
@ -102,6 +98,11 @@
<el-tag type="danger" v-else>未签收</el-tag>
</template>
</el-table-column>
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center">
<template #default="{ row }">
<el-button type="primary" link @click="handleMail(row)">详情</el-button>

23
src/views/work/Query.vue
Unescape View File

@ -5,9 +5,9 @@
<el-row>
<el-col :span="6">
<el-form-item label="来信时间">
<el-date-picker v-model="query.mailTime" value-format="YYYY-MM-DD HH:mm:ss" type="datetimerange" format="YYYY-MM-DD HH:mm:ss"
range-separator="~" start-placeholder="开始日期" end-placeholder="结束日期"
@change="handleMailTimeQuery" />
<el-date-picker v-model="query.mailTime" value-format="YYYY-MM-DD HH:mm:ss"
type="datetimerange" format="YYYY-MM-DD HH:mm:ss" range-separator="~"
start-placeholder="开始日期" end-placeholder="结束日期" @change="handleMailTimeQuery" />
</el-form-item>
</el-col>
<el-col :span="6">
@ -97,12 +97,12 @@
</el-col>
<el-col :span="6">
<el-form-item label="内容查询">
<el-input v-model="query.queryByContent" placeholder="请输入相关信件内容" clearable />
<el-input v-model="query.queryByContent" placeholder="请输入相关信件内容" clearable />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="编号查询">
<el-input v-model="query.queryById" placeholder="请输入相关信件编号" clearable />
<el-input v-model="query.queryById" placeholder="请输入相关信件编号" clearable />
</el-form-item>
</el-col>
</el-row>
@ -135,14 +135,9 @@
</el-table-column>
<el-table-column prop="contactName" label="姓名" align="center" width="80" />
<el-table-column prop="contactPhone" label="联系电话" width="120" align="center" />
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column prop="mailCategory" label="信件分类" width="120" align="center" />
<el-table-column prop="content" label="信件内容" show-overflow-tooltip align="center" width="90" />
<el-table-column prop="content" label="信件内容" show-overflow-tooltip align="center" />
<el-table-column label="信件状态" width="90" align="center">
<template #default="{ row }">
@ -172,6 +167,12 @@
</div>
</template>
</el-table-column>
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column prop="mailLabels" label="信件标签" width="160" align="center" />
<el-table-column label="操作" width="120" fixed="right" align="center">

11
src/views/work/Todo.vue
Unescape View File

@ -101,11 +101,7 @@
</el-table-column>
<el-table-column prop="contactName" label="姓名" align="center" width="80" />
<el-table-column prop="contactPhone" label="联系电话" align="center" width="120" />
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column prop="mailCategory" label="信件分类" align="center" width="120" />
<el-table-column prop="content" align="center" label="信件内容" show-overflow-tooltip width="150" />
<el-table-column label="信件状态" width="90" align="center">
@ -139,6 +135,11 @@
</div>
</template>
</el-table-column>
<el-table-column label="信件等级" width="100" align="center">
<template #default="{ row }">
<mail-level :value="row.mailLevel" :list="dictData.mail_level" />
</template>
</el-table-column>
<el-table-column label="操作" fixed="right" align="center">
<template #default="{ row }">
<el-button type="primary" link @click="handleMail(row)">立即处理</el-button>

Write Preview
Loading…
Cancel
Save