huangchengfa/test
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 同步

Browse Source
This commit is contained in:
huangchengfa 2025-03-30 22:20:09 +08:00
parent 1566b44fcd
commit 9ff1938221
31 changed files with 6337 additions and 1261 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

861
src/components/TabList/Security.vue Normal file
View File

@ -0,0 +1,861 @@
<template>
<div>
<div v-if="props.isOpen">
<MOSTY.Assort :title="'消防类'" style="padding: 0" />
<BaseTag :items="pageData.countlist" :num="4" @getItem="cahngetype" />
<MOSTY.Assort :title="'安防类'" style="padding: 0" />
<BaseTag :items="pageData.countlist2" :num="4" @getItem="cahngetype" />
</div>
<div class="tabox">
<el-divider />
<MOSTY.Search :searchArr="searchArr" @submit="onSearch" />
<el-divider />
<div class="button">
<!-- isAuth && -->
<el-button @click="addUserHander" v-if="props.obj.saveBtnShow">
<el-icon>
<Plus />
</el-icon>
<span>新增</span>
</el-button>
<MOSTY.ExportExcel :exportSheets="exportSheets" :exportInfo="exportInfo" @getSheets="getSheets"
:ditData="{ D_BZ_SYZT, D_TB_JCYWLX }" />
<el-button @click="handleewm" v-loading="exportLoadings" :disabled="pageData.tableData.length == 0"
class="ml10">
<el-icon>
<Download />
</el-icon>
批量导出二维码
</el-button>
</div>
<MOSTY.Table :table-columns="pageData.tableColumns" :tableData="pageData.tableData" :tableloading="tableloading"
:isSelect="true" :isSort="true" :tableHeight="`calc(100vh - ${props.isOpen ? '780px' : '382px'})`">
<template #sign="{ row }">
<p style=" width: 12px; height: 12px;border-radius: 50%;margin: 0 auto"
:style="{ 'background-color': row?.sign ? '#33CC00' : '#FC5F76' }"></p>
</template>
<template #sblx="{ row }">
<dict-tag :options="D_TB_JCYWLX" :value="row.sblx" :tag="false" />
</template>
<template #responsibilitypersonname="{ row }">
<span>{{ row.responsibilitypersonname ? row.responsibilitypersonname.replace(/（null）/g, "") : "" }}</span>
</template>
<template #state="{ row }">
<dict-tag v-if="row.state" :options="D_BZ_SYZT" :value="row.state" :tag="false"
:color="row.state == '01' ? 'green' : 'red'" />
<span v-else>无</span>
</template>
<template #actions="{ row }">
<!-- isAuth && -->
<span class="operedit" @click="handlexg(row)" v-if="props.obj.saveBtnShow">
<el-icon>
<EditPen />
</el-icon>编辑</span>
<!-- isAuth && -->
<el-popconfirm v-if="props.obj.saveBtnShow" confirm-button-text="是" cancel-button-text="否" icon-color="red"
title="确定要删除?" @confirm="handledelete(row)">
<template #reference>
<span class="operdel" size="small">
<el-icon>
<Delete />
</el-icon>
删除</span>
</template>
</el-popconfirm>
<span class="operesee" @click="handleSee(row)">
<el-icon>
<View />
</el-icon>查看</span>
</template>
</MOSTY.Table>
<div class="fenye">
<MOSTY.Pages :pageConfiger="pageData.pageConfiger" @changeNo="handleCurrentChange"
@changeSize="handleSizeChange" />
</div>
</div>
</div>
<!-- 安全设备设施 -->
<div v-if="showdialogaqsbss" class="dialog-box">
<aqsbssindex :formData="formData" @saveSuccess="saveSuccess" :type="props.obj.type" />
</div>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index"
import aqsbssindex from "@/components/dialog/aqsbssindex.vue"
import { reactive, ref, onMounted, getCurrentInstance, watch } from "vue"
import { getApi, postApi } from "@/api/tobAcco_api.js"
import { ElMessage } from "element-plus"
import BaseTag from "@/views/dataReportWork/org/components/baseTag"
import { useStore } from "vuex"
import { getAuth, downloadewm } from "@/utils/tools.js"
import SecuritySheets from "./SecuritySheets.js"
import { singleObjectCheck } from "@/utils/tools.js"
const exportLoadings = ref(false)
const { proxy } = getCurrentInstance()
const {
D_BZ_SYZT,
D_TB_JCYWLX,
D_BZ_SBLX
} = proxy.$dict("D_BZ_SYZT", "D_TB_JCYWLX", "D_BZ_SBLX")
const store = useStore()
const emits = defineEmits(["handleChange", "searchChange"])
const tableloading = ref(false)
const props = defineProps({
obj: {
default: null,
type: Object
},
type: {
default: "",
type: String
},
tableHeight: {
default: "40vh",
type: String
},
isOpen: Boolean
})
const total = ref(0)
const type = ref("")
const isAuth = ref(false)
const formData = ref({
title: ""
})
const showdialogaqsbss = ref(false)
// 消防电源 消防水泵结合器 空气采样报警系统 红外对射报警系统 可燃气体探测报警系统 超音速干粉灭火系统
// 高压细水雾灭火系统 二氧化碳灭火系统 气溶胶灭火系统 水炮灭火系统 泡沫灭火系统 应急照明疏散指示系统
// 应急广播 停车场管理系统 电子巡更系统 电子围栏系统 门禁管理系统 安检门 场内道路管理系统
let fireControlPowerSupply = [
"sblx",
"name",
"location",
"azsj",
"trsysj",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 消防水池 消防水箱
let firePool = [
"sblx",
"name",
"location",
"azsj",
"trsysj",
"rztj",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 消防水泵
let firePump = [
"sblx",
"name",
"pumpsType",
"pumpsNumber",
"location",
"azsj",
"trsysj",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 感烟 感温报警系统
let alarmSystem = [
"sblx",
"name",
"location",
"azsj",
"trsysj",
"alarmHostsNumber",
"thermalFireDetectorsNumber",
"smokeFireDetectorsNumber",
"manualAlarmButtonsNumber",
"soundAndLightAlarmsNumber",
"areaDisplaysNumber",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 电气火灾监控（智慧用电）报警系统
let electricalFireMonitoring = [
"sblx",
"name",
"location",
"azsj",
"trsysj",
"smokeFireDetectorsNumber",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 防火门 防火墙 防火卷帘
let fireproofDoor = [
...fireControlPowerSupply,
"fireRating"
]
// 防火卷帘
let fireShutter = [
"sblx",
"name",
"azsj",
"trsysj",
"fireRating",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 防排烟系统
let smokeControlAndExhaustSystem = [
...fireControlPowerSupply,
"smokeExhaustType"
]
// 湿式自动喷水灭火系统 干式自动喷水灭火系统 预作用自动喷水灭火系统
let wetAutomatic = [
"sblx",
"name",
"waterSprayType",
"location",
"azsj",
"trsysj",
"sprayPumpsNumber",
"sprinklerHeadsNumber",
"controlHostsNumber",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 七氟丙烷灭火系统
let fireExtinguishingSystem = [
...fireControlPowerSupply,
"heptafluoropropaneType",
"heptafluoropropaneCount",
"controlHostsNumber",
"heptafluoropropaneVaseCount"
]
// 室内消火栓 室外消火栓
let indoorFireHydrant = [
...fireControlPowerSupply,
"waterSupplyMode",
"pumpsNumber",
"specificationModel",
"hydrantsNumber"
]
// 防雷装置
let lightningProtectionDevice = [
...fireControlPowerSupply,
"lightningProtectionType",
"groundingBody",
"lightningArrester",
"detectionPoint"
]
// 视频监控系统
let videoMonitoringSystem = [
...fireControlPowerSupply,
"monitoringType",
"videoVcrCount",
"videoCameraCount",
"videoPlaybackTime"
]
// const isShowxf = ref(true)
const sbsslist = ref([])
const pageData = reactive({
countlist: [
{
name: "消防电源",
count: 0,
dm: "20010101",
icon: `aqss/icon_01.png`
},
{
name: "消防供水系统",
count: 0,
dm: "20010102",
icon: `aqss/icon_02.png`
},
{
name: "火灾自动报警系统",
count: 0,
dm: "20010103",
icon: `aqss/icon_03.png`
},
{
name: "防火分隔",
count: 0,
dm: "20010104",
icon: `aqss/icon_04.png`
},
{
name: "自动灭火系统",
count: 0,
dm: "20010105",
icon: `aqss/icon_05.png`
},
{
name: "消火栓系统",
count: 0,
dm: "20010106",
icon: `aqss/icon_06.png`
},
{
name: "消防应急",
count: 0,
dm: "20010107",
icon: `aqss/icon_07.png`
},
{
name: "防雷装置",
count: 0,
dm: "20010108",
icon: `aqss/icon_08.png`
}
],
countlist2: [
{
name: "视频监控系统",
count: 0,
dm: "20010201",
icon: `aqss/icon_09.png`
},
{
name: "停车场管理系统",
count: 0,
dm: "20010202",
icon: `aqss/icon_10.png`
},
{
name: "电子巡更系统",
count: 0,
dm: "20010203",
icon: `aqss/icon_11.png`
},
{
name: "电子围栏系统",
count: 0,
dm: "20010204",
icon: `aqss/icon_12.png`
},
{
name: "门禁管理系统",
count: 0,
dm: "20010205",
icon: `aqss/icon_13.png`
},
{
name: "安检门",
count: 0,
dm: "20010206",
icon: `aqss/icon_01.png`
},
{
name: "场内道路管理系统",
count: 0,
dm: "20010207",
icon: `aqss/icon_03.png`
}
],
listQuery: {
type: "1"
},
pageConfiger: {
pageSize: props.isOpen ? 5 : 10,
pageCurrent: 1,
total: 0
},
tableColumns: [
{
title: "标记",
prop: "sign",
sortable: false,
slot: true
},
{
title: "单位",
prop: "orgname"
},
{
title: "安全设备设施名称",
prop: "name"
},
{
title: "安全设备设施类型",
prop: "sblx",
slot: true
},
{
title: "内部编号",
prop: "nbbh"
},
{
title: "所属场所部位",
prop: "sitename"
},
{
title: "具体位置",
prop: "location"
},
{
title: "责任部门",
prop: "responsibilitydeptname"
},
{
title: "责任人",
prop: "responsibilitypersonname",
slot: true
},
{
title: "状态",
prop: "state",
slot: true
},
{
title: "操作",
prop: "actions",
slot: true
}
],
tableData: []
})
const fromObj = ref({ type: "1" })
const exportInfo = reactive({
name: "",
loading: false,
disabled: false
})
const exportSheets = reactive(SecuritySheets)
const searchArr = reactive([
{
showType: "input",
prop: "keywords",
width: "250px",
placeholder: "请输入安全设备设施名称或内部编号"
}, {
showType: "zdlistTree",
prop: "sblx",
width: "250px",
placeholder: "请选择设备类型",
options: sbsslist
}, {
showType: "input",
prop: "partname",
width: "250px",
placeholder: "请输入所属场所部位"
}
])
const getaqsbsslb = () => {
getApi({
dm: "2001",
zdbh: "D_TB_JCYWLX",
level: 4
}, "/mosty-base/sysDict/getJcyelxDictTree").then(res => {
sbsslist.value = res[0].itemList
})
}
// 是否可以操作
const isAuthorize = async () => {
isAuth.value = await getAuth()
}
onMounted(() => {
getaqsbsslb()
isAuthorize()
if (props.type == "cs") {
pageData.listQuery.siteid = props.obj.id
fromObj.value.siteid = props.obj.id
getsbssscount()
gettablist()
} else if (props.type == "jzw") {
pageData.listQuery.buildingid = props.obj.id
fromObj.value.buildingid = props.obj.id
getsbssscount()
gettablist()
} else if (props.type == "lc") {
pageData.listQuery.floorid = props.obj.id
fromObj.value.floorid = props.obj.id
getsbssscount()
gettablist()
} else if (props.type == "bw") {
pageData.listQuery.partid = props.obj.id
fromObj.value.partid = props.obj.id
getsbssscount()
gettablist()
} else if (props.type == "aqsbss") {
// pageData.listQuery.pageSize = 20
watch(
() => props.obj.orgid,
newValue => {
if (newValue) {
// pageData.pageConfiger.pageSize = props.isOpen ? 5 : 10
pageData.listQuery.orgcode = newValue
fromObj.value.orgcode = newValue
fromObj.value.type = "0"
pageData.listQuery.type = "0"
getsbssscount()
gettablist()
}
},
{
deep: true,
immediate: true
}
)
}
})
// 统计各类（场、建、楼、部）或单位下，安全设备设施
function getsbssscount() {
postApi(fromObj.value, "/mosty-jcgl/sbglAqsbss/countTbSbglAqsbss").then(res => {
let xflist = res[0]
let aflist = res[1]
for (let i = 0; i < pageData.countlist.length; i++) {
const el = pageData.countlist[i]
el.count = 0
for (let j = 0; j < xflist.length; j++) {
const li = xflist[j]
if (li.dm == el.dm) {
el.count = li.count
}
}
}
for (let i = 0; i < pageData.countlist2.length; i++) {
const el2 = pageData.countlist2[i]
el2.count = 0
for (let j = 0; j < aflist.length; j++) {
const li = aflist[j]
if (li.dm == el2.dm) {
el2.count = li.count
}
}
}
})
}
const getTreeItem = (treeData, id) => {
for (let i in treeData) {
if (treeData[i].dm === id) {
return treeData[i]
}
if (treeData[i].itemList && treeData[i].itemList.length) {
var res = getTreeItem(treeData[i].itemList, id)
if (res) return res
}
}
}
const getSheets = go => {
exportInfo.loading = true
exportInfo.name = "安全设备设施"
if (pageData.listQuery.sblx) exportInfo.name += "-" + getTreeItem(sbsslist.value, pageData.listQuery.sblx).zdmc
exportSheets.forEach(item => {
if (!item.title.includes(store.state.user.currentDeptName)) item.title = store.state.user.currentDeptName + item.title
item.data = []
})
postApi({
...pageData.listQuery,
pageSize: 10000,
pageCurrent: 1
}, "/mosty-jcgl/sbglAqsbss/queryTbSbglAqsbssAll").then(res => {
if (!res) {
exportInfo.loading = false
return
}
res.forEach(list => {
if (list.floorname) {
list.sitename = list.sitename + "-" + list.buildingname + "-" + list.floorname + "-" + list.partname
} else {
list.sitename = list.sitename + "-" + list.buildingname + "-" + list.partname
}
list.pumpsType = list.pumpsType ? proxy.$getDictVal(list.pumpsType, D_BZ_SBLX) : ""
exportSheets.forEach(item => {
if (JSON.stringify(["200101020100", "200101020200"]) === JSON.stringify(item.sblx)) {
//"消防水池", "消防水箱"
if (["200101020100", "200101020200"].includes(list.sblx)) {
item.data.push(list)
}
} else if (JSON.stringify(["200101070100", "200101070200"]) === JSON.stringify(item.sblx)) {
//["应急照明疏散指示系统", "应急广播"]
if (["200101070100", "200101070200"].includes(list.sblx)) {
item.data.push(list)
}
} else if (JSON.stringify(["200101060100", "200101060200"]) === JSON.stringify(item.sblx)) {
//["室外消火栓", "室内消火栓"]
if (["200101060100", "200101060200"].includes(list.sblx)) {
item.data.push(list)
}
} else if (JSON.stringify(["200101050101", "200101050102", "200101050103"]) === JSON.stringify(item.sblx)) {
//["湿式自动喷水灭火系统", "干式自动喷水灭火系统", "预作用自动喷水灭火系统"]
if (["200101050101", "200101050102", "200101050103"].includes(list.sblx)) {
item.data.push(list)
}
} else {
if (item.sblx === list.sblx) item.data.push(list)
}
})
})
exportInfo.loading = false
go()
})
}
//获取安全器材类型
function cahngetype(val) {
pageData.listQuery.sblx = val.dm
gettablist()
}
//安全设备设施分页查询
function gettablist() {
tableloading.value = true
exportInfo.disabled = false
let sign_map = new Map(
[
["200101010000", fireControlPowerSupply],
["200101020100", firePool],
["200101020200", firePool],
["200101020300", firePump],
["200101020400", fireControlPowerSupply],
["200101030100", alarmSystem],
["200101030200", fireControlPowerSupply],
["200101030300", fireControlPowerSupply],
["200101030400", fireControlPowerSupply],
["200101030500", electricalFireMonitoring],
["200101040100", fireproofDoor],
["200101040200", fireproofDoor],
["200101040300", fireShutter],
["200101040400", smokeControlAndExhaustSystem],
["200101050100", fireControlPowerSupply],
["200101050200", fireControlPowerSupply],
["200101050300", fireControlPowerSupply],
["200101050400", fireControlPowerSupply], // 二氧化碳灭火系统
["200101050500", fireExtinguishingSystem], // "七氟丙烷灭火系统"
["200101050600", fireControlPowerSupply], // "气溶胶灭火系统"
["200101050700", fireControlPowerSupply], // "水炮灭火系统"
["200101050800", fireControlPowerSupply], // 泡沫灭火
["200101060100", indoorFireHydrant], // "室内消火栓"
["200101060200", indoorFireHydrant], // "室外消火栓"
["200101070100", fireControlPowerSupply], // "应急照明疏散指示系统"
["200101070200", fireControlPowerSupply], // "应急广播"
["200101080000", lightningProtectionDevice], // 防雷装置
["200102020000", fireControlPowerSupply], // 停车管理系统
["200102030000", fireControlPowerSupply], // "电子巡更系统"
["200102040000", fireControlPowerSupply], // 电子围栏
["200102050000", fireControlPowerSupply], // "门禁管理系统"
["200102060000", fireControlPowerSupply], // 安检门
["200102070000", fireControlPowerSupply], // "场内道路管理系统"
["200101050101", wetAutomatic], // 湿式自动喷水灭火系统
["200101050102", wetAutomatic],
["200101050103", wetAutomatic],
["200102010000", videoMonitoringSystem], // 视频监控
[null, fireControlPowerSupply],
])
postApi({ ...pageData.pageConfiger, ...pageData.listQuery }, "/mosty-jcgl/sbglAqsbss/queryTbSbglAqsbss").then(async res => {
if (res) {
tableloading.value = false
let table_Data = []
// sblx
for (let i = 0; i < res.records.length; i++) {
if (typeof res.records[i].sblx === 'string' && res.records[i].sblx.length !== 12){
res.records[i]['sign'] = false
table_Data.push(res.records[i])
continue
}
table_Data.push(await singleObjectCheck(res.records[i], sign_map.get(res.records[i].sblx)))
}
pageData.tableData = table_Data
console.log("页面数据")
console.log(pageData.tableData)
pageData.tableData.forEach(list => {
if (list.floorname) {
list.sitename = list.sitename + "-" + list.buildingname + "-" + list.floorname + "-" + list.partname
} else {
list.sitename = list.sitename + "-" + list.buildingname + "-" + list.partname
}
})
// total.value = res.total
pageData.pageConfiger.total = res.total
if (pageData.tableData.length === 0) exportInfo.disabled = true
}
})
}
//新增
function addUserHander() {
formData.value.type = props.type
if (props.type == "cs") {
formData.value.siteid = props.obj.id
formData.value.sitename = props.obj.placename
} else if (props.type == "jzw") {
if (props.obj.type == "cq") {
formData.value.publicarea = "1"
}
formData.value.siteid = props.obj.siteid
formData.value.sitename = props.obj.sitename
formData.value.buildingid = props.obj.id
formData.value.buildingname = props.obj.buildingname
formData.value.publicarea = props.obj.publicarea
} else if (props.type == "lc") {
formData.value.siteid = props.obj.siteid
formData.value.sitename = props.obj.sitename
formData.value.buildingid = props.obj.buildingid
formData.value.buildingname = props.obj.buildingname
formData.value.floorid = props.obj.id
formData.value.floorname = props.obj.floorname
} else if (props.type == "bw") {
if (props.obj.type == "cq") {
formData.value.sfcq = "1"
formData.value.publicarea = "1"
} else {
if (props.obj.sfcq && props.obj.sfcq == "1") {
formData.value.sfcq = "1"
formData.value.publicarea = "1"
} else {
formData.value.sfcq = "2"
formData.value.publicarea = "2"
}
}
formData.value.siteid = props.obj.siteid
formData.value.sitename = props.obj.sitename
formData.value.buildingid = props.obj.buildingid
formData.value.buildingname = props.obj.buildingname
formData.value.floorid = props.obj.floorid
formData.value.floorname = props.obj.floorname
formData.value.partid = props.obj.id
formData.value.partname = props.obj.partname
formData.value.qtmc = props.obj.qtmc ? props.obj.qtmc : null
}
formData.value.title = "安全设备设施新增"
formData.value.saveBtnShow = true
showdialogaqsbss.value = true
tableloading.value = false
}
//修改
function handlexg(row) {
formData.value.type = props.type
formData.value.qtmc = props.obj.qtmc ? props.obj.qtmc : null
formData.value.title = "安全设备设施修改"
formData.value.saveBtnShow = true
formData.value.id = row.id
formData.value.sblx = row.sblx
showdialogaqsbss.value = true
}
//查看
function handleSee(row) {
formData.value.type = props.type
formData.value.qtmc = props.obj.qtmc ? props.obj.qtmc : null
formData.value.title = "安全设备设施详情"
formData.value.saveBtnShow = false
formData.value.id = row.id
formData.value.sblx = row.sblx
showdialogaqsbss.value = true
}
//注销
function handledelete(row) {
getApi({ id: row.id }, `/mosty-jcgl/sbglAqsbss/deleteTbSbglAqsbssOne`).then(res => {
ElMessage.success("删除成功")
emits("searchChange", "aqsbss")
getsbssscount()
gettablist()
})
}
function saveSuccess(obj) {
// formData.value = {}
showdialogaqsbss.value = false
gettablist()
// pageData.listQuery.sblx = null
getsbssscount()
emits("searchChange", "aqsbss")
}
//查询
function onSearch(obj) {
pageData.listQuery.keywords = obj.keywords
pageData.listQuery.sblx = obj.sblx
pageData.listQuery.partname = obj.partname
pageData.pageConfiger.pageCurrent = 1
gettablist()
}
//页码发生变化
const handleCurrentChange = val => {
// pageData.listQuery.pageCurrent = val
pageData.pageConfiger.pageCurrent = val
gettablist()
}
//查询条数发生变化
const handleSizeChange = val => {
// pageData.listQuery.pageSize = val
pageData.pageConfiger.pageSize = val
gettablist()
}
//批量导出二维码
function handleewm() {
let url = "/mosty-api/mosty-jcgl/sbglAqsbss/exportQrcodeZip?orgcode=" + pageData.listQuery.orgcode +
(pageData.listQuery.keywords ? "&keywords" + pageData.listQuery.keywords : "") +
(pageData.listQuery.partname ? "&partname" + pageData.listQuery.partname : "") +
(pageData.listQuery.sblx ? "&sblx" + pageData.listQuery.sblx : "")
downloadewm(url, "安全设备设施二维码")
}
</script>
<style lang="scss" scoped>
::v-deep .el-divider--horizontal {
margin: 12px 0;
}
.el-pagination {
justify-content: end !important;
}
.headBox {
width: 100%;
margin-bottom: 10px;
}
.top_ul {
display: flex;
justify-content: start;
flex-wrap: wrap;
> li {
width: 11%;
height: 83px;
margin: 4px 0.75%;
}
}
.button {
display: flex;
align-items: center;
justify-content: flex-end;
margin-bottom: 12px;
}
</style>

2
src/components/TagsView/index.vue
View File

@ -7,7 +7,7 @@
:to="{ 'path': tag.path }">
<span>{{ tag.title || "个人中心" }}</span>
<!-- v-show="!isActive(tag)" -->
<el-icon v-if="tag.title!='工作台'" class="el-icon-close" :class="isActive(tag) ? 'activexx' : ''"
<el-icon v-if="tag.title!='消防管理大屏'" class="el-icon-close" :class="isActive(tag) ? 'activexx' : ''"
@click.prevent.stop="onCloseClick(index, isActive(tag))">
<close />
</el-icon>

4
src/layout/components/NavBar.vue
View File

@ -19,7 +19,7 @@
</el-dropdown-item>
<el-dropdown-item divided @click="updatePwd()">
<span style='text-decoration:underline;'>修改密码</span>
</el-dropdown-item>
<!-- <a target="_blank" href="#">
<el-dropdown-item>主页</el-dropdown-item>
@ -30,7 +30,7 @@
退出登录
</el-button>
</div>
</el-dropdown-item>
</el-dropdown-menu>
</template>

70
src/layout/components/SideBar/SideBarMenu.vue
View File

@ -1,50 +1,53 @@
<template>
<el-menu class="el-menu-vertical-demo menu-h" style="position: relative;" :collapse="!$store.getters.sidebarOpened"
:default-active="activeMenu" :unique-opened="uniqueOpened" background-color="rgba(0, 0, 0, 0)"
:text-color="$store.getters.cssVar.menuText" :active-text-color="$store.getters.cssVar.menuActiveText" router
width="30" :default-openeds="pageData.defaultOpeneds" :key="menuIndex">
:default-active="activeMenu" :unique-opened="uniqueOpened" background-color="rgba(0, 0, 0, 0)"
:text-color="$store.getters.cssVar.menuText" :active-text-color="$store.getters.cssVar.menuActiveText" router
width="30" :default-openeds="pageData.defaultOpeneds" :key="menuIndex">
<SideBarItem v-for="item in pageData.routes" :key="item.path" :route="item"></SideBarItem>
</el-menu>
</template>
<script setup>
import { computed, reactive, defineExpose, ref, onMounted } from "vue";
import { useRouter, useRoute } from "vue-router";
import { useStore } from "vuex";
import { filterRoutes, generateMenus } from "@/utils/route";
import * as MOSTY from "@/components/MyComponents/index";
import SideBarItem from "./SideBarItem.vue";
import { postApi } from "@/api/tobAcco_api.js";
import { computed, reactive, defineExpose, ref, onMounted } from "vue"
import { useRouter, useRoute } from "vue-router"
import { useStore } from "vuex"
import { filterRoutes, generateMenus } from "@/utils/route"
import * as MOSTY from "@/components/MyComponents/index"
import SideBarItem from "./SideBarItem.vue"
import { postApi } from "@/api/tobAcco_api.js"
const store = useStore();
const router = useRouter();
const activeMenu = ref();
const store = useStore()
const router = useRouter()
const activeMenu = ref()
const pageData = reactive({
routes: computed(() => {
const fRoutes = filterRoutes(router.getRoutes());
return generateMenus(fRoutes);
const fRoutes = filterRoutes(router.getRoutes())
let data = generateMenus(fRoutes);
// 临时调整
[data[0], data[1]] = [data[1], data[0]]
// return generateMenus(fRoutes)
return data
}),
defaultOpeneds: []//默认需要展开的路由
})
const uniqueOpened = ref(true);//是否只展示一个菜单
const uniqueOpened = ref(true)//是否只展示一个菜单
const menuIndex = ref(1)
if (router.getRoutes().length <= 7 && store.state.permission.routeReady <= 1) {
store.commit("user/setIsReady", {});
store.commit("user/setIsReady", {})
setTimeout(() => {
router.go(0);
}, 200);
router.go(0)
}, 200)
}
onMounted(() => {
})
//根据关键字过滤路由
const kwywordFilterRoute = (key) => {
//清空关键字
const fRoutes = filterRoutes(router.getRoutes());
const list = generateMenus(fRoutes);
const fRoutes = filterRoutes(router.getRoutes())
const list = generateMenus(fRoutes)
if (!key) {
pageData.routes = computed(() => {
return list
@ -63,27 +66,27 @@ const kwywordFilterRoute = (key) => {
}
}
const keywordGetRouter = (routes, keyword) => {
const lowerCaseKeyword = keyword.toLowerCase();
const lowerCaseKeyword = keyword.toLowerCase()
return routes
.filter(route => {
// 检查当前路由的路径或名称是否包含关键字
// 检查当前路由的路径或名称是否包含关键字
if (route.meta.title && route.meta.title.toLowerCase().includes(lowerCaseKeyword)) {
// pageData.defaultOpeneds.push(route.path)
return true;
return true
}
// 如果没有在当前路由找到匹配项，则递归检查子路由
// 如果没有在当前路由找到匹配项，则递归检查子路由
if (route.children) {
pageData.defaultOpeneds.push(route.path);
return route.children.some(childRoute => keywordGetRouter([childRoute], keyword).length > 0);
pageData.defaultOpeneds.push(route.path)
return route.children.some(childRoute => keywordGetRouter([childRoute], keyword).length > 0)
}
// 如果没有找到匹配项，则返回 false
return false;
// 如果没有找到匹配项，则返回 false
return false
})
// 如果需要包含子路由，则递归调用 keywordGetRouter 并合并结果
// 如果需要包含子路由，则递归调用 keywordGetRouter 并合并结果
.map(route => ({
...route,
children: route.children ? keywordGetRouter(route.children, keyword) : []
}));
}))
}
defineExpose({
kwywordFilterRoute
@ -140,7 +143,7 @@ defineExpose({
.felxs {
margin: 0 auto;
>span {
> span {
color: #000;
font-size: 12px;
display: block;
@ -149,7 +152,6 @@ defineExpose({
}
.menu-h {
height: calc(100vh - 114px);
}

245
src/router/index.js
View File

@ -1,12 +1,8 @@
import { createRouter, createWebHashHistory } from "vue-router"
import layout from "@/layout/index" //layout直接引用 其他使用路由懒加载
import store from "@/store"
import { systemRouterList } from "@/router/modules/systemManager.js"
import { lps } from "@/router/modules/lps.js"
import { businessRouteList } from "@/router/modules/businessCenter.js"
import { decisionRouteList } from "@/router/modules/decisionCenter.js"
import { integrationRouteList } from "@/router/modules/integrationMangerCenter.js"
import { safetyMonitoringRouteList } from "@/router/modules/safetyMonitoringCenter.js"
import { systemManager } from "@/router/modules/systemManager.js"
import { businessCenter } from "@/router/modules/businessCenter.js"
/**
* 关于路由配置描述
* 1.meta && meta.title && meta.icon 则在菜单栏显示
@ -17,7 +13,7 @@ import { safetyMonitoringRouteList } from "@/router/modules/safetyMonitoringCent
/**
* 私有路由表
*/
export const privateRoutes = [...businessRouteList, ...safetyMonitoringRouteList, ...integrationRouteList, ...decisionRouteList, ...systemRouterList, ...lps]
export const privateRoutes = [...systemManager, ...businessCenter,]
/**
* 公开路由表
*/
@ -26,7 +22,6 @@ export const publicRoutes = [
path: "/",
// 注意：带有路径“/”的记录中的组件“默认”是一个不返回 Promise 的函数
component: layout,
// redirect: "/profile",
redirect: "/login",
children: [
{
@ -34,38 +29,19 @@ export const publicRoutes = [
name: "dutyBook/home/workbench",
component: () => import("@/views/dutyBook/home/workbench.vue"),
meta: {
title: "工作台",
title: "消防管理大屏",
icon: "icon_ywyy",
iconH: "gongzuotai"
}
},
// {
// path: "/newsystem",
// component: () => import("@/views/newsystem/index.vue"),
// name: "/newsystem",
// meta: {
// title: "地图看板",
// icon: "shouye"
// }
// },
{
path: "/editPassword",
name: "editPassword",
component: () => import("@/views/systemConfig/editPassword/index"),
meta: {
title: "个人中心"
// icon: "gerenzhongxin"
}
},
// {
// path: "/staging",
// name: "/staging",
// component: () => import("@/views/staging/index"),
// meta: {
// title: "工作台",
// icon: "tree"
// }
// },
{
path: "/dict/detail",
name: "dictDetail",
@ -82,178 +58,6 @@ export const publicRoutes = [
title: "分配用户"
}
},
//按钮打开的路由 不需要进入左侧路由表
// {
// path: "/jgryandzz/zrsstatistics",
// name: "zrsstatistics",
// component: () => import("@/views/dutyBook/jgryandzz/commponents/zrsstatistics"),
// meta: {
// title: "责任书签订统计"
// }
// },
// {
// path: "/yxkzgl/csbwgl/csgl",
// name: "yxkzgl/csbwgl/csgl",
// meta: {
// title: "场所管理"
// },
// component: () => import("@/views/yxkzgl/csbwgl/csgl")
// },
// {
// path: "/jgryandzz/zrsstatisticsList",
// name: "zrsstatisticsList",
// component: () => import("@/views/dutyBook/jgryandzz/commponents/zrsstatisticsList"),
// meta: {
// title: "责任书列表"
// }
// },
// {
// path: "/jgryandzz/Cnsqdqk",
// name: "Cnsqdqk",
// component: () => import("@/views/dutyBook/jgryandzz/Cnsqdqk.vue"),
// meta: {
// title: "承诺书列表"
// }
// },
// {
// path: "/dutyBook/index",
// name: "/dutyBook/index",
// component: () => import("@/views/dutyBook/index"),
// meta: {
// title: "责任书统计"
// }
// },
// {
// path: "/aqfxfjgk/bshzqd",
// name: "bshzqd",
// component: () => import("@/views/fxgk/aqfxfjgk/bshzqd"),
// meta: {
// title: "个人风险辨识清单"
// }
// },
// {
// path: "/fxgk/aqfxfjgk/bshz",
// name: "/fxgk/aqfxfjgk/bshz",
// meta: {
// title: "辨识汇总"
// },
// component: () => import("@/views/fxgk/aqfxfjgk/bshz")
// },
// {
// path: "/fxgk/aqfxfjgk/bsqd",
// name: "/fxgk/aqfxfjgk/bsqd",
// meta: {
// title: "辨识清单"
// // icon: "article"
// },
// component: () => import("@/views/fxgk/aqfxfjgk/bsqd")
// },
// {
// path: "/pxjhcoms/pxssxq",
// name: "pxssxq",
// component: () => import("@/views/safety/pxjygl/pxjhcoms/pxssxq"),
// meta: {
// title: "培训实施详情"
// }
// },
// {
// path: "/pxjhcoms/Trainingreport",
// name: "Trainingreport",
// component: () => import("@/views/safety/pxjygl/pxjhcoms/Trainingreport"),
// meta: {
// title: "培训上报详情"
// }
// },
// {
// path: "/jgryandzz/Readytotal",
// name: "Readytotal",
// component: () => import("@/views/dutyBook/jgryandzz/commponents/Readytotal"),
// meta: {
// title: "在线安全库学习统计"
// }
// },
// {
// path: "/pxjhcoms/profiledetails",
// name: "profiledetails",
// component: () => import("@/views/safety/pxjygl/pxjhcoms/profiledetails.vue"),
// meta: {
// title: "个人培训档案详情"
// }
// },
// {
// path: "/fxgk/jcss/yhtz",
// name: "/fxgk/jcss/yhtz",
// meta: {
// title: "隐患台账"
// },
// component: () => import("@/views/fxgk/jcss/yhtz")
// },
// {
// path: "/fxgk/aqfxfjgk/component/fxtjxq",
// name: "/fxgk/aqfxfjgk/component/fxtjxq",
// meta: {
// title: store?.state.user.routerName ? store?.state.user.routerName : "风险辨识详情"
// },
// component: () => import("@/views/fxgk/aqfxfjgk/component/fxtjxq")
// },
// {
// path: "/yxkzgl/jsygl/sgzsbxq",
// name: "/yxkzgl/jsygl/sgzsbxq",
// meta: {
// title: "消息任务处理"
// },
// component: () => import("@/views/yxkzgl/jsygl/Sgzsbxq.vue")
// },
// {
// path: "/fxgk/jcss/dxmfx",
// name: "/fxgk/jcss/dxmfx",
// meta: {
// title: store?.state.user.routerName ? store?.state.user.routerName : "点线面分析"
// },
// component: () => import("@/views/fxgk/jcss/dxmfx")
// },
// {
// path: "/fxgk/jcss/zhjczgqk",
// name: "/fxgk/jcss/zhjczgqk",
// meta: {
// title: "综合检查整改情况"
// },
// component: () => import("@/views/fxgk/jcss/zhjczgqk")
// },
// {
// path: "/fxgk/jcss/yhtjxq",
// name: "/fxgk/jcss/yhtjxq",
// meta: {
// title: store?.state.user.routerName ? store?.state.user.routerName : "隐患详情"
// },
// component: () => import("@/views/fxgk/jcss/yhtjxq")
// },
// {
// path: "/fxgk/jcss/yhtjckjd",
// name: "/fxgk/jcss/yhtjckjd",
// meta: {
// title: store?.state.user.routerName ? store?.state.user.routerName : "隐患进度"
// },
// component: () => import("@/views/fxgk/jcss/yhtjckjd")
// },
// // 首页-通知，公告
// {
// path: "/dutyBook/tzgg/show",
// name: "dutyBook/tzgg/show",
// component: () => import("@/views/dutyBook/tzgg/show.vue"),
// meta: {
// title: "通知公告展示"
// }
// },
// // 首页-安全动态展示
// {
// path: "/dutyBook/aqdt/show",
// name: "dutyBook/aqdt/show",
// component: () => import("@/views/dutyBook/aqdt/show.vue"),
// meta: {
// title: "安全动态展示"
// }
// },
{
path: "/404",
name: "404",
@ -270,14 +74,6 @@ export const publicRoutes = [
path: "/login",
component: () => import("@/views/login/index") //系统登录
},
// {
// path: "/mapdemo",
// component: () => import("@/views/mapDemo/index.vue"),
// name: "mapdemo",
// meta: {
// title: "地图demo"
// }
// },
{
path: "/:pathMatch(.*)*",
component: () => import("@/views/error-page/404")
@ -285,34 +81,13 @@ export const publicRoutes = [
]
const router = createRouter({
routes: [...publicRoutes],
history: createWebHashHistory(),
routes: [...publicRoutes]
// routes: publicRoutes1
})
router.beforeEach((to, from, next) => {
/* 路由发生变化修改页面title */
if (to.path == "/fxgk/jcss/yhtjxq") {
to.meta.title = store?.state.user.routerName
}
if (to.path == "/fxgk/aqfxfjgk/component/fxtjxq") {
to.meta.title = store?.state.user.routerName
}
if (to.path == "/fxgk/jcss/dxmfx") {
to.meta.title = store?.state.user.routerName
}
next()
})
// const whiteList = [
// "/login",
// "/oatuh_login",
// "/profile",
// "/",
// ,
// "/instructCenter",
// "/editPassword",
// "/404",
// "/401"
// ];
// 初始化路由表
export function resetRouter() {
if (store.getters?.routeReady && store.getters?.userInfo?.permission?.menus) {
@ -321,14 +96,6 @@ export function resetRouter() {
router.removeRoute(menu)
})
}
// const newArr = router.getRoutes().filter(item => {
// return !whiteList.includes(item.path)
// })
// newArr.forEach((menu) => {
// if (menu.name) {
// router.removeRoute(menu.name);
// }
// });
}
export default router

207
src/router/modules/businessCenter.js
View File

@ -1,70 +1,137 @@
//业务应用中心路由表
import layout from "@/layout/index"; //layout直接引用 其他使用路由懒加载
export const businessRouteList = [
// {
// path: "/home",
// name: "home",
// component: layout,
// meta: {
// title: "首页",
// icon: "home",
// iconH: "homeH"
// },
// children: [
// {
// path: "/dutyBook/home/workbench",
// name: "dutyBook/home/workbench",
// component: () => import("@/views/dutyBook/home/workbench.vue"),
// meta: {
// title: "工作台",
// icon: "icon_ywyy"
// }
// },
// ],
// },
{
path: "/businessCenter",
component: layout,
name: "businessCenter",
meta: {
title: "业务应用中心",
icon: "icon_ywyy",
iconH: "ywyyCenter"
},
children: [
{
path: "/safetyResponsibility",
name: "safetyResponsibility",
meta: {
title: "安全责任体系",
icon: "icon_ywyy"
},
children: [
{
path: "/qualityPolicy",
name: "qualityPolicy",
meta: {
title: "目标方针",
icon: "icon_ywyy"
},
children: [
{
path: "/dutyBook/goalWay/aqfz",
name: "dutyBook/goalWay/aqfz",
component: () => import("@/views/dutyBook/home/workbench"), // 当做"模板"
meta: {
title: "安全方针",
icon: "icon_ywyy"
}
},
]
},
]
},
]
}
];
//业务应用中心路由表
import layout from "@/layout/index" //layout直接引用 其他使用路由懒加载
export const businessCenter = [
{
path: "/lps/businessCenter",
component: layout,
name: "lps/businessCenter",
meta: {
title: "业务应用中心",
icon: "icon_ywyy",
iconH: "ywyyCenter"
},
children: [
{
path: "/lps/businessCenter/xfcrt",
name: "lps/businessCenter/xfcrt",
component: () => import("@/views/lps/businessCenter/xfcrt"),
meta: {
title: "消防CRT",
icon: "icon_ywyy"
}
},
{
path: "/lps/businessCenter/afjk",
name: "lps/businessCenter/afjk",
component: () => import("@/views/lps/businessCenter/afjk"),
meta: {
title: "安防监控",
icon: "icon_ywyy"
}
},
{
path: "/lps/businessCenter/xfjk",
name: "lps/businessCenter/xfjk",
component: () => import("@/views/lps/businessCenter/xfjk"),
meta: {
title: "消防监控",
icon: "icon_ywyy"
}
},
{
path: "/lps/clgl",
name: "lps/clgl",
meta: {
title: "车辆管理",
icon: "icon_xtgl"
},
children: [
{
path: "/lps/clgl/cljk",
name: "lps/clgl/cljk",
component: () => import("@/views/lps/clgl/cljk"),
meta: {
title: "车辆监控",
icon: "icon_xtgl"
}
},
{
path: "/lps/clgl/jtgl",
name: "lps/clgl/jtgl",
component: () => import("@/views/lps/clgl/jtgl"),
meta: {
title: "交通管理",
icon: "icon_xtgl"
}
}
]
},
{
path: "/lps/sjgl",
name: "lps/sjgl",
meta: {
title: "事件管理",
icon: "icon_xtgl"
},
children: [
{
path: "/lps/sjgl/tfsj",
name: "lps/sjgl/tfsj",
component: () => import("@/views/lps/sjgl/tfsj"),
meta: {
title: "突发类事件",
icon: "icon_xtgl"
}
},
{
path: "/lps/sjgl/glsj",
name: "lps/sjgl/glsj",
component: () => import("@/views/lps/sjgl/glsj"),
meta: {
title: "管理类事件",
icon: "icon_xtgl"
}
}
]
},
{
path: "/lps",
name: "lps",
meta: {
title: "设备管理",
icon: "icon_xtgl",
iconH: "ytglCenter"
},
children: [
{
path: "/lps/bkq/index",
name: "lps/bkq/index",
component: () => import("@/views/lps/bkq/index.vue"),
meta: {
title: "布控球管理",
icon: "icon_ywyy"
}
},
{
path: "/lps/yjsb/index",
name: "lps/yjsb/index",
component: () => import("@/views/lps/yjsb/index.vue"),
meta: {
title: "预警设备管理",
icon: "icon_ywyy"
}
},
{
path: "/lps/aqsbss/index",
name: "lps/aqsbss/index",
meta: {
title: "安全设备设施",
icon: "icon_ywyy"
},
component: () => import("@/views/lps/aqsbss/index.vue")
}
]
}
]
}
]

530
src/router/modules/systemManager.js
View File

@ -1,270 +1,260 @@
//系统管理路由表
import layout from "@/layout/index"; //layout直接引用 其他使用路由懒加载
export const systemRouterList = [
{
path: "/systemConfig",
component: layout,
name: "systemConfig",
meta: {
title: "系统管理",
icon: "icon_xtgl",
iconH: "ytglCenter"
},
children: [
{
path: "/jurisdiction",
name: "jurisdiction",
meta: {
title: "用户权限管理",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/role-list",
name: "systemConfig/role-list",
component: () => import("@/views/systemConfig/role-list/index"),
meta: {
title: "角色管理",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/postManage",
name: "systemConfig/postManage",
component: () => import("@/views/systemConfig/postManage/index"),
meta: {
title: "职务管理",
icon: "icon_xtgl"
}
}
]
},
{
path: "/organization",
name: "organization",
meta: {
title: "组织机构权限",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/department-list",
name: "systemConfig/department-list",
component: () =>
import("@/views/systemConfig/department-list/index"),
meta: {
title: "部门管理",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/user-list",
name: "systemConfig/user-list",
component: () => import("@/views/systemConfig/user-list/index"),
meta: {
title: "用户管理",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/userty",
name: "systemConfig/userty",
component: () => import("@/views/systemConfig/user-list/tyuser"),
meta: {
title: "停用账号",
icon: "icon_xtgl"
}
}
]
},
// {
// path: "/systemSeting",
// name: "systemSeting",
// meta: {
// title: "系统设置",
// icon: "icon_xtgl"
// },
// children: [
// // {
// // path: "/systemSeting/themeSeting",
// // name: "systemSeting/themeSeting",
// // // component: () => import("@/views/systemConfig/role-list/index"),
// // meta: {
// // title: "主题调整",
// // icon: "icon_xtgl"
// // }
// // },
// // {
// // path: "/systemSeting/functionSeting",
// // name: "systemSeting/functionSeting",
// // // component: () => import("@/views/systemConfig/role-list/index"),
// // meta: {
// // title: "功能调整",
// // icon: "icon_xtgl"
// // }
// // }
// ]
// },
{
path: "/configuration",
name: "configuration",
meta: {
title: "系统配置",
icon: "icon_xtgl"
},
children: [
{
path: "/large-screen-settings",
name: "large-screen-settings",
meta: {
title: "大屏模块配置",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/large-screen-settings",
name: "systemConfig/large-screen-settings",
component: () =>
import("@/views/systemConfig/Large-screen-settings/index"),
meta: {
title: "模块分组数据",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/moksj",
name: "systemConfig/moksj",
component: () =>
import("@/views/systemConfig/Large-screen-settings/mksj.vue"),
meta: {
title: "模块数据",
icon: "icon_xtgl"
}
}
]
// Large- screen - settings
},
{
path: "/user/systemConfig",
name: "user/systemConfig",
component: () =>
import("@/views/systemConfig/system-config-list/index"),
meta: {
title: "系统参数配置",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/dict",
name: "systemConfig/dict",
component: () => import("@/views/systemConfig/dict/index"),
meta: {
title: "字典列表",
icon: "article-ranking"
}
},
{
path: "/systemConfig/menu-list",
name: "systemConfig/menu-list",
component: () => import("@/views/systemConfig/menu-list/index"),
meta: {
title: "菜单管理",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/system-version-list",
name: "systemConfig/system-version-list",
component: () =>
import("@/views/systemConfig/system-version-list/index"),
meta: {
title: "系统版本管理",
icon: "icon_xtgl"
}
},
// {
// path: "/systemConfig/system-init-set",
// name: "systemConfig/system-init-set",
// component: () =>
// import("@/views/systemConfig/system-init-set/index"),
// meta: {
// title: "系统初始化设置",
// icon: "icon_xtgl"
// }
// },
]
},
{
path: "/system/log",
name: "system/log",
meta: {
title: "日志",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/log-manage/operateLog",
name: "systemConfig/log-manage/operateLog",
component: () =>
import("@/views/systemConfig/log-manage/operateLog/index"),
meta: {
title: "操作日志",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/log-manage/loginLog",
name: "systemConfig/log-manage/loginLog",
component: () =>
import("@/views/systemConfig/log-manage/loginLog/index"),
meta: {
title: "登录日志",
icon: "icon_xtgl"
}
}
]
},
{
path: "/opera-maint",
name: "operaMaint",
meta: {
title: "运维管理",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/opera-maint/serve",
name: "systemConfig/opera-maint/serve",
component: () =>
import("@/views/systemConfig/opera-maint/serve/index"),
meta: {
title: "服务监控",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/opera-maint/save",
name: "systemConfig/opera-maint/save",
component: () =>
import("@/views/systemConfig/opera-maint/save/index"),
meta: {
title: "缓存监控",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/opera-maint/online",
name: "systemConfig/opera-maint/online",
component: () =>
import("@/views/systemConfig/opera-maint/online/index"),
meta: {
title: "在线用户",
icon: "icon_xtgl"
}
}
]
}
]
}
];
//系统管理路由表
import layout from "@/layout/index"; //layout直接引用 其他使用路由懒加载
export const systemManager = [
{
path: "/systemConfig",
component: layout,
name: "systemConfig",
meta: {
title: "系统管理",
icon: "icon_xtgl",
iconH: "ytglCenter"
},
children: [
{
path: "/jurisdiction",
name: "jurisdiction",
meta: {
title: "用户权限管理",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/role-list",
name: "systemConfig/role-list",
component: () => import("@/views/systemConfig/role-list/index"),
meta: {
title: "角色管理",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/postManage",
name: "systemConfig/postManage",
component: () => import("@/views/systemConfig/postManage/index"),
meta: {
title: "职务管理",
icon: "icon_xtgl"
}
}
]
},
{
path: "/organization",
name: "organization",
meta: {
title: "组织机构权限",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/department-list",
name: "systemConfig/department-list",
component: () =>
import("@/views/systemConfig/department-list/index"),
meta: {
title: "部门管理",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/user-list",
name: "systemConfig/user-list",
component: () => import("@/views/systemConfig/user-list/index"),
meta: {
title: "用户管理",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/userty",
name: "systemConfig/userty",
component: () => import("@/views/systemConfig/user-list/tyuser"),
meta: {
title: "停用账号",
icon: "icon_xtgl"
}
}
]
},
// {
// path: "/systemSeting",
// name: "systemSeting",
// meta: {
// title: "系统设置",
// icon: "icon_xtgl"
// },
// children: [
// // {
// // path: "/systemSeting/themeSeting",
// // name: "systemSeting/themeSeting",
// // // component: () => import("@/views/systemConfig/role-list/index"),
// // meta: {
// // title: "主题调整",
// // icon: "icon_xtgl"
// // }
// // },
// // {
// // path: "/systemSeting/functionSeting",
// // name: "systemSeting/functionSeting",
// // // component: () => import("@/views/systemConfig/role-list/index"),
// // meta: {
// // title: "功能调整",
// // icon: "icon_xtgl"
// // }
// // }
// ]
// },
{
path: "/configuration",
name: "configuration",
meta: {
title: "系统配置",
icon: "icon_xtgl"
},
children: [
{
path: "/large-screen-settings",
name: "large-screen-settings",
meta: {
title: "大屏模块配置",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/large-screen-settings",
name: "systemConfig/large-screen-settings",
component: () =>
import("@/views/systemConfig/Large-screen-settings/index"),
meta: {
title: "模块分组数据",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/moksj",
name: "systemConfig/moksj",
component: () =>
import("@/views/systemConfig/Large-screen-settings/mksj.vue"),
meta: {
title: "模块数据",
icon: "icon_xtgl"
}
}
]
// Large- screen - settings
},
{
path: "/user/systemConfig",
name: "user/systemConfig",
component: () =>
import("@/views/systemConfig/system-config-list/index"),
meta: {
title: "系统参数配置",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/dict",
name: "systemConfig/dict",
component: () => import("@/views/systemConfig/dict/index"),
meta: {
title: "字典列表",
icon: "article-ranking"
}
},
{
path: "/systemConfig/menu-list",
name: "systemConfig/menu-list",
component: () => import("@/views/systemConfig/menu-list/index"),
meta: {
title: "菜单管理",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/system-version-list",
name: "systemConfig/system-version-list",
component: () =>
import("@/views/systemConfig/system-version-list/index"),
meta: {
title: "系统版本管理",
icon: "icon_xtgl"
}
},
]
},
{
path: "/system/log",
name: "system/log",
meta: {
title: "日志",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/log-manage/operateLog",
name: "systemConfig/log-manage/operateLog",
component: () =>
import("@/views/systemConfig/log-manage/operateLog/index"),
meta: {
title: "操作日志",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/log-manage/loginLog",
name: "systemConfig/log-manage/loginLog",
component: () =>
import("@/views/systemConfig/log-manage/loginLog/index"),
meta: {
title: "登录日志",
icon: "icon_xtgl"
}
}
]
},
{
path: "/opera-maint",
name: "operaMaint",
meta: {
title: "运维管理",
icon: "icon_xtgl"
},
children: [
{
path: "/systemConfig/opera-maint/serve",
name: "systemConfig/opera-maint/serve",
component: () =>
import("@/views/systemConfig/opera-maint/serve/index"),
meta: {
title: "服务监控",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/opera-maint/save",
name: "systemConfig/opera-maint/save",
component: () =>
import("@/views/systemConfig/opera-maint/save/index"),
meta: {
title: "缓存监控",
icon: "icon_xtgl"
}
},
{
path: "/systemConfig/opera-maint/online",
name: "systemConfig/opera-maint/online",
component: () =>
import("@/views/systemConfig/opera-maint/online/index"),
meta: {
title: "在线用户",
icon: "icon_xtgl"
}
}
]
}
]
}
];

127
src/store/modules/app.js
View File

@ -1,5 +1,5 @@
import { getItem, setItem } from "@/utils/storage";
import { TAGS_VIEW } from "@/constant/index.js";
import { getItem, setItem } from "@/utils/storage"
import { TAGS_VIEW } from "@/constant/index.js"
export default {
namespaced: true,
state: () => ({
@ -8,43 +8,45 @@ export default {
tagsViewList: getItem(TAGS_VIEW) || [],
urlMd5: null,
timer: null,
timec: null,//时间戳
timec: null //时间戳
}),
mutations: {
//修改变大状态
editBig(state, value) {
state.isBig = value;
state.isBig = value
},
triggerSidebarOpened(state) {
state.sidebarOpened = !state.sidebarOpened;
state.sidebarOpened = !state.sidebarOpened
},
//添加tags
addTagsViewList(state, tag) {
const isFind = state.tagsViewList.find((item) => {
return item.path === tag.path;
});
const isFind = state.tagsViewList.find(item => {
return item.path === tag.path
})
//处理重复
if (!isFind) {
state.tagsViewList.push(tag);
const other = state.tagsViewList.filter((item) => {
return item.path !== '/dutyBook/home/workbench';
});
const tagList = [{
fullPath: "/dutyBook/home/workbench",
meta: {
title: "工作台",
icon: "icon_ywyy",
iconH: "homeH"
state.tagsViewList.push(tag)
const other = state.tagsViewList.filter(item => {
return item.path !== "/dutyBook/home/workbench"
})
const tagList = [
{
fullPath: "/dutyBook/home/workbench",
meta: {
title: "消防管理大屏",
icon: "icon_ywyy",
iconH: "homeH"
},
name: "dutyBook/home/workbench",
params: {},
path: "/dutyBook/home/workbench",
query: {},
title: "消防管理大屏"
},
name: "dutyBook/home/workbench",
params: {},
path: "/dutyBook/home/workbench",
query: {},
title: "工作台"
}, ...other]
setItem(TAGS_VIEW, tagList);
...other
]
setItem(TAGS_VIEW, tagList)
}
},
@ -52,71 +54,70 @@ export default {
* 删除 tag
*/
removeTagsView(state, payload) {
const tagsViewList = state.tagsViewList;
const tagsViewList = state.tagsViewList
if (payload.type == "index") {
tagsViewList.splice(payload.index, 1);
tagsViewList.splice(payload.index, 1)
} else {
tagsViewList.splice(tagsViewList.indexOf(payload.data), 1);
tagsViewList.splice(tagsViewList.indexOf(payload.data), 1)
}
setItem(TAGS_VIEW, tagsViewList);
setItem(TAGS_VIEW, tagsViewList)
},
/**
* 清空 tag
*/
clearTag(state, menu) {
if (menu != null) {
if (menu.fullPath != '/dutyBook/home/workbench') {
state.tagsViewList = [{
if (menu.fullPath != "/dutyBook/home/workbench") {
state.tagsViewList = [
{
fullPath: "/dutyBook/home/workbench",
meta: {
meta: {
title: "消防管理大屏"
}
},
name: "dutyBook/home/workbench",
params: {},
path: "/dutyBook/home/workbench",
query: {},
title: "消防管理大屏"
},
menu
]
} else {
state.tagsViewList = [menu]
}
} else {
state.tagsViewList = [
{
fullPath: "/dutyBook/home/workbench",
meta: {
meta: {
title: "工作台"
// icon: "gerenzhongxin"
title: "消防管理大屏"
}
},
name: "dutyBook/home/workbench",
params: {},
path: "/dutyBook/home/workbench",
query: {},
title: "工作台"
}, menu];
} else {
state.tagsViewList = [menu];
}
} else {
state.tagsViewList = [{
fullPath: "/dutyBook/home/workbench",
meta: {
meta: {
title: "工作台"
// icon: "gerenzhongxin"
}
},
name: "dutyBook/home/workbench",
params: {},
path: "/dutyBook/home/workbench",
query: {},
title: "工作台"
}];
title: "消防管理大屏"
}
]
}
setItem(TAGS_VIEW, state.tagsViewList);
setItem(TAGS_VIEW, state.tagsViewList)
},
// 保存请求md5
addurlMd5(state, url, timec) {
state.urlMd5 = url;
state.timec = timec;
state.urlMd5 = url
state.timec = timec
if (state.timer) {
clearTimeout(state.timer)
}
state.timer = setTimeout(() => {
state.urlMd5 = null
state.timer = null
}, 2000)
},
}
}
};
}

8
src/utils/tools.js
View File

@ -9,7 +9,7 @@ import { ElLoading } from "element-plus"
// 获取图片访问路径
export const getImgUrl = iconName => {
if (process.env.NODE_ENV === "development") {
return "http://192.168.3.81:8888/" + iconName
return "http://192.168.1.6:8888/" + iconName
} else if (process.env.NODE_ENV === "production") {
return window.location.origin + "/files/" + iconName//云平台
}
@ -902,14 +902,11 @@ export const arrayFiltering = (originalData, filteredData) => {
data[i]["sign"] = true
}
}else {
console.log(filteredData[j])
console.log(data[i][filteredData[j]])
data[i]["sign"] = false
break
}
}
} else {
console.log(filteredData[j])
data[i]["sign"] = false
break
}
@ -932,8 +929,6 @@ export const singleObjectCheck = (primaryObject, filterArray) => {
primaryObject["sign"] = true
}
}else {
console.log(filterArray[i])
console.log(primaryObject[filterArray[i]])
primaryObject["sign"] = false
break
}
@ -941,7 +936,6 @@ export const singleObjectCheck = (primaryObject, filterArray) => {
primaryObject["sign"] = true
}
} else {
console.log(filterArray[i])
primaryObject["sign"] = false
break
}

134
src/views/dataReportWork/aqjypx/components/sjtj.vue Normal file
View File

@ -0,0 +1,134 @@
<template>
<section class='sjtj-account' :style="{ 'width': props.width + 'px', 'margin-bottom': props.mb }"
v-for="(item, index) in props.info" :key="index">
<section class="box-top"
:style="{ background: props.background || '#DBF4EA', 'border-radius': props.isShowBottom ? '10px 10px 0 0' : '10px', 'align-items': props.align, 'height': props.height }"
:key="index">
<img v-if="item.icon" :src="getImgUrl(item.icon)">
<section class="right">
<section class="title-top">
<span class="sjtj-title">{{ item.title }}</span>
<template v-if="props.isShowTip">
<el-popover placement="top-start" :title="item.title" :width="200" trigger="hover"
:content="item.content || '暂无内容'">
<template #reference>
<el-icon :size="20" color="#21B97E">
<Warning />
</el-icon>
</template>
</el-popover>
</template>
</section>
<p :style="{ 'margin-top': item.mt ? item.mt : '10px' }">{{ filtterNum(item.num) }}</p>
</section>
</section>
<section class="box-bottom" v-if="props.isShowBottom && item?.bottomList?.length">
<section v-for="(i, k) in item.bottomList" :key="k">{{ i.lable }}{{ i.num >= 0 ? i.num : '' }}</section>
</section>
</section>
</template>
<script setup>
import { onMounted } from "vue";
import { getImgUrl } from "@/utils/tools.js"
const props = defineProps({
//背景颜色
background: {
type: String,
default: '#DBF4EA'
},
isShowTip: {
type: Boolean,
default: true
},
isShowBottom: {
type: Boolean,
default: true
},
info: {
type: Array,
default: () => [],
},
width: {
type: Number,
default: 280
},
mb: {
type: String,
default: '0px'
},
align: {
type: String,
default: 'flex-start'
},
height: {
type: String,
default: '87px'
},
});
const filtterNum = num => {
return (num || 0).toString().replace(/(\d)(?=(?:\d{3})+$)/g, '$1,');
}
onMounted(() => {
})
</script>
<style lang="scss" scoped>
.sjtj-account {
color: #000;
margin-right: 12px;
// padding: 10px 20px;
.box-top {
height: 87px;
// min-width: 200px;
padding: 10px 15px;
box-sizing: border-box;
display: flex;
border-radius: 10px 10px 0 0;
>img {
width: 60px;
height: 60px;
}
.right {
margin-left: 10px;
flex: 1;
.title-top {
display: flex;
align-items: center;
.sjtj-title {
margin-right: 4px;
font-size: 14px;
color: #071428;
}
}
>p {
font-size: 30px;
color: #071428;
margin: 0;
margin-top: 10px;
}
}
}
.box-bottom {
width: 100%;
height: 36px;
padding: 10px 20px 15px 15px;
box-sizing: border-box;
display: flex;
border-radius: 0 0 10px 10px;
background-color: rgba(33, 185, 126, 0.2);
align-items: center;
justify-content: space-between;
padding: 0 16px;
color: #21b97e;
font-size: 14px;
}
}
</style>

71
src/views/dataReportWork/org/components/baseTag.vue Normal file
View File

@ -0,0 +1,71 @@
<template>
<div class="bases">
<div class="item" v-for="(item, i) in items" :key="i" @click="getItem(item)">
<div class="inner">
<img :src="getImgUrl(item.icon)" class="icon" />
<div class="info">
<p class="name">{{ item.name }}</p>
<p class="count">{{ item.count.toLocaleString() }}</p>
</div>
</div>
</div>
<div class="clearfix"></div>
</div>
</template>
<script setup>
import { getImgUrl } from "@/utils/tools.js"
const props = defineProps({ items: Array, num: Number })
const emit = defineEmits(["getItem"])
const getItem = item => {
emit("getItem", item)
}
</script>
<style lang="scss" scoped>
.bases {
display: flex;
justify-content: start;
flex-wrap: wrap;
.item {
width: 347px;
float: left;
padding: 5px;
cursor: pointer;
.inner {
background: #d2f2e5;
border-radius: 4px;
padding: 5px 20px;
display: flex;
.icon {
width: 60px;
height: 60px;
border: none;
margin-top: 3px;
}
.info {
flex: 1;
color: #333;
p {
padding-left: 30px;
margin: 0;
&.name {
font-size: 18px;
margin: 7px 0;
}
&.count {
font-size: 24px;
font-weight: 500;
}
}
}
}
}
}
</style>

871
src/views/lps/aqsbss/Security.vue Normal file
View File

@ -0,0 +1,871 @@
<template>
<div>
<div v-if="props.isOpen">
<MOSTY.Assort :title="'消防类'" style="padding: 0" />
<BaseTag :items="pageData.countlist" :num="4" @getItem="cahngetype" />
<MOSTY.Assort :title="'安防类'" style="padding: 0" />
<BaseTag :items="pageData.countlist2" :num="4" @getItem="cahngetype" />
</div>
<div class="tabox">
<el-divider />
<MOSTY.Search :searchArr="searchArr" @submit="onSearch" />
<el-divider />
<div class="button">
<el-button @click="addUserHander" v-if="props.obj.saveBtnShow">
<el-icon>
<Plus />
</el-icon>
<span>新增</span>
</el-button>
<MOSTY.ExportExcel :exportSheets="exportSheets" :exportInfo="exportInfo" @getSheets="getSheets"
:ditData="{ D_BZ_SYZT, D_TB_JCYWLX }" />
<el-button @click="handleewm" v-loading="exportLoadings" :disabled="pageData.tableData.length == 0"
class="ml10">
<el-icon>
<Download />
</el-icon>
批量导出二维码
</el-button>
</div>
<MOSTY.Table :table-columns="pageData.tableColumns" :tableData="pageData.tableData" :tableloading="tableloading"
actionsW="300" :isSelect="true" :isSort="true"
:tableHeight="`calc(100vh - ${props.isOpen ? '780px' : '382px'})`">
<template #sign="{ row }">
<p style=" width: 12px; height: 12px;border-radius: 50%;margin: 0 auto"
:style="{ 'background-color': row?.sign ? '#33CC00' : '#FC5F76' }"></p>
</template>
<template #sblx="{ row }">
<dict-tag :options="D_TB_JCYWLX" :value="row.sblx" :tag="false" />
</template>
<template #responsibilitypersonname="{ row }">
<span>{{ row.responsibilitypersonname ? row.responsibilitypersonname.replace(/（null）/g, "") : "" }}</span>
</template>
<template #state="{ row }">
<dict-tag v-if="row.state" :options="D_BZ_SYZT" :value="row.state" :tag="false"
:color="row.state == '01' ? 'green' : 'red'" />
<span v-else>无</span>
</template>
<template #actions="{ row }">
<span class="operedit" @click="handlexg(row)" v-if="props.obj.saveBtnShow">
<el-icon>
<EditPen />
</el-icon>编辑</span>
<el-popconfirm v-if="props.obj.saveBtnShow" confirm-button-text="是" cancel-button-text="否" icon-color="red"
title="确定要删除?" @confirm="handledelete(row)">
<template #reference>
<span class="operdel" size="small">
<el-icon>
<Delete />
</el-icon>
删除</span>
</template>
</el-popconfirm>
<span class="operesee" @click="handleSee(row)">
<el-icon>
<View />
</el-icon>查看</span>
<span class="operedit" @click="handleSjrh(row)" v-if="props.obj.saveBtnShow && row.sblx == '200101030500'">
<el-icon>
<View />
</el-icon>视景融合</span>
</template>
</MOSTY.Table>
<div class="fenye">
<MOSTY.Pages :pageConfiger="pageData.pageConfiger" @changeNo="handleCurrentChange"
@changeSize="handleSizeChange" />
</div>
</div>
</div>
<!-- 视景融合配置 -->
<div v-if="showSjrh" class="dialog-box">
<Sjrh :formData="formData" @saveSuccess="saveSuccess" :type="props.obj.type" />
</div>
<!-- 安全设备设施 -->
<div v-if="showdialogaqsbss" class="dialog-box">
<aqsbssindex :formData="formData" @saveSuccess="saveSuccess" :type="props.obj.type" />
</div>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index"
import aqsbssindex from "./aqsbssindex.vue"
import Sjrh from "./sjrh.vue"
import { reactive, ref, onMounted, getCurrentInstance, watch } from "vue"
import { getApi, postApi } from "@/api/tobAcco_api.js"
import { ElMessage } from "element-plus"
import BaseTag from "@/views/dataReportWork/org/components/baseTag"
import { useStore } from "vuex"
import { getAuth, downloadewm } from "@/utils/tools.js"
import SecuritySheets from "../../../components/MyComponents/TabList/SecuritySheets.js"
import { singleObjectCheck } from "@/utils/tools.js"
const exportLoadings = ref(false)
const { proxy } = getCurrentInstance()
const {
D_BZ_SYZT,
D_TB_JCYWLX,
D_BZ_SBLX
} = proxy.$dict("D_BZ_SYZT", "D_TB_JCYWLX", "D_BZ_SBLX")
const store = useStore()
const emits = defineEmits(["handleChange", "searchChange"])
const tableloading = ref(false)
const props = defineProps({
obj: {
default: null,
type: Object
},
type: {
default: "",
type: String
},
tableHeight: {
default: "40vh",
type: String
},
isOpen: Boolean
})
const total = ref(0)
const type = ref("")
const isAuth = ref(false)
const formData = ref({
title: ""
})
const showdialogaqsbss = ref(false)
const showSjrh = ref(false)
// 消防电源 消防水泵结合器 空气采样报警系统 红外对射报警系统 可燃气体探测报警系统 超音速干粉灭火系统
// 高压细水雾灭火系统 二氧化碳灭火系统 气溶胶灭火系统 水炮灭火系统 泡沫灭火系统 应急照明疏散指示系统
// 应急广播 停车场管理系统 电子巡更系统 电子围栏系统 门禁管理系统 安检门 场内道路管理系统
let fireControlPowerSupply = [
"sblx",
"name",
"location",
"azsj",
"trsysj",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 消防水池 消防水箱
let firePool = [
"sblx",
"name",
"location",
"azsj",
"trsysj",
"rztj",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 消防水泵
let firePump = [
"sblx",
"name",
"pumpsType",
"pumpsNumber",
"location",
"azsj",
"trsysj",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 感烟 感温报警系统
let alarmSystem = [
"sblx",
"name",
"location",
"azsj",
"trsysj",
"alarmHostsNumber",
"thermalFireDetectorsNumber",
"smokeFireDetectorsNumber",
"manualAlarmButtonsNumber",
"soundAndLightAlarmsNumber",
"areaDisplaysNumber",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 电气火灾监控（智慧用电）报警系统
let electricalFireMonitoring = [
"sblx",
"name",
"location",
"azsj",
"trsysj",
"smokeFireDetectorsNumber",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 防火门 防火墙 防火卷帘
let fireproofDoor = [
...fireControlPowerSupply,
"fireRating"
]
// 防火卷帘
let fireShutter = [
"sblx",
"name",
"azsj",
"trsysj",
"fireRating",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 防排烟系统
let smokeControlAndExhaustSystem = [
...fireControlPowerSupply,
"smokeExhaustType"
]
// 湿式自动喷水灭火系统 干式自动喷水灭火系统 预作用自动喷水灭火系统
let wetAutomatic = [
"sblx",
"name",
"waterSprayType",
"location",
"azsj",
"trsysj",
"sprayPumpsNumber",
"sprinklerHeadsNumber",
"controlHostsNumber",
"sitename",
"buildingname",
"partname",
"responsibilitydeptname",
"responsibilitypersonname"
]
// 七氟丙烷灭火系统
let fireExtinguishingSystem = [
...fireControlPowerSupply,
"heptafluoropropaneType",
"heptafluoropropaneCount",
"controlHostsNumber",
"heptafluoropropaneVaseCount"
]
// 室内消火栓 室外消火栓
let indoorFireHydrant = [
...fireControlPowerSupply,
"waterSupplyMode",
"pumpsNumber",
"specificationModel",
"hydrantsNumber"
]
// 防雷装置
let lightningProtectionDevice = [
...fireControlPowerSupply,
"lightningProtectionType",
"groundingBody",
"lightningArrester",
"detectionPoint"
]
// 视频监控系统
let videoMonitoringSystem = [
...fireControlPowerSupply,
"monitoringType",
"videoVcrCount",
"videoCameraCount",
"videoPlaybackTime"
]
// const isShowxf = ref(true)
const sbsslist = ref([])
const pageData = reactive({
countlist: [
{
name: "消防电源",
count: 0,
dm: "20010101",
icon: `aqss/icon_01.png`
},
{
name: "消防供水系统",
count: 0,
dm: "20010102",
icon: `aqss/icon_02.png`
},
{
name: "火灾自动报警系统",
count: 0,
dm: "20010103",
icon: `aqss/icon_03.png`
},
{
name: "防火分隔",
count: 0,
dm: "20010104",
icon: `aqss/icon_04.png`
},
{
name: "自动灭火系统",
count: 0,
dm: "20010105",
icon: `aqss/icon_05.png`
},
{
name: "消火栓系统",
count: 0,
dm: "20010106",
icon: `aqss/icon_06.png`
},
{
name: "消防应急",
count: 0,
dm: "20010107",
icon: `aqss/icon_07.png`
},
{
name: "防雷装置",
count: 0,
dm: "20010108",
icon: `aqss/icon_08.png`
}
],
countlist2: [
{
name: "视频监控系统",
count: 0,
dm: "20010201",
icon: `aqss/icon_09.png`
},
{
name: "停车场管理系统",
count: 0,
dm: "20010202",
icon: `aqss/icon_10.png`
},
{
name: "电子巡更系统",
count: 0,
dm: "20010203",
icon: `aqss/icon_11.png`
},
{
name: "电子围栏系统",
count: 0,
dm: "20010204",
icon: `aqss/icon_12.png`
},
{
name: "门禁管理系统",
count: 0,
dm: "20010205",
icon: `aqss/icon_13.png`
},
{
name: "安检门",
count: 0,
dm: "20010206",
icon: `aqss/icon_01.png`
},
{
name: "场内道路管理系统",
count: 0,
dm: "20010207",
icon: `aqss/icon_03.png`
}
],
listQuery: {
type: "1",
sblx: '200101030500'
},
pageConfiger: {
pageSize: props.isOpen ? 5 : 10,
pageCurrent: 1,
total: 0
},
tableColumns: [
{
title: "标记",
prop: "sign",
sortable: false,
slot: true
},
{
title: "单位",
prop: "orgname"
},
{
title: "安全设备设施名称",
prop: "name"
},
{
title: "安全设备设施类型",
prop: "sblx",
slot: true
},
{
title: "内部编号",
prop: "nbbh"
},
{
title: "所属场所部位",
prop: "sitename"
},
{
title: "具体位置",
prop: "location"
},
{
title: "责任部门",
prop: "responsibilitydeptname"
},
{
title: "责任人",
prop: "responsibilitypersonname",
slot: true
},
{
title: "状态",
prop: "state",
slot: true
},
{
title: "操作",
prop: "actions",
slot: true
}
],
tableData: []
})
const fromObj = ref({ type: "1" })
const exportInfo = reactive({
name: "",
loading: false,
disabled: false
})
const exportSheets = reactive(SecuritySheets)
const searchArr = reactive([
{
showType: "input",
prop: "keywords",
width: "250px",
placeholder: "请输入安全设备设施名称或内部编号"
}, {
showType: "zdlistTree",
prop: "sblx",
width: "250px",
placeholder: "请选择设备类型",
options: sbsslist
}, {
showType: "input",
prop: "partname",
width: "250px",
placeholder: "请输入所属场所部位"
}
])
const getaqsbsslb = () => {
getApi({
dm: "2001",
zdbh: "D_TB_JCYWLX",
level: 4
}, "/mosty-base/sysDict/getJcyelxDictTree").then(res => {
sbsslist.value = res[0].itemList
})
}
// 是否可以操作
const isAuthorize = async () => {
isAuth.value = await getAuth()
}
onMounted(() => {
getaqsbsslb()
isAuthorize()
if (props.type == "cs") {
pageData.listQuery.siteid = props.obj.id
fromObj.value.siteid = props.obj.id
getsbssscount()
gettablist()
} else if (props.type == "jzw") {
pageData.listQuery.buildingid = props.obj.id
fromObj.value.buildingid = props.obj.id
getsbssscount()
gettablist()
} else if (props.type == "lc") {
pageData.listQuery.floorid = props.obj.id
fromObj.value.floorid = props.obj.id
getsbssscount()
gettablist()
} else if (props.type == "bw") {
pageData.listQuery.partid = props.obj.id
fromObj.value.partid = props.obj.id
getsbssscount()
gettablist()
} else if (props.type == "aqsbss") {
watch(
() => props.obj.orgid,
newValue => {
if (newValue) {
pageData.listQuery.orgcode = newValue
fromObj.value.orgcode = newValue
fromObj.value.type = "0"
pageData.listQuery.type = "0"
getsbssscount()
gettablist()
}
},
{
deep: true,
immediate: true
}
)
}
})
// 统计各类（场、建、楼、部）或单位下，安全设备设施
function getsbssscount() {
postApi(fromObj.value, "/mosty-jcgl/sbglAqsbss/countTbSbglAqsbss").then(res => {
let xflist = res[0]
let aflist = res[1]
for (let i = 0; i < pageData.countlist.length; i++) {
const el = pageData.countlist[i]
el.count = 0
for (let j = 0; j < xflist.length; j++) {
const li = xflist[j]
if (li.dm == el.dm) {
el.count = li.count
}
}
}
for (let i = 0; i < pageData.countlist2.length; i++) {
const el2 = pageData.countlist2[i]
el2.count = 0
for (let j = 0; j < aflist.length; j++) {
const li = aflist[j]
if (li.dm == el2.dm) {
el2.count = li.count
}
}
}
})
}
const getTreeItem = (treeData, id) => {
for (let i in treeData) {
if (treeData[i].dm === id) {
return treeData[i]
}
if (treeData[i].itemList && treeData[i].itemList.length) {
var res = getTreeItem(treeData[i].itemList, id)
if (res) return res
}
}
}
const getSheets = go => {
exportInfo.loading = true
exportInfo.name = "安全设备设施"
if (pageData.listQuery.sblx) exportInfo.name += "-" + getTreeItem(sbsslist.value, pageData.listQuery.sblx).zdmc
exportSheets.forEach(item => {
if (!item.title.includes(store.state.user.currentDeptName)) item.title = store.state.user.currentDeptName + item.title
item.data = []
})
postApi({
...pageData.listQuery,
pageSize: 10000,
pageCurrent: 1
}, "/mosty-jcgl/sbglAqsbss/queryTbSbglAqsbssAll").then(res => {
if (!res) {
exportInfo.loading = false
return
}
res.forEach(list => {
if (list.floorname) {
list.sitename = list.sitename + "-" + list.buildingname + "-" + list.floorname + "-" + list.partname
} else {
list.sitename = list.sitename + "-" + list.buildingname + "-" + list.partname
}
list.pumpsType = list.pumpsType ? proxy.$getDictVal(list.pumpsType, D_BZ_SBLX) : ""
exportSheets.forEach(item => {
if (JSON.stringify(["200101020100", "200101020200"]) === JSON.stringify(item.sblx)) {
//"消防水池", "消防水箱"
if (["200101020100", "200101020200"].includes(list.sblx)) {
item.data.push(list)
}
} else if (JSON.stringify(["200101070100", "200101070200"]) === JSON.stringify(item.sblx)) {
//["应急照明疏散指示系统", "应急广播"]
if (["200101070100", "200101070200"].includes(list.sblx)) {
item.data.push(list)
}
} else if (JSON.stringify(["200101060100", "200101060200"]) === JSON.stringify(item.sblx)) {
//["室外消火栓", "室内消火栓"]
if (["200101060100", "200101060200"].includes(list.sblx)) {
item.data.push(list)
}
} else if (JSON.stringify(["200101050101", "200101050102", "200101050103"]) === JSON.stringify(item.sblx)) {
//["湿式自动喷水灭火系统", "干式自动喷水灭火系统", "预作用自动喷水灭火系统"]
if (["200101050101", "200101050102", "200101050103"].includes(list.sblx)) {
item.data.push(list)
}
} else {
if (item.sblx === list.sblx) item.data.push(list)
}
})
})
exportInfo.loading = false
go()
})
}
//获取安全器材类型
function cahngetype(val) {
pageData.listQuery.sblx = val.dm
gettablist()
}
//安全设备设施分页查询
function gettablist() {
tableloading.value = true
exportInfo.disabled = false
let sign_map = new Map(
[
["200101010000", fireControlPowerSupply],
["200101020100", firePool],
["200101020200", firePool],
["200101020300", firePump],
["200101020400", fireControlPowerSupply],
["200101030100", alarmSystem],
["200101030200", fireControlPowerSupply],
["200101030300", fireControlPowerSupply],
["200101030400", fireControlPowerSupply],
["200101030500", electricalFireMonitoring],
["200101040100", fireproofDoor],
["200101040200", fireproofDoor],
["200101040300", fireShutter],
["200101040400", smokeControlAndExhaustSystem],
["200101050100", fireControlPowerSupply],
["200101050200", fireControlPowerSupply],
["200101050300", fireControlPowerSupply],
["200101050400", fireControlPowerSupply], // 二氧化碳灭火系统
["200101050500", fireExtinguishingSystem], // "七氟丙烷灭火系统"
["200101050600", fireControlPowerSupply], // "气溶胶灭火系统"
["200101050700", fireControlPowerSupply], // "水炮灭火系统"
["200101050800", fireControlPowerSupply], // 泡沫灭火
["200101060100", indoorFireHydrant], // "室内消火栓"
["200101060200", indoorFireHydrant], // "室外消火栓"
["200101070100", fireControlPowerSupply], // "应急照明疏散指示系统"
["200101070200", fireControlPowerSupply], // "应急广播"
["200101080000", lightningProtectionDevice], // 防雷装置
["200102020000", fireControlPowerSupply], // 停车管理系统
["200102030000", fireControlPowerSupply], // "电子巡更系统"
["200102040000", fireControlPowerSupply], // 电子围栏
["200102050000", fireControlPowerSupply], // "门禁管理系统"
["200102060000", fireControlPowerSupply], // 安检门
["200102070000", fireControlPowerSupply], // "场内道路管理系统"
["200101050101", wetAutomatic], // 湿式自动喷水灭火系统
["200101050102", wetAutomatic],
["200101050103", wetAutomatic],
["200102010000", videoMonitoringSystem], // 视频监控
[null, fireControlPowerSupply],
])
postApi({ ...pageData.pageConfiger, ...pageData.listQuery }, "/mosty-jcgl/sbglAqsbss/queryTbSbglAqsbss").then(async res => {
if (res) {
tableloading.value = false
let table_Data = []
// sblx
for (let i = 0; i < res.records.length; i++) {
if (typeof res.records[i].sblx === 'string' && res.records[i].sblx.length !== 12) {
res.records[i]['sign'] = false
table_Data.push(res.records[i])
continue
}
table_Data.push(await singleObjectCheck(res.records[i], sign_map.get(res.records[i].sblx)))
}
pageData.tableData = table_Data
pageData.tableData.forEach(list => {
if (list.floorname) {
list.sitename = list.sitename + "-" + list.buildingname + "-" + list.floorname + "-" + list.partname
} else {
list.sitename = list.sitename + "-" + list.buildingname + "-" + list.partname
}
})
// total.value = res.total
pageData.pageConfiger.total = res.total
if (pageData.tableData.length === 0) exportInfo.disabled = true
}
})
}
//新增
function addUserHander() {
formData.value.type = props.type
if (props.type == "cs") {
formData.value.siteid = props.obj.id
formData.value.sitename = props.obj.placename
} else if (props.type == "jzw") {
if (props.obj.type == "cq") {
formData.value.publicarea = "1"
}
formData.value.siteid = props.obj.siteid
formData.value.sitename = props.obj.sitename
formData.value.buildingid = props.obj.id
formData.value.buildingname = props.obj.buildingname
formData.value.publicarea = props.obj.publicarea
} else if (props.type == "lc") {
formData.value.siteid = props.obj.siteid
formData.value.sitename = props.obj.sitename
formData.value.buildingid = props.obj.buildingid
formData.value.buildingname = props.obj.buildingname
formData.value.floorid = props.obj.id
formData.value.floorname = props.obj.floorname
} else if (props.type == "bw") {
if (props.obj.type == "cq") {
formData.value.sfcq = "1"
formData.value.publicarea = "1"
} else {
if (props.obj.sfcq && props.obj.sfcq == "1") {
formData.value.sfcq = "1"
formData.value.publicarea = "1"
} else {
formData.value.sfcq = "2"
formData.value.publicarea = "2"
}
}
formData.value.siteid = props.obj.siteid
formData.value.sitename = props.obj.sitename
formData.value.buildingid = props.obj.buildingid
formData.value.buildingname = props.obj.buildingname
formData.value.floorid = props.obj.floorid
formData.value.floorname = props.obj.floorname
formData.value.partid = props.obj.id
formData.value.partname = props.obj.partname
formData.value.qtmc = props.obj.qtmc ? props.obj.qtmc : null
}
formData.value.title = "安全设备设施新增"
formData.value.saveBtnShow = true
showdialogaqsbss.value = true
tableloading.value = false
}
//修改
function handlexg(row) {
formData.value.type = props.type
formData.value.qtmc = props.obj.qtmc ? props.obj.qtmc : null
formData.value.title = "安全设备设施修改"
formData.value.saveBtnShow = true
formData.value.id = row.id
formData.value.sblx = row.sblx
showdialogaqsbss.value = true
}
// 视景融合
function handleSjrh(row) {
formData.value.id = row.id
formData.value.sblx = row.sblx
formData.value.title = "视景融合"
formData.value.deptcode = row.responsibilitydeptid
formData.value.orgcode = row.orgcode
showSjrh.value = true
}
//查看
function handleSee(row) {
formData.value.type = props.type
formData.value.qtmc = props.obj.qtmc ? props.obj.qtmc : null
formData.value.title = "安全设备设施详情"
formData.value.saveBtnShow = false
formData.value.id = row.id
formData.value.sblx = row.sblx
showdialogaqsbss.value = true
}
//注销
function handledelete(row) {
getApi({ id: row.id }, `/mosty-jcgl/sbglAqsbss/deleteTbSbglAqsbssOne`).then(res => {
ElMessage.success("删除成功")
emits("searchChange", "aqsbss")
getsbssscount()
gettablist()
})
}
function saveSuccess(obj) {
showdialogaqsbss.value = false
showSjrh.value = false
gettablist()
getsbssscount()
emits("searchChange", "aqsbss")
}
//查询
function onSearch(obj) {
pageData.listQuery.keywords = obj.keywords
pageData.listQuery.sblx = obj.sblx
pageData.listQuery.partname = obj.partname
pageData.pageConfiger.pageCurrent = 1
gettablist()
}
//页码发生变化
const handleCurrentChange = val => {
// pageData.listQuery.pageCurrent = val
pageData.pageConfiger.pageCurrent = val
gettablist()
}
//查询条数发生变化
const handleSizeChange = val => {
// pageData.listQuery.pageSize = val
pageData.pageConfiger.pageSize = val
gettablist()
}
//批量导出二维码
function handleewm() {
let url = "/mosty-api/mosty-jcgl/sbglAqsbss/exportQrcodeZip?orgcode=" + pageData.listQuery.orgcode +
(pageData.listQuery.keywords ? "&keywords" + pageData.listQuery.keywords : "") +
(pageData.listQuery.partname ? "&partname" + pageData.listQuery.partname : "") +
(pageData.listQuery.sblx ? "&sblx" + pageData.listQuery.sblx : "")
downloadewm(url, "安全设备设施二维码")
}
</script>
<style lang="scss" scoped>
::v-deep .el-divider--horizontal {
margin: 12px 0;
}
.el-pagination {
justify-content: end !important;
}
.headBox {
width: 100%;
margin-bottom: 10px;
}
.top_ul {
display: flex;
justify-content: start;
flex-wrap: wrap;
>li {
width: 11%;
height: 83px;
margin: 4px 0.75%;
}
}
.button {
display: flex;
align-items: center;
justify-content: flex-end;
margin-bottom: 12px;
}
</style>

1231
src/views/lps/aqsbss/aqsbssindex.vue Normal file
View File

File diff suppressed because it is too large Load Diff

72
src/views/lps/aqsbss/index.vue Normal file
View File

@ -0,0 +1,72 @@
<template>
<MOSTY.PageTree :pageTitle="'安全设备设施列表'" :searchType="'01'" @getDeptId="getdeptId">
<template #titleright>
<div class="head">
<div class="toggle" :class="{ active: isOpen }" @click="isOpen = !isOpen">
<span>统计</span>
<el-icon>
<DArrowLeft />
</el-icon>
</div>
</div>
</template>
<template #table>
<component :is="defineAsyncComponent(() => import('./Security.vue'))"
:obj='listQuery' :type='"aqsbss"' :tableHeight='"45vh"'
:isOpen="isOpen" />
</template>
</MOSTY.PageTree>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { reactive, ref, defineAsyncComponent } from "vue";
import { useStore } from "vuex"
const store = useStore()
const emit = defineEmits("changePage");
const isOpen = ref(false)
const listQuery = reactive({
type: '0',
saveBtnShow: true
});
//获取部门数据
const getdeptId = (val) => {
listQuery.orgid = val.id;
store.state.user.currentDeptName = val.orgname
};
const treeHeight = ref(""); // 树高度
// 树高度计算
const treeHeightFn = () => {
treeHeight.value = window.innerHeight - 187 + "px";
};
</script>
<style lang="scss" scoped>
.head {
display: flex;
justify-content: space-between;
.toggle {
height: 40px;
cursor: pointer;
display: flex;
align-items: center;
color: #0f3916;
.el-icon {
transform: rotate(90deg);
transition: all 0.25s ease;
}
&.active {
.el-icon {
transform: rotate(-90deg);
}
}
}
}
</style>

234
src/views/lps/aqsbss/rypz.vue Normal file
View File

@ -0,0 +1,234 @@
<template>
<div>
<div class='tabox'>
<div class="headBox3">
<div style="display: flex;">
<el-checkbox-group v-model="checkedList" v-loading="tableloading">
<el-checkbox label="1">部门安全员</el-checkbox>
<el-checkbox label="2">设备责任人</el-checkbox>
</el-checkbox-group>
<el-button class="ml10" type="primary" @click="addUserHander">
<el-icon>
<Plus />
</el-icon>
<span>添加其它人员</span>
</el-button>
</div>
<div>
<el-input placeholder="请输入姓名进行查询" v-model="pageData.listQuery.username" clearable
style='width:250px'></el-input>
<el-button type="primary" @click="searchdata" class="ml6">
<el-icon>
<Search />
</el-icon>
<span>查询</span>
</el-button>
</div>
</div>
<MOSTY.Table :table-columns="pageData.tableColumns" :tableData="pageData.tableData" :tableloading="tableloading"
:tableHeight="'35vh'" :isSort="true">
<template #rylx="{ row }">
<span v-if="row.rylx == '1'">部门安全员</span>
<span v-if="row.rylx == '2'">设备责任人</span>
<span v-if="row.rylx == '3'">其它</span>
</template>
<template #actions="{ row }">
<el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red"
title="确定要删除?" @confirm="handledelete(row)">
<template #reference>
<span class="operdel" size="small">
<el-icon>
<Delete />
</el-icon>
删除</span>
</template>
</el-popconfirm>
</template>
<template #fenye>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="pageData.listQuery.pageCurrent" background :page-sizes="[2, 5, 10, 20]"
:page-size="pageData.listQuery.pageSize" layout="total, prev, pager, next, sizes, jumper"
:total="total"></el-pagination>
</div>
</template>
</MOSTY.Table>
</div>
</div>
<!-- 选择人员 -->
<ChooseUser v-model="chooseUserVisible" :Single="false" @choosedUsers="getSonValue" :deptId="props.obj.deptcode"
:data='memberList'></ChooseUser>
</template>
<script setup>
import ChooseUser from "@/components/MyComponents/ChooseUser/Leader.vue"
import * as MOSTY from "@/components/MyComponents/index";
import { onMounted, reactive, ref, watchEffect, watch } from "vue"
import { getApi, postApi } from "@/api/tobAcco_api.js";
import { ElMessage } from "element-plus";
const emits = defineEmits(["handleChange", 'tableChange']);
const tableloading = ref(false);
const total = ref(0)
const editIndex = ref(null)
const rylx = ref(null)
const props = defineProps({
obj: {
default: null,
type: Object
}
});
const chooseUserVisible = ref(false)
const memberList = ref([])
const pageData = reactive({
listQuery: {
pageCurrent: 1,
pageSize: 5
},
tableColumns: [
{
title: "所属单位",
prop: "orgname"
},
{
title: "所属部门",
prop: "deptname"
},
{
title: "人员姓名",
prop: "username"
},
{
title: "人员类型",
prop: "rylx",
slot: true
},
{
title: "操作",
prop: "actions",
slot: true
}
],
tableData: []
})
const checkedList = ref([])
const flag = ref(false)
watch(
() => checkedList.value,
(val, oldVal) => {
if (!oldVal || !val) return;
if (val.length < oldVal.length) {
let delRylx = oldVal.filter(item => {
return !val.includes(item)
})
updateRylx(delRylx[0], '02')
}
if (val.length > oldVal.length) {
let addRylx = val.filter(item => {
return !oldVal.includes(item)
})
updateRylx(addRylx[0], '01')
}
}
);
onMounted(() => {
// 查询人员配置详情
getData(pageData.listQuery.sbid)
})
// 查询
const searchdata = () => {
pageData.listQuery.pageCurrent = 1;
getRyPage()
}
// 删除人员信息
const handledelete = row => {
postApi({}, `/mosty-lps/pz/delRy/${row.id}`).then(res => {
ElMessage.success("删除成功")
getData(pageData.listQuery.sbid)
})
}
// 获取人员信息
const getSonValue = value => {
let ryidList = value.map(item => {
return item.id
});
updateRylx('3', '01', ryidList)
}
// 打开人员选择弹窗
const addUserHander = () => {
chooseUserVisible.value = true
memberList.value = pageData.tableData.filter(item => {
return item.rylx == '3'
}).map(item => {
return item.userid
})
}
// 更新人员类型
const updateRylx = (rylx, czlx, ryidList) => {
let data = {
sbid: pageData.listQuery.sbid,
sblx: pageData.listQuery.sblx,
rylx: rylx,
czlx: czlx,
type: "01",
ryidList: ryidList
}
tableloading.value = true
postApi(data, '/mosty-lps/pz/updatePz').then(res => {
pageData.listQuery.pageCurrent = 1;
getRyPage()
}).finally(() => {
tableloading.value = false
})
}
watchEffect(() => {
pageData.listQuery.sblx = props.obj.sblx
pageData.listQuery.sbid = props.obj.id
});
const getData = (sbid) => {
getApi({ sbid }, '/mosty-lps/pz/getPzInfo').then(res => {
if (res) {
if (res.rylx) {
checkedList.value = res.rylx.split(',')
}
pageData.listQuery.pzid = res.id
getRyPage()
}
})
}
// 查询人员配置分页
const getRyPage = () => {
getApi(pageData.listQuery, '/mosty-lps/pz/getRyPage').then(res => {
if (res) {
pageData.tableData = res.records
total.value = res.total
tableloading.value = false
}
}).finally(() => {
tableloading.value = false
})
}
//页码发生变化
const handleCurrentChange = (val) => {
pageData.listQuery.pageCurrent = val;
getRyPage()
};
//查询条数发生变化
const handleSizeChange = (val) => {
pageData.listQuery.pageCurrent = 1;
pageData.listQuery.pageSize = val;
getRyPage()
};
</script>
<style lang="scss" scoped>
::v-deep .el-checkbox__label {
color: black;
}
.headBox3 {
display: flex;
justify-content: space-between;
margin-bottom: 10px;
}
</style>

50
src/views/lps/aqsbss/sjrh.vue Normal file
View File

@ -0,0 +1,50 @@
<template>
<MOSTY.FromPage :title="props.formData.title" @closeDialog="closeDialog">
<template #content>
<div>
<MOSTY.TabList :tablist="tablist2" :obj="props.formData" :isEdit="props.formData.saveBtnShow"
@tableChange="tableChange" @resetChange="resetChange" />
</div>
<div>
<MOSTY.TabList :tablist="tablist" :obj="props.formData" :isEdit="props.formData.saveBtnShow"
@tableChange="tableChange" @resetChange="resetChange" />
</div>
</template>
<template #footer>
<el-button @click="closeDialog">
<el-icon>
<DocumentDelete />
</el-icon>
关闭
</el-button>
</template>
</MOSTY.FromPage>
</template>
<script setup>
import { getImgUrl } from "@/utils/tools.js"
import { ref, defineAsyncComponent, onMounted } from "vue"
import * as MOSTY from "@/components/MyComponents/index"
const props = defineProps({
formData: {
type: Object,
default: {}
}
})
const tablist = ref([
{ title: "人员配置", actives: true, components: defineAsyncComponent(() => import("./rypz.vue")) }
])
const tablist2 = ref([
{ title: "视频通道配置", actives: true, components: defineAsyncComponent(() => import("./sptd.vue")) }
])
const emits = defineEmits(["saveSuccess"])
onMounted(() => {
})
// 关闭弹窗
function closeDialog() {
emits("saveSuccess")
}
</script>
<style lang="scss" scoped></style>

197
src/views/lps/aqsbss/spList.vue Normal file
View File

@ -0,0 +1,197 @@
<template>
<div>
<el-dialog title="视频通道选择" width="1400px" v-model="props.modelValue" :before-close="closed">
<el-form :model="listQuery" class="mosty-from-wrap" :inline="true" style="width: 960px;">
<el-form-item label="模糊查询：" style="width: 300px;">
<el-input placeholder="请输入名称或摄像头编号" v-model="listQuery.keywords" clearable style="width: 250px;"></el-input>
</el-form-item>
<el-form-item label="设备类型：" prop="cameraType">
<el-select v-model="listQuery.cameraType" placeholder="请选择设备类型" clearable style="width: 220px">
<el-option v-for="item in D_BZ_SXTLX" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</el-form-item>
<el-form-item style="width: 144px;">
<el-button type="success" @click="handleFilter">查询</el-button>
<el-button type="success" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
<div class="flex just-between treeBox2 ww100">
<div class="tabBox table-box-radio" style="margin-top: 0px;height: 100%;">
<el-table stripe ref="sbssRef" v-loading="tableloading" @selection-change="handleSelectionChange"
@row-click="changecoose" :data="tableData" border :row-key="keyid" v-model="currentRow" height="540">
<el-table-column width="55" #default="{ row }">
<el-radio v-model="ridioIndex" :label="row.id"></el-radio>
</el-table-column>
<el-table-column prop="sitename" align="center" label="场所/部位" width="350">
<template #default="{ row }">
{{ row.sitename + '->' + row.buildingname + (row.floorname ? '->' + row.floorname : '') + '->' +
row.partname }}
</template>
</el-table-column>
<el-table-column prop="name" align="center" label="设备名称"></el-table-column>
<el-table-column prop="sbbh" align="center" label="内部编号"></el-table-column>
<el-table-column prop="cameraType" align="center" label="摄像头类型">
<template #default="{ row }">
<dict-tag v-if="row.cameraType" :options="D_BZ_SXTLX" :value="row.cameraType" :tag="false" />
<span v-else>--</span>
</template>
</el-table-column>
</el-table>
</div>
</div>
<template #footer>
<div class="flex just-between">
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="listQuery.pageCurrent" :page-sizes="[4, 8]" :page-size="listQuery.pageSize"
layout="total, prev, pager, next, sizes, jumper" :total="total"></el-pagination>
<span class="dialog-footer">
<el-button type="primary" @click="handleSave">
<el-icon>
<DocumentChecked />
</el-icon>
<span>确定</span>
</el-button>
<el-button @click="closed" type="primary">
<el-icon>
<DocumentDelete />
</el-icon>
<span>关闭</span>
</el-button>
</span>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup>
import { defineProps, watch, ref, defineEmits, getCurrentInstance } from "vue";
import { getApi } from "@/api/tobAcco_api.js";
const { proxy } = getCurrentInstance();
import { ElMessage } from "element-plus";
import { getItem } from "@/utils/storage";
const total = ref(0);
const tableData = ref([]);
const ridioIndex = ref(null);
const sbssRef = ref(null);
const tableloading = ref(false);
const rightData = ref([])
const selectData = ref([])
const { D_BZ_SXTLX } = proxy.$dict("D_BZ_SXTLX")
const listQuery = ref({
pageCurrent: 1,
pageSize: 8,
});
const props = defineProps({
modelValue: {
type: Boolean,
required: true
},
// 查询当前部门下的人员
orgcode: {
type: String,
default: () => getItem("deptId").ssdwid
},
});
const currentRow = ref(-1); //选中的数据
const emits = defineEmits(["update:modelValue", "chooseSpList"]);
const closed = () => {
sbssRef.value.clearSelection();
currentRow.value = [];
listQuery.value.keywords = ''
emits("update:modelValue", false);
};
const keyid = (row) => {
return row.id;
};
watch(
() => props.modelValue,
(val) => {
if (val) {
sbssRef.value = null
ridioIndex.value = null
listQuery.value.orgcode = props.orgcode;
listQuery.value.sblx = props.sblx;
handleFilter();
}
}
);
watch(
() => props.sbid,
(val) => {
multipleUser(val);
}
);
function reset() {
listQuery.value.keywords = ''
listQuery.value.cameraType = ''
listQuery.value.orgcode = props.orgcode;
listQuery.value.pageCurrent = 1;
getListData();
}
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const getListData = async () => {
tableData.value = [];
tableloading.value = true;
const params = listQuery.value;
getApi(params, "/mosty-jcgl/aqsbssZb/getSpPage").then((res) => {
if (res) {
tableData.value = res?.records;
total.value = Number(res.total);
tableloading.value = false;
}
if (selectData.value && selectData.value.length > 0 && rightData.value.length == 0) {
multipleUser(selectData.value);
}
})
};
// 列表回显
function multipleUser(row) {
tableData.value.forEach((val) => {
sbssRef.value.toggleRowSelection(val, false);
});
if (row) {
ridioIndex.value = row;
} else {
ridioIndex.value = null;
}
}
const handleSelectionChange = (val) => {
currentRow.value = val;
};
//每一项点击事件
function changecoose(val) {
ridioIndex.value = val.id
}
const handleSave = () => {
const info = tableData.value.find((item) => {
return item.id === ridioIndex.value;
});
emits("chooseSpList", info);
closed();
sbssRef.value.clearSelection();
};
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
</script>
<style lang="scss" scoped>
@import "@/assets/css/layout.scss";
@import "@/assets/css/element-plus.scss";
::v-deep .el-radio__label {
display: none !important;
}
</style>

205
src/views/lps/aqsbss/sptd.vue Normal file
View File

@ -0,0 +1,205 @@
<template>
<div>
<!-- 查询 -->
<div class='tabox'>
<div class="headBox3">
<el-button type="primary" @click="add">
<el-icon>
<Plus />
</el-icon>
<span>新增</span>
</el-button>
</div>
<MOSTY.Table :table-columns="pageData.tableColumns" :tableData="pageData.tableData" :tableloading="tableloading"
:tableHeight="'40vh'" :isSort="true">
<template #point="{ row }">
<span v-if="row.point">{{ row.point }}</span>
<span v-else>--</span>
</template>
<template #actions="{ row }">
<span class="operedit" @click="setPoint(row)">
<el-icon>
<EditPen />
</el-icon>预制点</span>
<el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要删除?"
@confirm="handledelete(row)">
<template #reference>
<span class="operdel" size="small">
<el-icon>
<Delete />
</el-icon>
删除</span>
</template>
</el-popconfirm>
</template>
<template #fenye>
<div class="fenye" :style="{ top: tableHeight + 'px' }">
<el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="pageData.listQuery.pageCurrent" background :page-sizes="[2, 5, 8]"
:page-size="pageData.listQuery.pageSize" layout="total, prev, pager, next, sizes, jumper"
:total="total"></el-pagination>
</div>
</template>
</MOSTY.Table>
</div>
<div>
<SpList v-model="showSpList" @chooseSpList="chooseSpList" :orgcode="props.obj.orgcode"></SpList>
</div>
<div v-if="setPointShow" class="dialog-box">
<Video @saveSuccess="changePage" :sbbh="sbbh" :tddh="tddh" />
</div>
</div>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import SpList from "./spList.vue";
import Video from "./video.vue";
import { reactive, ref, watchEffect } from "vue"
import { getApi, postApi } from "@/api/tobAcco_api.js";
import { ElMessage } from "element-plus";
const emits = defineEmits(["handleChange", 'tableChange']);
const tableloading = ref(false);
const total = ref(0)
const showSpList = ref(false)
const setPointShow = ref(false)
const sbbh = ref(null)
const tddh = ref(null)
const formData = ref(null)
const props = defineProps({
obj: {
default: null,
type: Object
}
});
const pageData = reactive({
listQuery: {
pageCurrent: 1,
pageSize: 5
},
tableColumns: [
{
title: "场所/部位",
prop: "sitename"
},
{
title: "设备名称",
prop: "name"
},
{
title: "设备编号",
prop: "sbbh"
},
{
title: "预制点",
prop: "point",
slot: true
},
{
title: "操作",
prop: "actions",
slot: true
}
],
tableData: []
})
watchEffect(() => {
if (props.obj.id) {
pageData.listQuery.sbid = props.obj.id
// 获取子表
getzblist()
}
});
//关闭
const changePage = async (data) => {
setPointShow.value = false
if (data) {
formData.value.point = JSON.stringify({
id: data.id, presetPointCode: data.presetPointCode, presetPointName: data.presetPointName
})
postApi(formData.value, '/mosty-lps/pzTd/saveTd').then(res => {
ElMessage.success("预制点配置成功")
pageData.listQuery.pageCurrent = 1;
getzblist()
})
}
}
// 获取选中通道
const chooseSpList = (row) => {
let data = {}
data.type = '01'
data.sbid = props.obj.id
data.zbid = row.id
postApi(data, '/mosty-lps/pzTd/saveTd').then(res => {
ElMessage.success("添加成功")
pageData.listQuery.pageCurrent = 1;
getzblist()
})
}
// 获取子表
function getzblist() {
tableloading.value = true
getApi(pageData.listQuery, '/mosty-lps/pzTd/getPageList').then(res => {
pageData.tableData = res.records || [];
total.value = res.total
tableloading.value = false
}).finally(() => {
tableloading.value = false
})
}
// 新增
function add() {
showSpList.value = true
}
// 查询预制点
function setPoint(row) {
formData.value = row
getApi({}, `/mosty-jcgl/sbglAqsbss/queryTbSbglAqsbssById?id=${row.sbid}`).then(res => {
if (res) {
sbbh.value = res.sbbh
tddh.value = row.sbbh
setPointShow.value = true
}
})
}
// 删除
function handledelete(row) {
postApi({}, `/mosty-lps/pzTd/delTd/${row.id}`).then(res => {
ElMessage.success("删除成功");
pageData.listQuery.pageCurrent = 1;
getzblist()
})
}
// 页码发生变化
const handleCurrentChange = (val) => {
pageData.listQuery.pageCurrent = val;
getzblist()
};
// 查询条数发生变化
const handleSizeChange = (val) => {
pageData.listQuery.pageCurrent = 1;
pageData.listQuery.pageSize = val;
getzblist()
};
</script>
<style lang="scss" scoped>
.headBox3 {
display: flex;
justify-content: end;
width: 100%;
margin-bottom: 10px;
}
.top_ul {
display: flex;
justify-content: start;
flex-wrap: wrap;
>li {
width: 15%;
height: 83px;
margin: 6px 32px;
}
}
</style>

320
src/views/lps/aqsbss/video.vue Normal file
View File

@ -0,0 +1,320 @@
<template>
<div class="bigBox">
<MOSTY.FromPage title="预制点选择" @closeDialog="black">
<template #content>
<div class="main">
<div class="left">
<video controls style="width:100%;height:100%;object-fit:fill" id='videoElement'></video>
</div>
<div class="right">
<MOSTY.Assort title="方向控制" style="padding: 10px" />
<div class="controller">
<div v-for="btn in directionButton" :key="btn.key"
:class="[btn.value !== 9 ? 'sector' : '', btn.key]" :title="btn.label"
@mousedown="handleRegulate(btn, 0)" @mouseup="handleRegulate(btn, 1)">
<el-icon>
<CaretLeft />
</el-icon>
</div>
</div>
<MOSTY.Assort title="预制点" style="padding: 10px" />
<div style="text-align: left;" class="ml10">
<el-button size="small" @click="createPrefabricatedPoints()">创建</el-button>
</div>
<el-table size="small" :data="pointList" style="width: 100%">
<el-table-column prop="presetPointName" label="名称" />
<el-table-column label="操作">
<template #default="{ row }">
<span class="operedit" @click="selectPoint(row)">
<el-icon>
<Position />
</el-icon>选择</span>
</template>
</el-table-column>
</el-table>
</div>
</div>
</template>
<template #footer>
<el-button @click="black"> <el-icon>
<DocumentDelete />
</el-icon>关闭</el-button>
</template>
</MOSTY.FromPage>
</div>
</template>
<script setup>
import { ref, onMounted, getCurrentInstance, reactive } from "vue";
import * as MOSTY from "@/components/MyComponents/index";
import { ElMessage, ElMessageBox } from "element-plus"
import { getApi, postApi } from "@/api/tobAcco_api.js";
const { proxy } = getCurrentInstance();
let cameraDirectionControl = reactive({ stepX: 4, stepY: 4 })
let listOfPreFabricatedCameraPoints = ref([])
let hls = null
let pointList = ref([])
const props = defineProps({
sbbh: {
type: String,
default: '1003105'
},
tddh: {
type: String,
default: '1003105$1$0$0'
}
});
const directionButton = reactive([
{ label: "上", key: "up", value: 1 },
{ label: "右上", key: "up-right", value: 7 },
{ label: "右", key: "right", value: 4 },
{ label: "右下", key: "down-right", value: 8 },
{ label: "下", key: "down", value: 2 },
{ label: "左下", key: "down-left", value: 6 },
{ label: "左", key: "left", value: 3 },
{ label: "左上", key: "up-left", value: 5 },
{ label: "中心", key: "center", value: 9 }]
)
const emit = defineEmits("saveSuccess");
onMounted(() => {
initVideo(props.tddh)
getPointList()
});
/**
* 创建预设点
*/
const createPrefabricatedPoints = () => {
ElMessageBox.prompt("输入预制点名称", "预制点创建", {
confirmButtonText: "确认",
cancelButtonText: "取消",
inputPattern: /\S/,
inputErrorMessage: "预制点名称不能为空"
}).then(({ value }) => {
let data = {
presetPointCode: generateUniqueCode(listOfPreFabricatedCameraPoints.value),
operateType: 3,
presetPointName: value
}
cameraPreFabricationPointSetting(data)
}).catch((err) => {
ElMessage({
type: "info",
message: "Input canceled"
})
})
}
/**
* 设置功能预制点
* @param data
*/
const cameraPreFabricationPointSetting = async (data) => {
await postApi({ ...data, channelId: props.tddh }, "/mosty-lps/daSdk/operatePresetPoint")
await getPointList()
}
/**
* 生成唯一编码
* @param presetArray
* @returns {string}
*/
function generateUniqueCode(presetArray) {
const existingCodes = new Set(presetArray.map(item => item.presetPointCode))
let code
do {
const num = Math.floor(Math.random() * 256) + 1
code = num.toString().padStart(3, "0")
if (existingCodes.size >= 256) throw new Error("所有可能的编码都已被占用")
} while (existingCodes.has(code))
return code
}
/**
* 保存预制点
* @param data
*/
const selectPoint = (data) => {
emit("saveSuccess", data);
}
/**
* 获取预置点
* @param id
*/
const getPointList = async () => {
let data = await postApi({ channelId: props.tddh }, "/mosty-lps/daSdk/getPresetPoints")
if (data instanceof Array) pointList.value = data
}
/**
* 摄像头方向控制
* @param btn
* @param type
*/
const handleRegulate = async (btn, type) => {
cameraDirectionControl.channelId = props.tddh
cameraDirectionControl.command = !type ? 1 : 0
cameraDirectionControl.direct = btn.value
await postApi(cameraDirectionControl, "/mosty-lps/daSdk/operateDirect")
}
/**
* 初始化摄像头设备
* @param channelId
* @param domId
*/
const initVideo = async (channelId) => {
if (hls !== null) hls.destroy()
const videoElement = document.getElementById("videoElement")
//调用Hls.isSupported()检查浏览器是否支持MSE
let data = await postApi({ channelId, "streamType": 1, type: "hls" }, "/mosty-lps/daSdk/realtime")
if (proxy?.$Hls.isSupported()) {
hls = new Hls()
hls.attachMedia(videoElement)
hls.on(Hls.Events.MEDIA_ATTACHED, async () => {
hls.loadSource(data)
hls.on(Hls.Events.MANIFEST_PARSED, () => videoElement.play())
})
return
} else if (videoElement.canPlayType("application/vnd.apple.mpegurl")) {
// 如果支持原生播放
videoElement.src = data
videoElement.addEventListenter("canplay", () => videoElement.play())
return
}
ElMessage.error("当前环境不支持初始化")
}
const black = () => {
emit("saveSuccess");
};
</script>
<style lang="scss" scoped>
.bigBox {
.main {
height: 100%;
display: flex;
.left {
width: 75%;
height: 100%;
border: 1px solid grey;
}
.right {
width: 25%;
height: 100%;
border: 1px solid grey;
.controller {
margin: 0 auto;
position: relative;
width: 200px;
height: 200px;
display: flex;
justify-content: center;
align-items: center;
transform: rotate(22deg);
box-shadow: var(--panel-head-box-shadow);
border-radius: 50%;
z-index: 9;
.sector {
width: 194px;
height: 194px;
background-color: #f6f4f4;
clip-path: polygon(50% 50%, 100% 50%, 100% 3%);
border-radius: 50%;
position: absolute;
cursor: pointer;
&:hover {
background-color: var(--core-hover-color);
}
.el-icon {
position: absolute;
right: 20px;
top: 63px;
transform: rotate(-200deg);
color: black;
}
}
/* 各个方向的扇形按钮 */
.up {
transform: rotate(270deg);
}
.right {
transform: rotate(0deg);
.el-icon {
transform: rotate(-202deg);
}
}
.down-right {
transform: rotate(45deg);
}
.down {
transform: rotate(90deg);
.el-icon {
transform: rotate(-204deg);
}
}
.down-left {
transform: rotate(135deg);
}
.left {
transform: rotate(180deg);
.el-icon {
transform: rotate(-200deg);
}
}
.up-left {
transform: rotate(225deg);
}
.up {
transform: rotate(270deg);
}
.up-right {
transform: rotate(315deg);
}
/* 中心的圆形空心区域 */
.center {
position: absolute;
transform: translate(-50%, -50%);
/* 将中心定位到控制器的中心 */
width: 65px;
height: 65px;
top: 100px;
left: 100px;
background-color: var(--core-button-normal-bg-color);
border: 1px solid var(--core-border-color);
border-radius: 50%;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
z-index: 10;
/* 确保中心区域在其他扇形之上 */
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
&:hover {
background-color: var(--core-hover-color);
}
}
}
}
}
display: block !important;
padding: 0 14px;
box-sizing: border-box;
}
</style>

22
src/views/lps/businessCenter/afjk.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<div class="workbench">
安防监控
</div>
</template>
<script setup>
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import { ref } from 'vue';
</script>
<style scoped lang="scss">
.workbench {
width: 100%;
height: calc(100vh - 140px);
color: #333;
background: #fff;
}
</style>

22
src/views/lps/businessCenter/xfcrt.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<div class="workbench">
消防CRT
</div>
</template>
<script setup>
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import { ref } from 'vue';
</script>
<style scoped lang="scss">
.workbench {
width: 100%;
height: calc(100vh - 140px);
color: #333;
background: #fff;
}
</style>

22
src/views/lps/businessCenter/xfjk.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<div class="workbench">
消防监控
</div>
</template>
<script setup>
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import { ref } from 'vue';
</script>
<style scoped lang="scss">
.workbench {
width: 100%;
height: calc(100vh - 140px);
color: #333;
background: #fff;
}
</style>

22
src/views/lps/clgl/cljk.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<div class="workbench">
车辆监控
</div>
</template>
<script setup>
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import { ref } from 'vue';
</script>
<style scoped lang="scss">
.workbench {
width: 100%;
height: calc(100vh - 140px);
color: #333;
background: #fff;
}
</style>

22
src/views/lps/clgl/jtgl.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<div class="workbench">
交通管理
</div>
</template>
<script setup>
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import { ref } from 'vue';
</script>
<style scoped lang="scss">
.workbench {
width: 100%;
height: calc(100vh - 140px);
color: #333;
background: #fff;
}
</style>

22
src/views/lps/sjgl/glsj.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<div class="workbench">
管理类事件
</div>
</template>
<script setup>
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import { ref } from 'vue';
</script>
<style scoped lang="scss">
.workbench {
width: 100%;
height: calc(100vh - 140px);
color: #333;
background: #fff;
}
</style>

22
src/views/lps/sjgl/tfsj.vue Normal file
View File

@ -0,0 +1,22 @@
<template>
<div class="workbench">
突发类事件
</div>
</template>
<script setup>
import { useStore } from "vuex";
import { useRouter } from "vue-router";
import { ref } from 'vue';
</script>
<style scoped lang="scss">
.workbench {
width: 100%;
height: calc(100vh - 140px);
color: #333;
background: #fff;
}
</style>

617
src/views/lps/yjsb/videoPlay/index.vue Normal file
View File

@ -0,0 +1,617 @@
<template>
<MOSTY.FromPage :title="props.editObj.title" @closeDialog="closePost">
<template #content>
<div class="main">
<div class="left">
<div class="headerMessage">摄像头列表</div>
<div class="name" :class="cameraSelection === index ? 'clickLayout' : null"
@click.prevent="selectTheCameraPreview(item.sbbh, index)" v-for="(item, index) in cameraList"
:key="index">
<span>{{ (index + 1) + "、" + item.name }}</span>
</div>
<div class="actionSheet">
<div class="headerMessage">摄像头画面操作</div>
<div :class="cameraGraphicsOperationsIndex === index ? 'clickLayout name' : 'name'"
v-for="(item, index) in graphicOperation" :key="index"
@click="cameraScreenOperation(index)">
<span>{{ item }}</span>
</div>
<div class="headerMessage">视频布局</div>
<div class="name nameItem" :class="clickLayout === index ? 'clickLayout' : null"
v-for="(item, index) in videoLayout" :key="index"
@click="switchingLayout(index)">
<span>{{ item.name }}</span>
</div>
</div>
</div>
<div class="center">
<div v-for="index in splitScreenCount"
:id="index === 1 ? 'center_item' : null"
:class="cameraIndex === index - 1 ? 'active_video video_item' : 'video_item'"
:style="{'width' : `${100/(clickLayout+1)}%`, 'height': `${100/(clickLayout+1)}%`}"
:key="index">
<div :class="cameraIndex !== index -1 ? 'empty' : '' " v-if=" cameraIndex !== index -1 ">
<el-empty :image-size="40" />
</div>
<video v-else controls
:style="{ 'width': initialMonitoringOfContainersWidth, 'height': initialMonitoringOfContainersHeight,'objectFit': 'cover' }"
:id='"videoElement" + (index-1)'></video>
</div>
</div>
<div class="right">
<el-collapse v-model="activeNames" :accordion="true" @change="handleChange">
<el-collapse-item title="镜头控制" name="1">
<div class="lensContainer">
<div v-for="(item, index) of lensSetup" class="name nameItem">
<el-icon @mousedown="startTheCameraOperation(index, 0)" @mouseup="endOfCameraControl()">
<Minus />
</el-icon>
<span>{{ item }}</span>
<el-icon @mousedown="startTheCameraOperation(index, 1)" @mouseup="endOfCameraControl()">
<Plus />
</el-icon>
</div>
</div>
</el-collapse-item>
<el-collapse-item title="方向控制" name="2">
<div class="controller">
<div v-for="btn in directionButton"
:key="btn.key"
:class="[btn.value!==9?'sector':'',btn.key]"
:title="btn.label"
@mousedown="handleRegulate(btn, 0)" @mouseup="handleRegulate(btn, 1)">
<el-icon>
<CaretLeft />
</el-icon>
</div>
</div>
</el-collapse-item>
<el-collapse-item title="功能控制" name="3">
<div class="lensContainer">
<div v-for="item of functionalControl" class="name nameItem">
<span>{{ item }}</span>
</div>
</div>
</el-collapse-item>
<el-collapse-item title="预制点" name="4">
<div style="text-align: right">
<el-button size="small" @click="createPrefabricatedPoints()">创建</el-button>
</div>
<el-table size="small" :data="listOfPreFabricatedCameraPoints" style="width: 100%">
<el-table-column prop="presetPointName" label="名称" />
<el-table-column label="操作">
<template #default="scope">
<el-icon style="margin-right: 10px" @click="cameraPositioning(scope.row)">
<Position />
</el-icon>
<el-icon @click="cameraPrefabricationPointModification(scope.row)" color="#0cba80"
style="margin-right: 10px">
<EditPen />
</el-icon>
<el-icon @click="cameraPreFabricatedPointDeletion(scope.row)" color="red">
<Delete />
</el-icon>
</template>
</el-table-column>
</el-table>
</el-collapse-item>
<el-collapse-item title="巡航线" name="5">
<div style="text-align: right">
<el-button size="small" @click="openTheCreateCruiseLineWindow(ruleFormRef)">创建</el-button>
</div>
<el-table :data="cameraCruisingHeartList" style="width: 100%">
<el-table-column prop="cruiseName" label="巡航线名称" width="180" />
<el-table-column prop="address" label="操作">
<template #default="scope">
<el-icon color="red" @click="deleteCameraCruiseLine(scope.row.channelId)">
<Delete />
</el-icon>
</template>
</el-table-column>
</el-table>
</el-collapse-item>
</el-collapse>
</div>
</div>
</template>
<template #footer>
<el-button @click="closepost">
<el-icon>
<DocumentDelete />
</el-icon>
关闭
</el-button>
</template>
</MOSTY.FromPage>
<el-dialog v-model="cameraHistoryWindow" title="视频抓图历史列表" width="70%">
<el-form :model="cameraHistoryWindowForm" label-width="auto" style="max-width: 600px">
<el-form-item label="开始时间">
<el-date-picker value-format="x" v-model="cameraHistoryWindowForm.startDate" type="datetime"
placeholder="请选择开始时间" />
</el-form-item>
<el-form-item label="结束时间" style="margin-left: 20px">
<el-date-picker value-format="x" v-model="cameraHistoryWindowForm.endDate" type="datetime"
placeholder="请选择结束时间" />
</el-form-item>
</el-form>
<div class="demo-image__preview" style="min-height: 300px">
<el-image v-for="item of cameraHistoryWindowImgList" style="width: 100px; height: 100px" :src="item"
:zoom-rate="1.2" :max-scale="2" :min-scale="0.2"
:preview-src-list="cameraHistoryWindowImgList" show-progress :initial-index="4" fit="cover" />
</div>
<el-pagination v-model:current-page="cameraHistoryWindowForm.currentPage4"
v-model:page-size="cameraHistoryWindowForm.pageSize"
:page-sizes="[10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper"
:total="cameraHistoryWindowForm.total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange" />
</el-dialog>
<el-dialog v-model="cruiseLineWindow" title="创建巡航线" width="60%">
<el-form ref="ruleFormRef" :rules="rules" status-icon
:model="patrolRouteFormObject" :hide-required-asterisk="true">
<el-row>
<el-col :span="12">
<el-form-item label="巡航线名称" :label-width="120" prop="cruiseName" :required="true">
<el-input v-model="patrolRouteFormObject.cruiseName" placeholder="巡航线名称" />
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="预制点选择" :label-width="120">
<span class="cruiseLine_item" v-for="(item, index) of listOfPreFabricatedCameraPoints"
:key="index" @click="selectPrefabricatedPoints(item)">{{ item["cruiseName"] }}</span>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="设置预制点" :label-width="120">
<div v-for="(item, index) of patrolRouteFormObject.prePointList" class="prefabricatedPointLabels"
:key="index">
<div class="cruiseLine_item_container">
<span class="cruiseLine_item">{{ item["cruiseName"] }}</span>
<el-icon class="del_icon" color="#d0cbcb" @click="deletePrefabricatedPoints(index)">
<CloseBold />
</el-icon>
</div>
<el-icon v-if="index < patrolRouteFormObject.prePointList.length -1 ">
<Right />
</el-icon>
</div>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="cruiseLineWindow = false">取消</el-button>
<el-button type="primary" @click="creationOfPatrolRoutes(ruleFormRef)">确认</el-button>
</div>
</template>
</el-dialog>
<el-dialog v-model="editCruiseLine" title="编辑预制点">
<el-form ref="ruleFormRef" :rules="rules" label-width="120px" class="demo-ruleForm">
<el-form-item label="预制点" prop="name">
<el-input />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="cruiseLineWindow = false">取消</el-button>
<el-button type="primary" @click="creationOfPatrolRoutes(ruleFormRef)">确认</el-button>
</div>
</template>
</el-dialog>
</template>
<style lang="scss" scoped>
@import "./style/index";
</style>
<script setup>
import { ref, getCurrentInstance, onMounted, nextTick, reactive } from "vue"
import * as MOSTY from "@/components/MyComponents/index"
import { ElMessage, ElMessageBox } from "element-plus"
import { getApi, postApi } from "@/api/tobAcco_api.js"
import "viewerjs/dist/viewer.css"
import { api as viewerApi } from "v-viewer"
const props = defineProps({
editObj: {
type: Object,
default: {}
}
})
const { proxy } = getCurrentInstance()
const emit = defineEmits(["saveSuccess", "update:modelValue"])
const lensSetup = ref(["变倍", "变焦", "光圈"])
const graphicOperation = ref(["抓图", "查询历史抓图", "截图视频"])
const functionalControl = ref(["灯光", "两刷", "红外"])
const activeNames = ref(["5"])
const splitScreenCount = ref(16)
const rules = reactive({ cruiseName: [{ required: true, message: "巡航线不能为空", trigger: "blur" }] })
const cameraList = ref([])
const videoLayout = ref([
{ name: "1X1", num: 1 },
{ name: "2X2", num: 2 },
{ name: "3X3", num: 3 },
{ name: "4X4", num: 4 }
])
const directionButton = reactive([
{ label: "上", key: "up", value: 1 },
{ label: "右上", key: "up-right", value: 7 },
{ label: "右", key: "right", value: 4 },
{ label: "右下", key: "down-right", value: 8 },
{ label: "下", key: "down", value: 2 },
{ label: "左下", key: "down-left", value: 6 },
{ label: "左", key: "left", value: 3 },
{ label: "左上", key: "up-left", value: 5 },
{ label: "中心", key: "center", value: 9 }]
)
let initialMonitoringOfContainersWidth = ref("")
let initialMonitoringOfContainersHeight = ref("")
let cameraIndex = ref(0)
let clickLayout = ref(3)
let cameraInformation = reactive({})
let cameraSelection = ref(0)
let cameraGraphicsOperationsIndex = ref("")
let editCruiseLine = ref(false)
let cameraHistoryWindow = ref(false)
let cameraHistoryWindowImgList = ref([])
let cameraCruisingHeartList = ref([])
let cameraControlObjects = reactive({ step: 4 })
let cameraDirectionControl = reactive({ stepX: 4, stepY: 4 })
let ruleFormRef = ref()
let listOfPreFabricatedCameraPoints = ref([])
let cruiseLineWindow = ref(false)
let patrolRouteFormObject = reactive({
cruiseName: "",
prePointList: []
})
let cameraHistoryWindowForm = reactive({
startDate: "",
endDate: "",
pageSize: 20,
currentPage4: 1,
total: 0
})
let hls = null
let channel_id = ""
onMounted(() => {
// 查询摄像头列表
getCameraList()
xInitializeCameraContainer()
})
/**
* 摄像头方向控制
* @param btn
* @param type
*/
const handleRegulate = async (btn, type) => {
cameraDirectionControl.command = !type ? 1 : 0
cameraDirectionControl.direct = btn.value
let data = await postApi(cameraDirectionControl, "/mosty-lps/daSdk/operateDirect")
}
/**
* 删除巡航路线
* @param item_id
*/
const deleteCameraCruiseLine = async (item_id) => {
let data = await postApi({ channelId: item_id }, "/mosty-lps/daSdk/deleteCruise")
}
/**
* 镜头控制
*/
const cameraOperations = async () => {
let data = await postApi(cameraControlObjects, "/mosty-lps/daSdk/operateCamera")
}
/**
* 摄像头定位
* @param data
*/
const cameraPositioning = (data) => {
}
/**
* 摄像头预设点修改
* @param data
*/
const cameraPrefabricationPointModification = (data) => {
}
/**
* \摄像头预设点删除
* @param data
*/
const cameraPreFabricatedPointDeletion = (data) => {
}
/**
* 创建预设点
*/
const createPrefabricatedPoints = () => {
ElMessageBox.prompt("输入预制点名称", "预制点创建", {
confirmButtonText: "确认",
cancelButtonText: "取消",
inputPattern: /\S/,
inputErrorMessage: "预制点名称不能为空"
})
.then(({ value }) => {
let data = {
presetPointCode: generateUniqueCode(listOfPreFabricatedCameraPoints.value),
operateType: 3,
presetPointName: value
}
cameraPreFabricationPointSetting(data)
})
.catch(() => ElMessage.info("取消创建"))
}
/**
* 开启创建巡航线窗口
* @param formEl
*/
const openTheCreateCruiseLineWindow = async (formEl) => {
cruiseLineWindow.value = true
if (patrolRouteFormObject.prePointList.length) patrolRouteFormObject.prePointList = []
await nextTick(() => {
if (!formEl) return
formEl.resetFields()
})
}
/**
* 选择预设点形成巡航线
* @param item
*/
const selectPrefabricatedPoints = (item) => patrolRouteFormObject.prePointList.push(item)
/**
* 删除巡航线中的预设点
* @param index
*/
const deletePrefabricatedPoints = (index) => patrolRouteFormObject.prePointList.splice(index, 1)
/**
* 生成唯一编码
* @param presetArray
* @returns {string}
*/
function generateUniqueCode(presetArray) {
const existingCodes = new Set(presetArray.map(item => item.presetPointCode))
let code
do {
const num = Math.floor(Math.random() * 256) + 1
code = num.toString().padStart(3, "0")
if (existingCodes.size >= 256) throw new Error("所有可能的编码都已被占用")
} while (existingCodes.has(code))
return code
}
/**
* 设置功能预制点
* @param data
*/
const cameraPreFabricationPointSetting = async (data) => {
await postApi({ ...data, channelId: channel_id }, "/mosty-lps/daSdk/operatePresetPoint")
ElMessage.success("创建成功")
await obtainPreFabricatedCameraPointsList(channel_id)
}
/**
* 创建巡航路线
* @param formEl
* @returns {Promise<void>}
*/
const creationOfPatrolRoutes = async (formEl) => {
if (!formEl) return
await formEl.validate(async (valid, fields) => {
if (valid) {
let response = await postApi({ ...patrolRouteFormObject, channelId: channel_id }, "/mosty-lps/daSdk/saveCruise")
console.log("submit!")
return
}
ElMessage.error("必填项校验不通过")
})
}
/**
* 获取巡航线
* @param itemId
*/
const obtainCruiseLine = async (itemId) => {
let data = await postApi({ channelId: itemId }, `/mosty-lps/daSdk/getCruises`)
if (data instanceof Array) cameraCruisingHeartList.value = data
console.log("巡航线", data)
}
/**
* 开始控制镜头
* @param index
* @param mark
*/
const startTheCameraOperation = (index, mark) => {
let operationType = new Map([[0, "1"], [1, "2"], [2, "3"]])
cameraControlObjects.operateType = operationType.get(index)
cameraControlObjects.direct = !mark ? 2 : 1
cameraControlObjects.command = 1
cameraOperations()
}
/**
* 结束控制镜头
*/
const endOfCameraControl = () => {
cameraControlObjects.command = 0
cameraOperations()
}
/**
* 图形画面操作
* @param index
*/
const cameraScreenOperation = (index) => {
cameraGraphicsOperationsIndex.value = index
let cameraOperationsList = new Map([
[0, captureImage],
[1, historicalSearchMap]
])
cameraOperationsList.get(index)()
}
/**
* 查询历史抓图
*/
const historicalSearchMap = async () => {
if (!cameraHistoryWindowForm.startDate.length && !cameraHistoryWindowForm.endDate.length) {
const timestamp = (timestamp = 0) => {
const now = new Date()
const midnightTomorrow = new Date(now.getFullYear(), now.getMonth(), now.getDate() + timestamp)
return midnightTomorrow.getTime() / 1000
}
cameraHistoryWindowForm.startDate = timestamp()
cameraHistoryWindowForm.endDate = timestamp(1)
}
let data = await postApi({
...cameraHistoryWindowForm,
channelId: [cameraHistoryWindowForm.channelId],
deviceCode: [cameraInformation.deviceCode]
}, `/mosty-lps/daSdk/getHistoryCapturePic`)
if (data instanceof Object) {
let imgList = []
data.records.forEach(item => imgList.push(item["capturePictureFront"]))
cameraHistoryWindow.value = true
cameraHistoryWindowImgList.value = imgList
cameraHistoryWindowForm.total = data.total
}
console.log("抓取历史记录", data)
}
/**
*
* @param value
*/
const handleSizeChange = (value) => cameraHistoryWindowForm.pageSize = value
/**
*
*/
const handleCurrentChange = () => historicalSearchMap()
/**
* 布局切换
* @param index
*/
const switchingLayout = (index) => {
clickLayout.value = index
nextTick(() => xInitializeCameraContainer())
}
/**
* 图像抓图
*/
const captureImage = async () => {
let response = await postApi(cameraInformation, "/mosty-lps/daSdk/capturePic")
if (response !== null) viewerApi({ images: [response] })
}
/**
* 查询摄像头列表
*/
const getCameraList = async () => {
cameraList.value = await getApi({}, `/mosty-jcgl/aqsbssZb/getList?zbid=${props.editObj.id}`)
await nextTick(() => initialCameraEquipment(cameraList.value[0]["sbbh"], "videoElement0"))
}
/**
* 选择左边的摄像头
* @param channelId
* @param index
* @returns {Promise<void>}
*/
const selectTheCameraPreview = async (channelId, index) => {
cameraSelection.value = index
cameraIndex.value = index
await initialCameraEquipment(channelId, "videoElement" + index)
}
/**
* 初始化视频容器
*/
const xInitializeCameraContainer = () => {
let element = document.getElementById("center_item")
initialMonitoringOfContainersWidth.value = element.clientWidth + "px"
initialMonitoringOfContainersHeight.value = element.clientHeight + "px"
}
/**
* 获取预置点
* @param id
*/
const obtainPreFabricatedCameraPointsList = async (item_id) => {
let data = await postApi({ channelId: item_id }, "/mosty-lps/daSdk/getPresetPoints")
if (data instanceof Array) listOfPreFabricatedCameraPoints.value = data
console.log("获取预制点", data)
}
/**
* 初始化摄像头设备
* @param channelId
* @param domId
*/
const initialCameraEquipment = async (channelId, domId) => {
cameraInformation.devChannel = channelId.slice(channelId.length - 1)
cameraInformation.deviceCode = props.editObj.sbbh
cameraHistoryWindowForm.channelId = channelId
cameraControlObjects.channelId = channelId
cameraDirectionControl.channelId = channelId
channel_id = channelId
if (hls !== null) hls.destroy()
const videoElement = document.getElementById(domId)
//调用Hls.isSupported()检查浏览器是否支持MSE
let data = await postApi({ channelId, "streamType": 1, type: "hls" }, "/mosty-lps/daSdk/realtime")
// 获取当前摄像头的预制点
await obtainCruiseLine(channelId)
await obtainPreFabricatedCameraPointsList(channelId)
if (proxy?.$Hls.isSupported()) {
hls = new Hls()
hls.attachMedia(videoElement)
hls.on(Hls.Events.MEDIA_ATTACHED, async () => {
hls.loadSource(data)
hls.on(Hls.Events.MANIFEST_PARSED, () => videoElement.play())
})
return
} else if (videoElement.canPlayType("application/vnd.apple.mpegurl")) {
// 如果支持原生播放
videoElement.src = data
videoElement.addEventListenter("canplay", () => videoElement.play())
return
}
ElMessage.error("当前环境不支持初始化")
}
function closePost() {
if (props.editObj.saveBtnShow) {
proxy.$modal.confirm("离开会丢失页面中修改的内容，确认离开吗？").then(() => {
emit("changePage", "Main")
})
} else {
emit("changePage", "Main")
}
}
const handleChange = (val) => {
console.log(val)
}
</script>

238
src/views/lps/yjsb/videoPlay/style/index.scss Normal file
View File

@ -0,0 +1,238 @@
.main {
width: 100%;
height: 100%;
display: flex;
align-items: center;
.left {
height: 100%;
width: 300px;
position: relative;
border-right: 1px solid gray;
.actionSheet {
width: 100%;
position: absolute;
left: 0;
bottom: 0;
}
.clickLayout {
color: #10c996;
}
}
.center {
height: 100%;
width: calc(100% - 600px);
overflow: hidden;
> div {
border-bottom: 1px solid rgba(128, 128, 128, 0.4);
border-right: 1px solid rgba(128, 128, 128, 0.4);
width: 33%;
height: 33%;
display: inline-block;
vertical-align: middle;
}
}
.right {
height: 100%;
width: 300px;
border-left: 1px solid gray;
}
.headerMessage {
color: black;
font-size: 14px;
line-height: 30px;
}
.nameItem {
width: 80px;
line-height: 28px;
border: 1px solid #c5bebe;
border-radius: 6px;
display: inline-block;
margin-right: 16px;
margin-bottom: 10px;
text-align: center;
}
.nameItem:nth-child(3) {
margin-right: 0;
}
.lensContainer {
padding: 10px;
box-sizing: border-box;
}
:deep(.el-collapse-item__header) {
background: transparent !important;
}
:deep(.el-collapse-item__content ) {
padding-bottom: 0px !important;
}
.name {
color: rgba(0, 0, 0, 0.6);
cursor: pointer;
padding: 0 10px;
> span {
line-height: 28px;
}
}
.controller {
margin: 20px auto;
position: relative;
width: 200px;
height: 200px;
display: flex;
justify-content: center;
align-items: center;
transform: rotate(22deg);
box-shadow: var(--panel-head-box-shadow);
border-radius: 50%;
z-index: 9;
.sector {
width: 194px;
height: 194px;
background-color: #f6f4f4;
clip-path: polygon(50% 50%, 100% 50%, 100% 3%);
border-radius: 50%;
position: absolute;
cursor: pointer;
&:hover {
background-color: var(--core-hover-color);
}
.el-icon {
position: absolute;
right: 20px;
top: 63px;
transform: rotate(-200deg);
}
}
/* 各个方向的扇形按钮 */
.up {
transform: rotate(270deg);
}
.right {
transform: rotate(0deg);
.el-icon {
transform: rotate(-202deg);
}
}
.down-right {
transform: rotate(45deg);
}
.down {
transform: rotate(90deg);
.el-icon {
transform: rotate(-204deg);
}
}
.down-left {
transform: rotate(135deg);
}
.left {
transform: rotate(180deg);
.el-icon {
transform: rotate(-200deg);
}
}
.up-left {
transform: rotate(225deg);
}
.up {
transform: rotate(270deg);
}
.up-right {
transform: rotate(315deg);
}
/* 中心的圆形空心区域 */
.center {
position: absolute;
transform: translate(-50%, -50%); /* 将中心定位到控制器的中心 */
width: 65px;
height: 65px;
top: 100px;
left: 100px;
background-color: var(--core-button-normal-bg-color);
border: 1px solid var(--core-border-color);
border-radius: 50%;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
z-index: 10; /* 确保中心区域在其他扇形之上 */
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
&:hover {
background-color: var(--core-hover-color);
}
}
}
.active_video {
border-color: #10c996 !important;
}
.empty {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
}
.cruiseLine_item{
padding: 0 14px;
margin-left: 8px;
border-radius: 8px;
cursor: pointer;
border: 1px solid #eeeaea;
}
.cruiseLine_item_container{
position: relative;
}
.del_icon{
position: absolute;
right: -4px;
top: -4px;
cursor: pointer;
}
.prefabricatedPointLabels{
display: flex;
align-items: center;
}
.cruiseLine_item_container>span{
margin-left: 0;
padding: 4px 10px;
}

682
src/views/systemConfig/postManage/index.vue
View File

@ -1,341 +1,341 @@
<template>
<MOSTY.PageTree :pageTitle="'职务管理'" :isShowLeftTree="false">
<template #serach>
<el-divider />
<section class="query-flex" ref="queryHeight">
<section class="query-section">
<section class="flex">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWDJ" :placeholder='"请选择职务等级"' v-model="listQuery.dutyLevel"
selectType="select" style="width: 250px;" />
<MOSTY.DictRidioAndSelect class="ml12" :placeholder='"请选择职务类型"' :dictData="D_TB_ZWLX"
v-model="listQuery.dutyType" selectType="select" style="width: 250px;" />
<el-input class="ml12" placeholder="请输入职务编号" v-model="listQuery.dutyCode" clearable
style='width:250px'></el-input>
</section>
<section v-if="isOpen" class="mt12">
<el-input placeholder="请输入职务名称" v-model="listQuery.dutyName" style='width:250px' clearable></el-input>
</section>
</section>
<div class="query-btn">
<div class="toggle" :class="{ active: isOpen }" @click="handleClickOpen">
<span>{{ isOpen ? "收起" : "展开" }}筛选</span>
<el-icon>
<DArrowLeft />
</el-icon>
</div>
<el-button @click="handleFilter" class="ml6">
<el-icon>
<Search />
</el-icon>查询</el-button>
<el-button @click="reset">
<el-icon>
<Refresh />
</el-icon>重置</el-button>
</div>
</section>
<el-divider />
<div class="btnBox">
<el-button type="primary" @click="addUserHander">
<el-icon>
<CirclePlus />
</el-icon>
<span>新增</span>
</el-button>
</div>
</template>
<template #table>
<div :style="{ 'height': totalHeight }">
<MOSTY.Table :table-columns="tableColumn" :tableData="tableData" :tableloading="tableLoading" :isSelect="false"
:isSort="false" @SortChange="SortChange" style="width: 100%;" :actionsW='260'>
<template #dutyLevel="{ row }">
<dict-tag :options="D_TB_ZWDJ" :value="row.dutyLevel" :tag="false" />
</template>
<template #dutyType="{ row }">
<dict-tag :options="D_TB_ZWLX" :value="row.dutyType" :tag="false" />
</template>
<template #actions="{ row }">
<span class="operedit" @click="clickEdit(row)">
<el-icon>
<EditPen />
</el-icon>编辑
</span>
<el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要删除?"
@confirm="deldete(row)">
<template #reference>
<span class="operdel" size="small"><el-icon>
<Delete />
</el-icon>删除</span>
</template>
</el-popconfirm>
</template>
</MOSTY.Table>
<div class="fenye">
<MOSTY.Pages :pageConfiger="listQuery" @changeNo="handleCurrentChange" @changeSize="handleSizeChange">
</MOSTY.Pages>
</div>
</div>
</template>
</MOSTY.PageTree>
<el-dialog v-model="dialogVisible" :title="pageData.fromObj.id ? '修改' : '新增'" :before-close="closeDialog"
width="700px" append-to-body>
<el-form class="mosty-from-wrap" ref="ruleFormRef" label-width="130px" :model="pageData.fromObj" :inline="true"
:rules="rules" style="flex-wrap: wrap;">
<el-form-item label="职务等级:" style="width: 100%;" prop="dutyCode">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWDJ" v-model="pageData.fromObj.dutyLevel" />
</el-form-item>
<el-form-item label="职务类型:" style="width: 100%;" prop="dutyCode">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWLX" v-model="pageData.fromObj.dutyType" />
</el-form-item>
<el-form-item label="职务编号:" style="width: 100%;" prop="dutyCode">
<el-input v-model="pageData.fromObj.dutyCode" clearable placeholder="请输入职务编号" />
</el-form-item>
<el-form-item label="职务名称:" prop="dutyName" style="width: 100%;">
<el-input v-model="pageData.fromObj.dutyName" clearable placeholder="请输入职务名称" />
</el-form-item>
<el-form-item label="职务描述:" style="width: 100%;">
<el-input v-model="pageData.fromObj.dutyDesc" clearable placeholder="请输入职务描述" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="savefrom(ruleFormRef)" :loading="addLoading"> <el-icon>
<DocumentChecked />
</el-icon>
<span>保存</span></el-button>
<el-button @click="closeDialog"> <el-icon>
<DocumentDelete />
</el-icon>
<span>关闭</span></el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import {
ref,
nextTick,
onMounted,
getCurrentInstance,
reactive
} from "vue";
const { proxy } = getCurrentInstance();
const { D_TB_ZWDJ, D_TB_ZWLX } = proxy.$dict("D_TB_ZWDJ", "D_TB_ZWLX")
const queryHeight = ref(null); // 搜索盒子
const tableHeight = ref(); // 表格高度
const dialogVisible = ref(false)
const totalHeight = ref(null)
const tableLoading = ref(false)
const isOpen = ref(false);
const tableColumn = ref([
{
title: "职务等级",
prop: "dutyLevel",
slot: true
},
{
title: "职务类型",
prop: "dutyType",
slot: true
},
{
title: "职务编号",
prop: "dutyCode",
},
{
title: "职务名称",
prop: "dutyName",
},
{
title: "职务描述",
prop: "dutyDesc",
},
{
title: "采集时间",
prop: "xtCjsj",
slot: true
},
{
title: "操作",
prop: "actions",
fixed: 'right',
slot: true
}
])
const addLoading = ref(false)
const rules = ref({
dutyCode: [{ required: true, message: "请输入职务编号", trigger: "blur" }],
dutyName: [{ required: true, message: "请输入职务名称", trigger: "blur" }],
dutyDesc: [{ required: true, message: "请输入职务描述", trigger: "blur" }],
});
const ruleFormRef = ref()
//查询参数
const listQuery = ref({
pageCurrent: 1,
pageSize: 10,
total: 0
});
const pageData = reactive({
fromObj: {}
})
// 数据相关
const tableData = ref([]);
const handleClickOpen = () => {
isOpen.value = !isOpen.value
nextTick(() => {
if (isOpen.value) {
totalHeight.value = `calc(100vh - ${338 + queryHeight.value.offsetHeight}px)`
return
}
totalHeight.value = `calc(100vh - 370px)`
})
}
onMounted(() => {
nextTick(() => {
totalHeight.value = `calc(100vh - ${338 + queryHeight.value.offsetHeight}px)`
})
getListData()
});
// 获取数据的方法
const getListData = async () => {
tableLoading.value = true
listQuery.value.size = listQuery.value.pageSize
listQuery.value.current = listQuery.value.pageCurrent
getApi(listQuery.value, "/mosty-base/sysDuty/selectDutyPage").then(res => {
if (res) {
listQuery.value.total = res.total
tableData.value = res?.records;
}
}).finally(() => {
tableLoading.value = false
})
};
//
const reset = () => {
listQuery.value = {
pageCurrent: 1,
pageSize: 10,
};
getListData();
};
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const addUserHander = (row) => {
pageData.fromObj = {};
dialogVisible.value = true;
};
//新增人员
const savefrom = (elform) => {
addLoading.value = true
elform.validate((valid) => {
if (valid) {
let url = "/mosty-base/sysDuty/addSysDuty"
if (pageData.fromObj.id) url = "/mosty-base/sysDuty/updateSysDuty"
postApi(pageData.fromObj, url).then(res => {
proxy.$message.success("成功")
getListData()
}).finally(() => {
addLoading.value = false
dialogVisible.value = false;
})
} else {
return false;
}
});
};
function closeDialog() {
proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
.then(() => {
dialogVisible.value = false;
})
.catch(() => {
// catch error
})
}
const clickEdit = (row) => {
pageData.fromObj = row
dialogVisible.value = true
}
const deldete = (row) => {
postApi({}, `/mosty-base/sysDuty/delDutyById/${row.id}`).then(res => {
proxy.$message.success("成功")
getListData()
})
};
</script>
<style lang="scss" scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";
.query-flex {
display: flex;
justify-content: space-between;
.query-section {
width: 68%;
}
.query-btn {
width: 250px;
display: flex;
justify-content: flex-end;
.toggle {
height: 32px;
cursor: pointer;
display: flex;
align-items: center;
color: #0f3916;
.el-icon {
transform: rotate(90deg);
transition: all 0.25s ease;
}
&.active {
.el-icon {
transform: rotate(-90deg);
}
}
}
}
}
.btnBox {
display: flex;
align-items: center;
justify-content: flex-end;
margin: 12px 0;
}
.treeBox {
overflow: auto;
}
::v-deep .el-form {
flex-wrap: wrap;
}
</style>
<template>
<MOSTY.PageTree :pageTitle="'职务管理'" :isShowLeftTree="false">
<template #serach>
<el-divider />
<section class="query-flex" ref="queryHeight">
<section class="query-section">
<section class="flex">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWDJ" :placeholder='"请选择职务等级"' v-model="listQuery.dutyLevel"
selectType="select" style="width: 250px;" />
<MOSTY.DictRidioAndSelect class="ml12" :placeholder='"请选择职务类型"' :dictData="D_TB_ZWLX"
v-model="listQuery.dutyType" selectType="select" style="width: 250px;" />
<el-input class="ml12" placeholder="请输入职务编号" v-model="listQuery.dutyCode" clearable
style='width:250px'></el-input>
</section>
<section v-if="isOpen" class="mt12">
<el-input placeholder="请输入职务名称" v-model="listQuery.dutyName" style='width:250px' clearable></el-input>
</section>
</section>
<div class="query-btn">
<div class="toggle" :class="{ active: isOpen }" @click="handleClickOpen">
<span>{{ isOpen ? "收起" : "展开" }}筛选</span>
<el-icon>
<DArrowLeft />
</el-icon>
</div>
<el-button @click="handleFilter" class="ml6">
<el-icon>
<Search />
</el-icon>查询</el-button>
<el-button @click="reset">
<el-icon>
<Refresh />
</el-icon>重置</el-button>
</div>
</section>
<el-divider />
<div class="btnBox">
<el-button type="primary" @click="addUserHander">
<el-icon>
<CirclePlus />
</el-icon>
<span>新增</span>
</el-button>
</div>
</template>
<template #table>
<div :style="{ 'height': totalHeight }">
<MOSTY.Table :table-columns="tableColumn" :tableData="tableData" :tableloading="tableLoading" :isSelect="false"
:isSort="false" @SortChange="SortChange" style="width: 100%;" :actionsW='260'>
<template #dutyLevel="{ row }">
<dict-tag :options="D_TB_ZWDJ" :value="row.dutyLevel" :tag="false" />
</template>
<template #dutyType="{ row }">
<dict-tag :options="D_TB_ZWLX" :value="row.dutyType" :tag="false" />
</template>
<template #actions="{ row }">
<span class="operedit" @click="clickEdit(row)">
<el-icon>
<EditPen />
</el-icon>编辑
</span>
<el-popconfirm confirm-button-text="是" cancel-button-text="否" icon-color="red" title="确定要删除?"
@confirm="deldete(row)">
<template #reference>
<span class="operdel" size="small"><el-icon>
<Delete />
</el-icon>删除</span>
</template>
</el-popconfirm>
</template>
</MOSTY.Table>
<div class="fenye">
<MOSTY.Pages :pageConfiger="listQuery" @changeNo="handleCurrentChange" @changeSize="handleSizeChange">
</MOSTY.Pages>
</div>
</div>
</template>
</MOSTY.PageTree>
<el-dialog v-model="dialogVisible" :title="pageData.fromObj.id ? '修改' : '新增'" :before-close="closeDialog"
width="700px" append-to-body>
<el-form class="mosty-from-wrap" ref="ruleFormRef" label-width="130px" :model="pageData.fromObj" :inline="true"
:rules="rules" style="flex-wrap: wrap;">
<el-form-item label="职务等级:" style="width: 100%;" prop="dutyCode">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWDJ" v-model="pageData.fromObj.dutyLevel" />
</el-form-item>
<el-form-item label="职务类型:" style="width: 100%;" prop="dutyCode">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWLX" v-model="pageData.fromObj.dutyType" />
</el-form-item>
<el-form-item label="职务编号:" style="width: 100%;" prop="dutyCode">
<el-input v-model="pageData.fromObj.dutyCode" clearable placeholder="请输入职务编号" />
</el-form-item>
<el-form-item label="职务名称:" prop="dutyName" style="width: 100%;">
<el-input v-model="pageData.fromObj.dutyName" clearable placeholder="请输入职务名称" />
</el-form-item>
<el-form-item label="职务描述:" style="width: 100%;">
<el-input v-model="pageData.fromObj.dutyDesc" clearable placeholder="请输入职务描述" />
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="savefrom(ruleFormRef)" :loading="addLoading"> <el-icon>
<DocumentChecked />
</el-icon>
<span>保存</span></el-button>
<el-button @click="closeDialog"> <el-icon>
<DocumentDelete />
</el-icon>
<span>关闭</span></el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import {
ref,
nextTick,
onMounted,
getCurrentInstance,
reactive
} from "vue";
const { proxy } = getCurrentInstance();
const { D_TB_ZWDJ, D_TB_ZWLX } = proxy.$dict("D_TB_ZWDJ", "D_TB_ZWLX")
const queryHeight = ref(null); // 搜索盒子
const tableHeight = ref(); // 表格高度
const dialogVisible = ref(false)
const totalHeight = ref(null)
const tableLoading = ref(false)
const isOpen = ref(false);
const tableColumn = ref([
{
title: "职务等级",
prop: "dutyLevel",
slot: true
},
{
title: "职务类型",
prop: "dutyType",
slot: true
},
{
title: "职务编号",
prop: "dutyCode",
},
{
title: "职务名称",
prop: "dutyName",
},
{
title: "职务描述",
prop: "dutyDesc",
},
{
title: "采集时间",
prop: "xtCjsj",
slot: true
},
{
title: "操作",
prop: "actions",
fixed: 'right',
slot: true
}
])
const addLoading = ref(false)
const rules = ref({
dutyCode: [{ required: true, message: "请输入职务编号", trigger: "blur" }],
dutyName: [{ required: true, message: "请输入职务名称", trigger: "blur" }],
dutyDesc: [{ required: true, message: "请输入职务描述", trigger: "blur" }],
});
const ruleFormRef = ref()
//查询参数
const listQuery = ref({
pageCurrent: 1,
pageSize: 10,
total: 0
});
const pageData = reactive({
fromObj: {}
})
// 数据相关
const tableData = ref([]);
const handleClickOpen = () => {
isOpen.value = !isOpen.value
nextTick(() => {
if (isOpen.value) {
totalHeight.value = `calc(100vh - ${338 + queryHeight.value.offsetHeight}px)`
return
}
totalHeight.value = `calc(100vh - 370px)`
})
}
onMounted(() => {
nextTick(() => {
totalHeight.value = `calc(100vh - ${338 + queryHeight.value.offsetHeight}px)`
})
getListData()
});
// 获取数据的方法
const getListData = async () => {
tableLoading.value = true
listQuery.value.size = listQuery.value.pageSize
listQuery.value.current = listQuery.value.pageCurrent
getApi(listQuery.value, "/mosty-base/sysDuty/selectDutyPage").then(res => {
if (res) {
listQuery.value.total = res.total
tableData.value = res?.records;
}
}).finally(() => {
tableLoading.value = false
})
};
//
const reset = () => {
listQuery.value = {
pageCurrent: 1,
pageSize: 10,
};
getListData();
};
const handleFilter = () => {
listQuery.value.pageCurrent = 1;
getListData();
};
const handleSizeChange = (currentSize) => {
listQuery.value.pageSize = currentSize;
getListData();
};
const handleCurrentChange = (currentPage) => {
listQuery.value.pageCurrent = currentPage;
getListData();
};
const addUserHander = (row) => {
pageData.fromObj = {};
dialogVisible.value = true;
};
//新增人员
const savefrom = (elform) => {
addLoading.value = true
elform.validate((valid) => {
if (valid) {
let url = "/mosty-base/sysDuty/addSysDuty"
if (pageData.fromObj.id) url = "/mosty-base/sysDuty/updateSysDuty"
postApi(pageData.fromObj, url).then(res => {
proxy.$message.success("成功")
getListData()
}).finally(() => {
addLoading.value = false
dialogVisible.value = false;
})
} else {
return false;
}
});
};
function closeDialog() {
proxy.$modal.confirm('离开会丢失页面中修改的内容，确认离开吗？')
.then(() => {
dialogVisible.value = false;
})
.catch(() => {
// catch error
})
}
const clickEdit = (row) => {
pageData.fromObj = row
dialogVisible.value = true
}
const deldete = (row) => {
postApi({}, `/mosty-base/sysDuty/delDutyById/${row.id}`).then(res => {
proxy.$message.success("成功")
getListData()
})
};
</script>
<style lang="scss" scoped>
@import "~@/assets/css/layout.scss";
@import "~@/assets/css/element-plus.scss";
.query-flex {
display: flex;
justify-content: space-between;
.query-section {
width: 68%;
}
.query-btn {
width: 250px;
display: flex;
justify-content: flex-end;
.toggle {
height: 32px;
cursor: pointer;
display: flex;
align-items: center;
color: #0f3916;
.el-icon {
transform: rotate(90deg);
transition: all 0.25s ease;
}
&.active {
.el-icon {
transform: rotate(-90deg);
}
}
}
}
}
.btnBox {
display: flex;
align-items: center;
justify-content: flex-end;
margin: 12px 0;
}
.treeBox {
overflow: auto;
}
::v-deep .el-form {
flex-wrap: wrap;
}
</style>

224
src/views/systemConfig/user-list/components/Gwxz.vue
View File

@ -1,113 +1,113 @@
<template>
<!-- 岗位选择 -->
<el-dialog v-model="props.modelValue" title="岗位选择" :before-close="cancel" width="50%">
<MOSTY.Table :table-columns="pageData.tableColumn2" :tableData="pageData.tableData" :tableloading="tableloading"
:isSelect="false" :isSort="true" actionsW="100">
<template #grade="{ row }">
<dict-tag v-if="row.grade" :options="KHLX" :value="row.grade" :tag="false" />
<span v-else>无</span>
</template>
<template #assignLv="{ row }">
<dict-tag v-if="row.assignLv" :options="GWSYFY" :value="row.assignLv" :tag="false" />
<span v-else>无</span>
</template>
<!-- 操作 -->
<template #actions="{ row }">
<span class="operedit" @click="submitRy(row)">
<el-icon>
<Edit />
</el-icon>选择</span>
</template>
</MOSTY.Table>
<div class="flex just-center">
<MOSTY.Pages :pageConfiger="pageData.pageConfiger" @changeNo="changeNo" @changeSize="changeSize" />
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="cancel">取消</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { ref, defineProps, defineEmits, reactive, getCurrentInstance, onMounted } from "vue"
import { postApi } from "@/api/tobAcco_api.js";
const tableloading = ref(false)
const props = defineProps({
modelValue: Boolean
})
const emits = defineEmits(["update:modelValue", "change"])
const { proxy } = getCurrentInstance();
const { KHLX, GWSYFY } = proxy.$dict("KHLX", "GWSYFY");
const pageData = reactive({
tableData: [],
pageConfiger: {
pageSize: 10,
pageCurrent: 1,
total: 0
},
// 人员列表参数
tableConfiger: {
showIndex: false,
loading: false,
height: 500
},
// 岗位列表table
tableColumn2: [
{
label: "考核岗位名称",
prop: "name",
},
{
label: "岗位分类",
prop: "grade",
slot: true,
},
{
label: "适用范围",
prop: "assignLv",
slot: true,
},
{
title: "操作",
prop: "actions",
slot: true
}
],
})
onMounted(() => {
getTableData2()
})
const cancel = () => {
emits("update:modelValue", false)
}
// 获取岗位列表数据
const getTableData2 = () => {
tableloading.value = true;
postApi(pageData.pageConfiger, `/mosty-jcgl/station/listPageStationByLv`).then((res) => {
if (res.records) {
pageData.tableData = res.records;
tableloading.value = false;
pageData.pageConfiger.total = res.total;
} else {
pageData.tableData = [];
tableloading.value = false;
}
});
};
// 选中岗位
const submitRy = (row) => {
emits("change", row)
};
//分页
const changeNo = (val) => {
pageData.pageConfiger.pageCurrent = val;
getTableData2();
};
const changeSize = (val) => {
pageData.pageConfiger.pageSize = val;
getTableData2();
};
<template>
<!-- 岗位选择 -->
<el-dialog v-model="props.modelValue" title="岗位选择" :before-close="cancel" width="50%">
<MOSTY.Table :table-columns="pageData.tableColumn2" :tableData="pageData.tableData" :tableloading="tableloading"
:isSelect="false" :isSort="true" actionsW="100">
<template #grade="{ row }">
<dict-tag v-if="row.grade" :options="KHLX" :value="row.grade" :tag="false" />
<span v-else>无</span>
</template>
<template #assignLv="{ row }">
<dict-tag v-if="row.assignLv" :options="GWSYFY" :value="row.assignLv" :tag="false" />
<span v-else>无</span>
</template>
<!-- 操作 -->
<template #actions="{ row }">
<span class="operedit" @click="submitRy(row)">
<el-icon>
<Edit />
</el-icon>选择</span>
</template>
</MOSTY.Table>
<div class="flex just-center">
<MOSTY.Pages :pageConfiger="pageData.pageConfiger" @changeNo="changeNo" @changeSize="changeSize" />
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="cancel">取消</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { ref, defineProps, defineEmits, reactive, getCurrentInstance, onMounted } from "vue"
import { postApi } from "@/api/tobAcco_api.js";
const tableloading = ref(false)
const props = defineProps({
modelValue: Boolean
})
const emits = defineEmits(["update:modelValue", "change"])
const { proxy } = getCurrentInstance();
const { KHLX, GWSYFY } = proxy.$dict("KHLX", "GWSYFY");
const pageData = reactive({
tableData: [],
pageConfiger: {
pageSize: 10,
pageCurrent: 1,
total: 0
},
// 人员列表参数
tableConfiger: {
showIndex: false,
loading: false,
height: 500
},
// 岗位列表table
tableColumn2: [
{
label: "考核岗位名称",
prop: "name",
},
{
label: "岗位分类",
prop: "grade",
slot: true,
},
{
label: "适用范围",
prop: "assignLv",
slot: true,
},
{
title: "操作",
prop: "actions",
slot: true
}
],
})
onMounted(() => {
getTableData2()
})
const cancel = () => {
emits("update:modelValue", false)
}
// 获取岗位列表数据
const getTableData2 = () => {
tableloading.value = true;
postApi(pageData.pageConfiger, `/mosty-jcgl/station/listPageStationByLv`).then((res) => {
if (res.records) {
pageData.tableData = res.records;
tableloading.value = false;
pageData.pageConfiger.total = res.total;
} else {
pageData.tableData = [];
tableloading.value = false;
}
});
};
// 选中岗位
const submitRy = (row) => {
emits("change", row)
};
//分页
const changeNo = (val) => {
pageData.pageConfiger.pageCurrent = val;
getTableData2();
};
const changeSize = (val) => {
pageData.pageConfiger.pageSize = val;
getTableData2();
};
</script>

244
src/views/systemConfig/user-list/components/Zwxz.vue
View File

@ -1,123 +1,123 @@
<template>
<!-- 职务选择 -->
<el-dialog v-model="props.modelValue" title="职务选择" :before-close="cancel" width="50%">
<div class="searchBox" ref="searchBox">
<el-form :model="pageData.pageConfiger" class="mosty-from-wrap" :inline="true">
<el-form-item label="职务等级">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWDJ" v-model="pageData.pageConfiger.dutyLevel"
selectType="select" />
</el-form-item>
<el-form-item label="职务类型">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWLX" v-model="pageData.pageConfiger.dutyType"
selectType="select" />
</el-form-item>
<el-form-item label="职务名称:">
<el-input placeholder="请输入职务编号" v-model="pageData.pageConfiger.dutyName" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getTableData2()">查询</el-button>
<el-button type="primary" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
</div>
<MOSTY.Table :table-columns="pageData.tableColumn2" :tableData="pageData.tableData" :tableloading="tableloading"
:isSelect="true" :isSort="false">
<template #actions="{ row }">
<span class="operedit" @click="submitRy(row)">
<el-icon>
<Edit />
</el-icon>选择</span>
</template>
</MOSTY.Table>
<div class="flex just-center">
<MOSTY.Pages :pageConfiger="pageData.pageConfiger" @changeNo="changeNo" @changeSize="changeSize">
</MOSTY.Pages>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="cancel">取消</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { ref, defineProps, defineEmits, reactive, getCurrentInstance, onMounted } from "vue"
import { getApi } from "@/api/tobAcco_api.js";
const tableloading = ref(false)
const props = defineProps({
modelValue: Boolean
})
const emits = defineEmits(["update:modelValue", "change"])
const { proxy } = getCurrentInstance();
const { D_TB_ZWDJ, D_TB_ZWLX } = proxy.$dict("D_TB_ZWDJ", "D_TB_ZWLX")
const pageData = reactive({
tableData: [],
pageConfiger: {
size: 10,
current: 1,
total: 0
},
// 人员列表参数
tableConfiger: {
showIndex: false,
loading: false,
height: 450
},
// 岗位列表table
tableColumn2: [
{
label: "职务编号",
prop: "dutyCode",
},
{
label: "职务名称",
prop: "dutyName",
},
{
label: "职务描述",
prop: "dutyDesc",
},
{
title: "操作",
prop: "actions",
slot: true
}
],
})
onMounted(() => {
getTableData2()
})
const cancel = () => {
emits("update:modelValue", false)
}
// 获取岗位列表数据
const getTableData2 = () => {
tableloading.value = true;
getApi(pageData.pageConfiger, `/mosty-base/sysDuty/selectDutyPage`).then((res) => {
if (res.records) {
pageData.tableData = res.records;
tableloading.value = false;
pageData.pageConfiger.total = res.total;
} else {
pageData.tableData = [];
tableloading.value = false;
}
});
};
// 选中岗位s
const submitRy = (row) => {
emits("change", row)
};
//分页
const changeNo = (val) => {
pageData.pageConfiger.current = val;
getTableData2();
};
const changeSize = (val) => {
pageData.pageConfiger.size = val;
getTableData2();
};
<template>
<!-- 职务选择 -->
<el-dialog v-model="props.modelValue" title="职务选择" :before-close="cancel" width="50%">
<div class="searchBox" ref="searchBox">
<el-form :model="pageData.pageConfiger" class="mosty-from-wrap" :inline="true">
<el-form-item label="职务等级">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWDJ" v-model="pageData.pageConfiger.dutyLevel"
selectType="select" />
</el-form-item>
<el-form-item label="职务类型">
<MOSTY.DictRidioAndSelect :dictData="D_TB_ZWLX" v-model="pageData.pageConfiger.dutyType"
selectType="select" />
</el-form-item>
<el-form-item label="职务名称:">
<el-input placeholder="请输入职务编号" v-model="pageData.pageConfiger.dutyName" clearable></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getTableData2()">查询</el-button>
<el-button type="primary" @click="reset()"> 重置 </el-button>
</el-form-item>
</el-form>
</div>
<MOSTY.Table :table-columns="pageData.tableColumn2" :tableData="pageData.tableData" :tableloading="tableloading"
:isSelect="true" :isSort="false">
<template #actions="{ row }">
<span class="operedit" @click="submitRy(row)">
<el-icon>
<Edit />
</el-icon>选择</span>
</template>
</MOSTY.Table>
<div class="flex just-center">
<MOSTY.Pages :pageConfiger="pageData.pageConfiger" @changeNo="changeNo" @changeSize="changeSize">
</MOSTY.Pages>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="cancel">取消</el-button>
</span>
</template>
</el-dialog>
</template>
<script setup>
import * as MOSTY from "@/components/MyComponents/index";
import { ref, defineProps, defineEmits, reactive, getCurrentInstance, onMounted } from "vue"
import { getApi } from "@/api/tobAcco_api.js";
const tableloading = ref(false)
const props = defineProps({
modelValue: Boolean
})
const emits = defineEmits(["update:modelValue", "change"])
const { proxy } = getCurrentInstance();
const { D_TB_ZWDJ, D_TB_ZWLX } = proxy.$dict("D_TB_ZWDJ", "D_TB_ZWLX")
const pageData = reactive({
tableData: [],
pageConfiger: {
size: 10,
current: 1,
total: 0
},
// 人员列表参数
tableConfiger: {
showIndex: false,
loading: false,
height: 450
},
// 岗位列表table
tableColumn2: [
{
label: "职务编号",
prop: "dutyCode",
},
{
label: "职务名称",
prop: "dutyName",
},
{
label: "职务描述",
prop: "dutyDesc",
},
{
title: "操作",
prop: "actions",
slot: true
}
],
})
onMounted(() => {
getTableData2()
})
const cancel = () => {
emits("update:modelValue", false)
}
// 获取岗位列表数据
const getTableData2 = () => {
tableloading.value = true;
getApi(pageData.pageConfiger, `/mosty-base/sysDuty/selectDutyPage`).then((res) => {
if (res.records) {
pageData.tableData = res.records;
tableloading.value = false;
pageData.pageConfiger.total = res.total;
} else {
pageData.tableData = [];
tableloading.value = false;
}
});
};
// 选中岗位s
const submitRy = (row) => {
emits("change", row)
};
//分页
const changeNo = (val) => {
pageData.pageConfiger.current = val;
getTableData2();
};
const changeSize = (val) => {
pageData.pageConfiger.size = val;
getTableData2();
};
</script>