This commit is contained in:
lcw
2025-08-31 22:42:03 +08:00
15 changed files with 418 additions and 574 deletions

View File

@ -0,0 +1,30 @@
// 正文
export const textStyle = (data) => {
return `<p style="text-indent: 2em;"><span style="font-size: 16px; font-family: 仿宋;">${data}</span></p>`
}
//一级标题
export const Firstlevelheading = (data) => {
return `<p style="text-indent: 2em;"><span style="font-size: 16px; font-family: 黑体;">${data}</span></p>`
}
//二级标题
export const Subheading = (data) => {
return `<p style="text-indent: 2em;"><span style="font-size: 16px; font-family: 仿宋;">${data}</span></p>`
}
export const BiheadlinegTitle = (data) => {
return `<p style="text-indent: 2em;"><span style="font-size: 16px; font-family: 楷体;"><strong>${data}</strong></span></p>`
}
// 大标题
export const BigTitle = (data) => {
return `<h4 style="text-align: center;"><span style="color: rgb(225, 60, 57); font-size: 32px; font-family: 标楷体;">${data}</span></h4>`
}
export const headTitle = (data) => {
return `<p style="text-align: left;"><span style="color: rgb(225, 60, 57); font-size: 16px; font-family: 标楷体;"> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;${data.orgName}编 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;第${data.serialNumber}号&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;${data.time}&nbsp; </span></p ><hr/>`
}
export const report = (data) => {
return `<p><br></p ><p style="text-indent: 2em;">报抄:西藏公安厅</p ><hr/><p> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;`
}
export const signature = () => {
return `<p> &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 承办人: &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; 核稿人 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;签发人:</p >`
}

View File

@ -7,36 +7,23 @@
</div>
</div>
<div class="listBox">
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
</div>
<!-- 表格 -->
<div class="tabBox">
<MyTable
:tableData="pageData.tableData"
:tableColumn="pageData.tableColumn"
:tableHeight="pageData.tableHeight"
:key="pageData.keyCount"
:tableConfiger="pageData.tableConfiger"
:controlsWidth="pageData.controlsWidth"
>
<template #zdrRyjb="{ row }">
<DictTag :value="row.zdrRyjb" :tag="false" :options="D_GS_ZDR_RYJB" />
<div ref="searchBox">
<Search :searchArr="searchConfiger" @submit="onSearch" :key="pageData.keyCount"></Search>
</div>
<!-- 表格 -->
<div class="tabBox">
<MyTable :tableData="pageData.tableData" :tableColumn="pageData.tableColumn" :tableHeight="pageData.tableHeight"
:key="pageData.keyCount" :tableConfiger="pageData.tableConfiger" :controlsWidth="pageData.controlsWidth">
<template #jqlbdm="{ row }">
<DictTag :tag="false" :value="row.jqlbdm" :options="dict.JQLB" />
</template>
<template #zdrYjdj="{ row }">
<DictTag :value="row.zdrYjdj" :tag="false" :options="D_GS_ZDR_YJDJ" />
</template>
</MyTable>
<Pages
@changeNo="changeNo"
@changeSize="changeSize"
:tableHeight="pageData.tableHeight"
:pageConfiger="{
</MyTable>
<Pages @changeNo="changeNo" @changeSize="changeSize" :tableHeight="pageData.tableHeight" :pageConfiger="{
...pageData.pageConfiger,
total: pageData.total
}"
></Pages>
</div>
}"></Pages>
</div>
</div>
</div>
@ -48,19 +35,28 @@ import Pages from "@/components/aboutTable/Pages.vue";
import Search from "@/components/aboutTable/Search.vue";
import { qcckPost } from "@/api/qcckApi.js";
import { ref, reactive, nextTick, getCurrentInstance } from 'vue';
import { useRouter,useRoute } from 'vue-router'
import { useRouter, useRoute } from 'vue-router'
const { proxy } = getCurrentInstance();
const { D_GS_ZDR_RYJB,D_GS_ZDR_YJDJ} = proxy.$dict("D_GS_ZDR_RYJB","D_GS_ZDR_YJDJ"); //获取字典数据
const showDialog = ref(false)
const searchBox = ref(); //搜索框
const searchConfiger = ref(
[
{ label: "姓名", prop: 'ryXm', placeholder: "请输入姓名", showType: "input"},
{ label: "身份证号", prop: 'rySfzh', placeholder: "请输入身份证号", showType: "input"},
]);
const emit=defineEmits(['getData'])
{ label: "研判名称", prop: 'ypmc', placeholder: "请输入研判名称", showType: "input" },
]);
const props=defineProps({
dict: {
type: Object,
default: ()=>{}
}
})
const emit = defineEmits(['getData'])
const ypPremsess = ref()
const onSearch = (val) => {
ypPremsess.value = val
getList()
}
const router = useRouter()
const route=useRoute()
const route = useRoute()
const pageData = reactive({
tableData: [], //表格数据
keyCount: 0,
@ -77,13 +73,14 @@ const pageData = reactive({
}, //分页
controlsWidth: 160, //操作栏宽度
tableColumn: [
{ label: "姓名", prop: "ryXm" },
{ label: "身份证号", prop: "rySfzh" },
{ label: "联系电话", prop: "ryLxdh" },
{ label: "重点人员级别", prop: "zdrRyjb",showSolt:true },
{ label: "预警等级", prop: "zdrYjdj",showSolt:true },
{ label: "关联民警", prop: "gkMjXm" },
{ label: "民警警号", prop: "gkMjJh" },
{ label: "研判名称", prop: "ypmc" },
{ label: "报警时间", prop: "bjsj" },
{ label: "报警地址", prop: "bjdz" },
{ label: "警情类型", prop: "jqlbdm",showSolt:true },
{ label: "报警内容", prop: "bjnr", showOverflowTooltip: true },
{ label: "报警电话", prop: "bjdh" },
{ label: "报警时间", prop: "bjsj" },
]
});
const item = ref({})
@ -106,50 +103,50 @@ const changeSize = (val) => {
getList();
};
const getList = () =>{
let params = {
ypid:item.value.id,
// sjLx:sjlx.value,
pageCurrent:pageData.pageConfiger.pageCurrent,
pageSize:pageData.pageConfiger.pageSize,
}
pageData.tableConfiger.loading = true;
qcckPost(params,'/jjdbYp/getPageList').then(res=>{
pageData.tableConfiger.loading = false;
pageData.tableData = res.records || []
pageData.total = res.total;
}).catch(()=>{
pageData.tableConfiger.loading = false;
})
const getList = () => {
let params = {
ypid: item.value.id,
ypmc:ypPremsess.value,
pageCurrent: pageData.pageConfiger.pageCurrent,
pageSize: pageData.pageConfiger.pageSize,
}
pageData.tableConfiger.loading = true;
qcckPost(params, '/mosty-gsxt/jjdbYp/getPageList').then(res => {
pageData.tableConfiger.loading = false;
pageData.tableData = res.records || []
pageData.total = res.total;
}).catch(() => {
pageData.tableConfiger.loading = false;
})
}
const close = () =>{
pageData.tableData = [];
const close = () => {
pageData.tableData = [];
showDialog.value = false;
router.replace(route.query)
emit("getData")
// emit("getData")
}
const init = (val,lxs) =>{
showDialog.value = true;
item.value = val;
sjlx.value = lxs;
getList()
nextTick(()=>{
tabHeightFn()
})
const init = (val, lxs) => {
showDialog.value = true;
item.value = val;
sjlx.value = lxs;
getList()
nextTick(() => {
tabHeightFn()
})
}
defineExpose({init})
defineExpose({ init })
</script>
<style lang="scss" scoped>
.listBox{
height: calc(100% - 50px);
::v-deep .searchBox{
margin-bottom: 0 !important;
}
}
.listBox {
height: calc(100% - 50px);
::v-deep .searchBox {
margin-bottom: 0 !important;
}
}
</style>

View File

@ -1,14 +1,15 @@
<template>
<div class="statistical-analysis">
<!-- 左侧树形菜单 -->
<div class="left-menu">
<!-- 数据类型 -->
<!-- 左侧树形菜单 -->
<!-- <div class="left-menu">
<CheckBox :data="checkData.sjlxBtn" customClass="all" @changeData="changeData_sjly"></CheckBox>
</div>
</div> -->
<!-- 右侧内容区 -->
<!-- 研判类型 -->
<div class="right-content">
<div class="btnsBox" ref="refBtn">
<!-- 研判类型 -->
<CheckBox :data="checkData.yplxBtn" @changeData="changeData_yplx"></CheckBox>
</div>
<div ref="searchBox">
@ -24,7 +25,7 @@
</div>
<div class="f14 lh24 pl4 pr4 one_text_detail">数量{{ it.num }}</div>
<div class="foot">
<span class="ml10 pointer" @click.stop="handleYp(it)" style="color:#027ff0 ;"><el-icon style="top: 2px;">
<span class="ml10 pointer" @click.stop="funAll(it.id)" style="color:#027ff0 ;"><el-icon style="top: 2px;">
<Document />
</el-icon>报告</span>
<span class="ml10 pointer" @click="handleHs(it)" style="color:#f4ac47 ;"><el-icon style="top: 2px;">
@ -40,8 +41,8 @@
</div>
</div>
<!-- 详情 -->
<Detail ref="detailForm" @getData="getLits"></Detail>
<YpModel v-model="showModel" :textContent="textContent"></YpModel>
<Detail ref="detailForm" @getData="getLits" :dict="JQLB"></Detail>
<YpModel v-model="showModel" :heightNumber="650" v-model:textContent="textContent"></YpModel>
</template>
<script setup>
@ -51,12 +52,16 @@ import * as MOSTY from "@/components/MyComponents/index";
import CheckBox from "@/components/checkBox/index.vue";
import Search from "@/components/aboutTable/Search.vue";
import { qcckPost } from "@/api/qcckApi.js";
import { timeValidate } from '@/utils/tools.js'
import {getItem} from '@/utils/storage.js'
import { useRoute, useRouter } from 'vue-router';
import { reactive, ref, onMounted, getCurrentInstance, watch, nextTick } from "vue";
import { jqypDywdtj, jqypfxbgJqlxtj, jqypfxbgYdfx, jqypfxbgJqlytj, jqypfxbgTj, jqypfxbgCljgf, jqypfxbgCzlfx, getDictItem } from '@/api/semanticAnalysis'
import { textStyle, Firstlevelheading, Subheading, BiheadlinegTitle, BigTitle, headTitle, report, signature } from './components/content.js'
const router = useRouter();
const { proxy } = getCurrentInstance();
const { D_SG_SJLY, D_SG_TSYPGZ } = proxy.$dict("D_SG_SJLY", "D_SG_TSYPGZ"); //获取字典数据
const { D_SG_SJLY, D_SG_TSYPGZ,JQLB } = proxy.$dict("D_SG_SJLY", "D_SG_TSYPGZ","JQLB"); //获取字典数据
const searchBox = ref(); //搜索框
const showModel = ref(false);
const textContent = ref('');
@ -90,6 +95,7 @@ watch(() => [D_SG_SJLY.value, D_SG_TSYPGZ.value], val => {
const route = useRoute();
onMounted(() => {
show.value = true;
Time()
tabHeightFn();
if (route.query.id) {
lookDeatl(route.query)
@ -153,38 +159,6 @@ const getLits = () => {
})
}
const handleYp = async (val) => {
await funAll(val.id)
let params = { tsypid: val.id, }
await qcckPost(params, '/mosty-gsxt/wshs/getDcypbg').then(res => {
let data = res || {};
const content = `
<p>为全面、客观、准确掌握全区公安机关的执法状况自治区公安厅基于数据统计对全区公安机关2021年度的执法状况作了客观分析。</p>
<p>一、执法状况总体分析</p>
<p>1.接处警情况</p>
<p>1.1接报警情</p>
`
// let html = `<p class="html_bt">${data.bt}</p>`
html += `<p>${data.head}</p>`
// html += `<p>${data.nr}</p>`
html += `<p class="html_bt">${content}
${sortingRatioValue.fxbg}
${sortingRatioValue.jqlx}
${sortingRatioValue.jqly}
${sortingRatioValue.dywd}
${sortingRatioValue.ydfx}
${sortingRatioValue.czjgfx}
${sortingRatioValue.xlwdfx}
</p>`;
html += `<p>${data.bc}</p>`
html += `<p>${data.end}</p>`
console.log(html);
textContent.value = html
showModel.value = true;
})
}
const handleHs = (val) => {
router.push({ path: '/MeetingRoom', query: { tsypid: val.id } })
}
@ -217,14 +191,13 @@ const dataList = reactive({
CljgfTj: [],
XsfxTj: [],
})
const sortingRatioValue = reactive({
const sortingRatioValue = ref({
jqlx: "",
jqly: "",
dywd: "",
ydfx: "",
xlwdfx: "",
czjgfx: "",
fxbg: ""
})
const sortingRatio = (data) => {
// 提取所有number值
@ -256,19 +229,64 @@ const getDictItemList = () => {
})
}
getDictItemList()
const funAll =async (val) => {
// await getfxbgDywdtj(val)
// await getfxbgJqlxtj(val)
// await getfxbgJqlytj(val)
// await getfxbgYdfx(val)
// await getfxgbCljgf(val)
// await getfxgbCzlfx(val)
// await getfxbgTj(val)
const funAll = (val) => {
const dev=getItem('deptId')[0]
textContent.value = BigTitle(`${endYears.value}年度西藏公安执法数据分析`) + headTitle({
orgName:dev.deptName,
serialNumber: timeValidate("","mm"),
time: timeValidate(),
})
const data = `为全面、客观、准确掌握全区公安机关的执法状况,自治区公安厅基于数据统计,对全区公安机关${endYears.value}年度的执法状况作了客观分析。`
textContent.value += BiheadlinegTitle('1.接处警情况') + textStyle(data) + Firstlevelheading('一、执法状况总体分析')
getfxbgYdfx(val)
getfxbgTj()
getfxbgJqlxtj(val)
getfxbgJqlytj(val)
getfxbgDywdtj(val)
getfxgbCljgf(val)
getfxgbCzlfx(val)
console.log(sortingRatioValue.value);
showModel.value = true;
}
watch(() => sortingRatioValue.value, (val) => {
if (val.jqlx&&val.jqly&&val.dywd&&val.ydfx&&val.xlwdfx&&val.czjgfx) {
textContent.value +=val.jqlx +val.jqly +val.dywd +val.ydfx + val.xlwdfx +val.czjgfx+report()+signature()
}
},{deep:true})
const getfxbgTj = (val) => {
jqypfxbgTj({ ypid: val }).then(res => {
const data = `${Time()} ,全区公安机关共接报各类警情${res.total}起,同比上升 ${res.tbbsb}%,同比上升${res.hbbsb}%`
textContent.value += BiheadlinegTitle('1.1接报警情') + textStyle(data)
dataList.XsfxTj = res
})
}
// 警情类型统计
const getfxbgJqlxtj = (val) => {
let params = {
...pageData.parameter,
ypid: val
}
jqypfxbgJqlxtj(params).then(res => {
const model = sortingRatio(res)
const data = `按警情类型来看,${model[0].name}最多,占到${model[0].ratio};其次为${model[1].name}最多,占到${model[1].ratio}`
sortingRatioValue.value.jqlx = Subheading('1.1.1类型维度') + textStyle(data)
})
}
// 警情来源统计
const getfxbgJqlytj = (val) => {
jqypfxbgJqlytj({ ypid: val }).then(res => {
const model = sortingRatio(res)
const data = `按警情来源来看,${model[0].name}最多,占到${model[0].ratio};其次为${model[1].name}最多,占到${model[1].ratio}`
sortingRatioValue.value.jqly = Subheading('1.1.2来源维度') + textStyle(data)
})
}
// 地域统计
const getfxbgDywdtj = (val) => {
jqypDywdtj({ypid:val}).then(res => {
jqypDywdtj({ ypid: val }).then(res => {
dataList.dyTj.xAxisData = res.map(it => it.ssbm)
dataList.dyTj.seriesData = [];
for (let i = 0; i < res.length; i++) {
@ -281,81 +299,42 @@ const getfxbgDywdtj = (val) => {
dataList.dyTj.seriesData[i][i] = res[i].number
}
const model = sortingRatio(res)
sortingRatioValue.dywd = `<p>1.1.3地域维度</p><p>从地市分布地市来看,${model[0].ssbm}警情量最大,占到全区警情总量的${model[0].number}。其次为${model[1].ssbm}${model[2].ssbm},两市警情量较为接近。警情量最少的为${model[model.length - 1].ssbm} </p>`
// sortingRatioValue.Dywdtj = sortingRatio(res)
})
}
// 警情类型统计
const getfxbgJqlxtj = (val) => {
let params = {
...pageData.parameter,
ypid:val
}
jqypfxbgJqlxtj(params).then(res => {
// sortingRatioValue.Jqlx =
const model = sortingRatio(res)
sortingRatioValue.jqlx = `<p>1.1.1类型维度</p><p>按警情类型来看,${model[0].name}最多,占到${model[0].ratio};其次为${model[1].name}最多,占到${model[1].ratio}。</p>`
dataList.jqlxTj = res.map(item => {
return {
name: item.name,
value: item.number
}
})
})
}
// 警情来源统计
const getfxbgJqlytj = (val) => {
jqypfxbgJqlytj({ypid:val}).then(res => {
// sortingRatioValue.Lyfx =
const model = sortingRatio(res)
sortingRatioValue.jqly = `<p>1.1.2来源维度</p><p>按警情来源来看,${model[0].name}最多,占到${model[0].ratio};其次为${model[1].name}最多,占到${model[1].ratio}。</p>`
dataList.jqlyTj = res.map(item => {
return {
name: item.name,
value: item.number
}
})
let data
if (model.length>1) {
data = `从地市分布地市来看,${model[0].ssbm}警情量最大,占到全区警情总量的${model[0].number}。其次为${model[1].ssbm}${model[2].ssbm},两市警情量较为接近。警情量最少的为${model[model.length - 1].ssbm}`
} else {
data = `从地市分布地市来看,${model[0].ssbm}警情量最大,占到全区警情总量的${model[0].number}`
}
sortingRatioValue.value.dywd = Subheading('1.1.3地域维度') + textStyle(data)
})
}
//分析报告-时间维度-月分析
const getfxbgYdfx = (val) => {
jqypfxbgYdfx({ypid:val}).then(res => {
// sortingRatioValue.Ydfx =
jqypfxbgYdfx({ ypid: val }).then(res => {
const model = sortingRatio(res)
sortingRatioValue.ydfx = `<p >1.1.4时间维度</p> <p>我们将所有警情按照月份划分进行统计发现,每月警情分布较为平均。最高月份为${model[0].month}月,占到${model[0].number};最低月份为${model[res.length - 1].month}月,占到${model[res.length - 1].number}。考虑是因为${model[0].month}月为我区传统旅游旺季,进藏人员较多。 ${model[res.length - 1].month}月一般春节及藏历新年期间,在藏人员较少。</p>
`
// dataList.ydTj = res.map(item => {
// return {
// name: item.month,
// value: item.number
// }
// })
const data = `我们将所有警情按照月份划分进行统计发现,每月警情分布较为平均。最高月份为${model[0].month}月,占到${model[0].number};最低月份为${model[res.length - 1].month}月,占到${model[res.length - 1].number}。考虑是因为${model[0].month}月为我区传统旅游旺季,进藏人员较多。 ${model[res.length - 1].month}月一般春节及藏历新年期间,在藏人员较少。`
sortingRatioValue.value.ydfx = Subheading('1.1.4时间维度') + textStyle(data)
})
}
// 分析报告-处理结果分析
const getfxgbCljgf = (val) => {
jqypfxbgCljgf({ypid:val}).then(res => {
jqypfxbgCljgf({ ypid: val }).then(res => {
// sortingRatioValue.Cljgf =
const model = sortingRatio(res)
dataList.CljgfTj = res.map(item => {
return {
name: item.name,
value: item.number
}
})
let czjgfx = `从警情处置结果来看,`
model.forEach(item => {
czjgfx += `${item.name},占到${item.ratio};`
})
sortingRatioValue.czjgfx = `<p>1.2警情处置</p><p>1.2.1结果维度</p><p>${czjgfx}</p>`
sortingRatioValue.value.xlwdfx = BiheadlinegTitle('1.2警情处置') + Firstlevelheading('1.2.1结果维度') + textStyle(czjgfx)
})
}
// 分析报告-处置率分析
const getfxgbCzlfx = (val) => {
jqypfxbgCzlfx({ypid:val}).then(res => {
jqypfxbgCzlfx({ ypid: val }).then(res => {
dataList.withinTj = [{
name: "超时分流(超过24小时)",
value: res.within24h ? res.within24h : 0
@ -363,18 +342,13 @@ const getfxgbCzlfx = (val) => {
name: "按时分流(24小时内)",
value: res.over24h ? res.over24h : 0
}]
sortingRatioValue.xlwdfx = `<p>1.2.2效率维度</p><p>从处警效率来看24小时以内处警的占到${res.over24h}%。表明我区公安机关在接警之后能够在第一时间处警。</p>
`
// sortingRatioValue.Czlfx = sortingRatio(dataList.withinTj)
const data = `从处警效率来看24小时以内处警的占到${res.over24h}%。表明我区公安机关在接警之后能够在第一时间处警。`
sortingRatioValue.value.czjgfx = Subheading('1.2.2效率维度') + textStyle(data)
})
}
const getfxbgTj = (val) => {
jqypfxbgTj({ypid:val}).then(res => {
sortingRatioValue.fxbg = `<p>${Time()} ,全区公安机关共 接报各类警情${res.total}起,同比上升 ${res.tbbsb}%,同比上升${res.hbbsb}%</p>`
dataList.XsfxTj = res
})
}
const timeDate = ref()
const endYears=ref()
const Time = () => {
const currentYear = new Date().getFullYear();
const startOfYear = new Date(currentYear, 0, 1); // 今年1月1日
@ -385,19 +359,15 @@ const Time = () => {
const endYear = endOfYear.getFullYear();
const endMonth = String(endOfYear.getMonth() + 1).padStart(2, '0');
const endDay = String(endOfYear.getDate()).padStart(2, '0');
timeDate.value=`${endYear}${endMonth}${endDay}`
endYears.value=year
return `${year}${month}${day}日 至${endYear}${endMonth}${endDay}`
}
</script>
<style lang="scss" scoped>
@ -447,7 +417,8 @@ const Time = () => {
.right-content {
float: left;
width: calc(100% - 290px);
// width: calc(100% - 290px);
width: 100%;
height: 100%;
margin-top: 20px;
margin-left: 10px;
@ -465,7 +436,7 @@ const Time = () => {
display: flex;
flex-wrap: wrap;
align-content: start;
gap: 22px;
gap: 18px;
overflow: hidden;
overflow-y: auto;
background: #fff;
@ -484,7 +455,7 @@ const Time = () => {
margin-top: 4px;
border-top: 1px solid #ccc;
padding: 4px;
box-sizing: border-box ;
box-sizing: border-box;
}
}