|
@@ -0,0 +1,529 @@
|
|
|
+<template>
|
|
|
+ <u-sticky bgColor="#fff" style="box-shadow: 1px 1px 4px rgb(26 26 26 / 10%)">
|
|
|
+ <u-tabs :list="list" @click="tabsClick" :current="current" :scrollable="false"></u-tabs>
|
|
|
+ </u-sticky>
|
|
|
+
|
|
|
+ <view class="needMatter" @touchstart="fingerstart" @touchend="fingerend" style="background-color: #f7f7f7">
|
|
|
+ <view class="content">
|
|
|
+ <!-- <view style="text-align: center; color: rgb(189, 189, 189); font-size: 14px" v-if="!dataRes">暂无数据</view>
|
|
|
+ <view v-else>
|
|
|
+ <u-row v-for="po in classifyData" :key="po">
|
|
|
+ <u-col span="4">
|
|
|
+ <view style="text-align: right; padding: 0px 5px 0px 5px">{{ po.title }}</view>
|
|
|
+ </u-col>
|
|
|
+ <u-col span="8">
|
|
|
+ <view style="text-align: left; padding: 0px 5px 0px 5px">{{ po.value }}</view>
|
|
|
+ </u-col>
|
|
|
+ </u-row>
|
|
|
+ </view> -->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { onReady, onLoad, onShow, onNavigationBarButtonTap } from "@dcloudio/uni-app";
|
|
|
+import { ref, onMounted, inject, shallowRef, reactive, watchEffect, getCurrentInstance } from "vue";
|
|
|
+import publicStore from "@/store/modules/public";
|
|
|
+
|
|
|
+import { dataList } from "@/api/business/mhxf/informationSelect";
|
|
|
+
|
|
|
+const { proxy } = getCurrentInstance();
|
|
|
+
|
|
|
+const publicStores = publicStore(); //全局公共Store
|
|
|
+
|
|
|
+const current = ref(0);
|
|
|
+const classifyUrl = ref("");
|
|
|
+const dataRes = ref(1);
|
|
|
+
|
|
|
+const list = ref([
|
|
|
+ {
|
|
|
+ id: 1,
|
|
|
+ name: "全部",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 2,
|
|
|
+ name: "已接收",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 3,
|
|
|
+ name: "整改中",
|
|
|
+ badge: {
|
|
|
+ // isDot: true,
|
|
|
+ // value: 5,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 4,
|
|
|
+ name: "已提交",
|
|
|
+ badge: {
|
|
|
+ // value: 5,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 5,
|
|
|
+ name: "审核",
|
|
|
+ badge: {
|
|
|
+ // value: 5,
|
|
|
+ },
|
|
|
+ },
|
|
|
+]);
|
|
|
+
|
|
|
+const startData = ref({
|
|
|
+ clientX: "",
|
|
|
+ clientY: "",
|
|
|
+});
|
|
|
+const updDistance = ref(100);
|
|
|
+const lrDistance = ref(50);
|
|
|
+const topMed = ref("");
|
|
|
+const bottomMed = ref("");
|
|
|
+const leftMed = ref("");
|
|
|
+const rightMed = ref("");
|
|
|
+const classifyData = ref([]); //警情查询数据存储
|
|
|
+
|
|
|
+/**
|
|
|
+ * @当按下去的时候
|
|
|
+ */
|
|
|
+function fingerstart(e) {
|
|
|
+ // 记录 距离可视区域左上角 左边距 和 上边距
|
|
|
+ startData.value.clientX = e.changedTouches[0].clientX;
|
|
|
+ startData.value.clientY = e.changedTouches[0].clientY;
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * @当抬起来的时候
|
|
|
+ */
|
|
|
+function fingerend(e) {
|
|
|
+ // 当前位置 减去 按下位置 计算 距离
|
|
|
+ const subX = e.changedTouches[0].clientX - startData.value.clientX;
|
|
|
+ const subY = e.changedTouches[0].clientY - startData.value.clientY;
|
|
|
+ if (subY > updDistance.value || subY < -updDistance.value) {
|
|
|
+ if (subY > updDistance.value) {
|
|
|
+ bottomscroll(subY);
|
|
|
+ } else if (subY < -updDistance.value) {
|
|
|
+ topscroll(subY);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (subX > lrDistance.value) {
|
|
|
+ rightscroll(subX);
|
|
|
+ } else if (subX < -lrDistance.value) {
|
|
|
+ leftscroll(subX);
|
|
|
+ } else {
|
|
|
+ console.log("无效操作");
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+/**
|
|
|
+ * @上滑触发
|
|
|
+ */
|
|
|
+function topscroll(dista) {
|
|
|
+ topMed.value ? (topMed.value = dista) : (topMed.value = null);
|
|
|
+ console.log("触发了上滑方法!");
|
|
|
+}
|
|
|
+/**
|
|
|
+ * @下滑触发
|
|
|
+ */
|
|
|
+function bottomscroll(dista) {
|
|
|
+ bottomMed.value ? (bottomMed.value = dista) : (bottomMed.value = null);
|
|
|
+ console.log("触发了下滑方法!");
|
|
|
+}
|
|
|
+/**
|
|
|
+ * @右滑触发
|
|
|
+ */
|
|
|
+function rightscroll(dista) {
|
|
|
+ rightMed.value ? (rightMed.value = dista) : (rightMed.value = null);
|
|
|
+ console.log("触发了右滑方法!");
|
|
|
+ if (current.value >= 1) {
|
|
|
+ current.value--;
|
|
|
+ } else {
|
|
|
+ current.value = list.value.length - 1;
|
|
|
+ }
|
|
|
+}
|
|
|
+/**
|
|
|
+ * @左滑触发
|
|
|
+ */
|
|
|
+function leftscroll(dista) {
|
|
|
+ leftMed.value ? (leftMed.value = dista) : (leftMed.value = null);
|
|
|
+ console.log("触发了左滑方法!");
|
|
|
+ if (current.value < list.value.length - 1) {
|
|
|
+ current.value++;
|
|
|
+ } else {
|
|
|
+ current.value = 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+/**
|
|
|
+ * @tabs点击事件
|
|
|
+ */
|
|
|
+function tabsClick(e) {
|
|
|
+ current.value = e.index;
|
|
|
+ console.log(current.value);
|
|
|
+ dataRes.value = 1;
|
|
|
+}
|
|
|
+
|
|
|
+function goSearch() {
|
|
|
+ if (current.value == 0) {
|
|
|
+ //警情查询
|
|
|
+ classifyUrl.value = "/service-fire/demPoliceInfo/page";
|
|
|
+ classifySearch(classifyUrl.value, {
|
|
|
+ caseCode: "",
|
|
|
+ });
|
|
|
+ } else if (current.value == 1) {
|
|
|
+ //火灾查询
|
|
|
+ classifyUrl.value = "/service-fire/demFireStatisticsAttach/page";
|
|
|
+ classifySearch(classifyUrl.value, {
|
|
|
+ address: "",
|
|
|
+ });
|
|
|
+ } else if (current.value == 2) {
|
|
|
+ //人员查询
|
|
|
+ classifyUrl.value = "/service-fire/unitBeOnDuty/list";
|
|
|
+ classifySearch(classifyUrl.value, {
|
|
|
+ name: "",
|
|
|
+ });
|
|
|
+ } else if (current.value == 3) {
|
|
|
+ //车辆信息
|
|
|
+ classifyUrl.value = "/service-fire/unitBeOnDuty/vehiclelist";
|
|
|
+ classifySearch(classifyUrl.value, {
|
|
|
+ licensePlate: "",
|
|
|
+ });
|
|
|
+ } else if (current.value == 4) {
|
|
|
+ //站点查询
|
|
|
+ classifyUrl.value = "/service-fire/unitBeOnDuty/page";
|
|
|
+ classifySearch(classifyUrl.value, {
|
|
|
+ stationName: "",
|
|
|
+ });
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//分类信息查询 start
|
|
|
+async function classifySearch(URL, params) {
|
|
|
+ proxy.$modal.loading("加载中");
|
|
|
+ classifyData.value = [];
|
|
|
+ dataList(URL, params).then((res) => {
|
|
|
+ proxy.$modal.closeLoading();
|
|
|
+ if (res.status == "SUCCESS") {
|
|
|
+ if (current.value == 2) {
|
|
|
+ if (res.data.length) {
|
|
|
+ dataRes.value = 1;
|
|
|
+ } else {
|
|
|
+ dataRes.value = 0;
|
|
|
+ }
|
|
|
+ var records = res.data[0][0];
|
|
|
+ } else if (current.value == 3) {
|
|
|
+ if (res.data.length) {
|
|
|
+ dataRes.value = 1;
|
|
|
+ } else {
|
|
|
+ dataRes.value = 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ var records = res.data[0];
|
|
|
+ } else {
|
|
|
+ // console.log('111111111')
|
|
|
+ // console.log(res.data.records.length)
|
|
|
+ // console.log('111222')
|
|
|
+ if (res.data.total) {
|
|
|
+ dataRes.value = 1;
|
|
|
+ } else {
|
|
|
+ dataRes.value = 0;
|
|
|
+ }
|
|
|
+ var records = res.data.records[0];
|
|
|
+ }
|
|
|
+
|
|
|
+ console.log(dataRes.value + "------1");
|
|
|
+
|
|
|
+ switch (current.value) {
|
|
|
+ case 0: //警情查询
|
|
|
+ var classifyTitle = [
|
|
|
+ "案件编号",
|
|
|
+ "主管支队",
|
|
|
+ "案件时间段",
|
|
|
+ "通知到场时间",
|
|
|
+ "通知出水时间",
|
|
|
+ "通知控制时间",
|
|
|
+ "通知熄火时间",
|
|
|
+ "通知返队时间",
|
|
|
+ "区域",
|
|
|
+ "案件类型",
|
|
|
+ "案发地址",
|
|
|
+ "立案时间",
|
|
|
+ "立案日期",
|
|
|
+ "处置对象",
|
|
|
+ "案件等级",
|
|
|
+ "主管中队",
|
|
|
+ "区县",
|
|
|
+ "案件状态",
|
|
|
+ "案件性质",
|
|
|
+ "填表时间",
|
|
|
+ "街镇",
|
|
|
+ "创建时间",
|
|
|
+ ];
|
|
|
+ var classifyValue = [
|
|
|
+ records.caseCode,
|
|
|
+ records.branch,
|
|
|
+ records.timeSlot,
|
|
|
+ records.noticeArrivalTime,
|
|
|
+ records.noticeEffluentTime,
|
|
|
+ records.controlTime,
|
|
|
+ records.quenchTime,
|
|
|
+ records.returnTime,
|
|
|
+ records.caseArea,
|
|
|
+ records.caseTypeCode,
|
|
|
+ records.address,
|
|
|
+ records.filingTime,
|
|
|
+ records.filingDate,
|
|
|
+ records.handleObject,
|
|
|
+ records.caseLevel,
|
|
|
+ records.squadron,
|
|
|
+ records.district,
|
|
|
+ records.caseStatus,
|
|
|
+ records.caseNature,
|
|
|
+ records.bdpAudit,
|
|
|
+ records.streetTown,
|
|
|
+ records.createTime,
|
|
|
+ ];
|
|
|
+ break;
|
|
|
+ case 1: //火灾查询
|
|
|
+ var classifyTitle = [
|
|
|
+ "地区",
|
|
|
+ "街镇",
|
|
|
+ "经度",
|
|
|
+ "维度",
|
|
|
+ "平台ID",
|
|
|
+ "火灾地址",
|
|
|
+ "过火面积",
|
|
|
+ "直接财产损失",
|
|
|
+ "死亡人数",
|
|
|
+ "受伤人数",
|
|
|
+ "受灾户数",
|
|
|
+ "火灾原因",
|
|
|
+ "火灾等级",
|
|
|
+ "场所一级",
|
|
|
+ "场所二级",
|
|
|
+ "起火物一级",
|
|
|
+ "起火物二级",
|
|
|
+ "性质",
|
|
|
+ ];
|
|
|
+ var classifyValue = [
|
|
|
+ records.district,
|
|
|
+ records.street,
|
|
|
+ records.longitude,
|
|
|
+ records.latitude,
|
|
|
+ records.id,
|
|
|
+ records.address,
|
|
|
+ records.burnedArea,
|
|
|
+ records.propertyLoss,
|
|
|
+ records.deathToll,
|
|
|
+ records.nonFatal,
|
|
|
+ records.disasterHome,
|
|
|
+ records.fireCause,
|
|
|
+ records.fireLevel,
|
|
|
+ records.placeOne,
|
|
|
+ records.placeTwo,
|
|
|
+ records.fireGoodsOne,
|
|
|
+ records.fireGoodsTwo,
|
|
|
+ records.nature,
|
|
|
+ ];
|
|
|
+ break;
|
|
|
+ case 2: //人员查询
|
|
|
+ var classifyTitle = ["值班人员信息", "岗位名称", "机构名称", "机构简称", "机构地址", "值班日期"];
|
|
|
+ var classifyValue = [records.name, records.postName, records.organizationName, records.organizationShort, records.organizationAddress, records.time];
|
|
|
+ break;
|
|
|
+ case 3: //车辆查询
|
|
|
+ var classifyTitle = [
|
|
|
+ "车辆信息",
|
|
|
+ "单件装备编码",
|
|
|
+ "装备名称",
|
|
|
+ "装备编码",
|
|
|
+ "上级装备编码",
|
|
|
+ "所属消防机构",
|
|
|
+ "车牌号码",
|
|
|
+ "资产编号",
|
|
|
+ "商标",
|
|
|
+ "颜色",
|
|
|
+ "生产厂家名称",
|
|
|
+ "有效期至",
|
|
|
+ "车架号",
|
|
|
+ "发动机编号",
|
|
|
+ "批次号",
|
|
|
+ "电台呼号",
|
|
|
+ "车辆简称",
|
|
|
+ "电台频道",
|
|
|
+ "指挥员姓名",
|
|
|
+ "驾驶员",
|
|
|
+ ];
|
|
|
+ var classifyValue = [
|
|
|
+ records.vehicleId,
|
|
|
+ records.singleEquipCode,
|
|
|
+ records.equipName,
|
|
|
+ records.equipCode,
|
|
|
+ records.superiorEquipCode,
|
|
|
+ records.fireOrga,
|
|
|
+ records.licensePlate,
|
|
|
+ records.assetCode,
|
|
|
+ records.assetCode,
|
|
|
+ records.colour,
|
|
|
+ records.productName,
|
|
|
+ records.validityTime,
|
|
|
+ records.frameCode,
|
|
|
+ records.engineCode,
|
|
|
+ records.batchCode,
|
|
|
+ records.radioCallSign,
|
|
|
+ records.vehicleAbbreviat,
|
|
|
+ records.radioChannel,
|
|
|
+ records.commanderName,
|
|
|
+ records.driver,
|
|
|
+ ];
|
|
|
+ break;
|
|
|
+ case 4: //站点查询
|
|
|
+ var classifyTitle = [
|
|
|
+ "平台ID",
|
|
|
+ "支队名称",
|
|
|
+ "所属辖区中队",
|
|
|
+ "消防站名称",
|
|
|
+ "单位性质",
|
|
|
+ "地址",
|
|
|
+ "所在位置",
|
|
|
+ "联动固定电话",
|
|
|
+ "负责人姓名",
|
|
|
+ "负责人手机号码",
|
|
|
+ "备注",
|
|
|
+ "消防站类型",
|
|
|
+ "经度",
|
|
|
+ "维度",
|
|
|
+ "创建时间",
|
|
|
+ "更新时间",
|
|
|
+ "支队id",
|
|
|
+ "中队id",
|
|
|
+ "编号",
|
|
|
+ "原单位性质",
|
|
|
+ ];
|
|
|
+ var classifyValue = [
|
|
|
+ records.id,
|
|
|
+ records.branchName,
|
|
|
+ records.squadron,
|
|
|
+ records.stationName,
|
|
|
+ records.companyNature,
|
|
|
+ records.address,
|
|
|
+ records.location,
|
|
|
+ records.fixedPhone,
|
|
|
+ records.chargeName,
|
|
|
+ records.chargePhone,
|
|
|
+ records.remark,
|
|
|
+ records.stationType,
|
|
|
+ records.longitude,
|
|
|
+ records.dimension,
|
|
|
+ records.createTime,
|
|
|
+ records.updateTime,
|
|
|
+ records.branchId,
|
|
|
+ records.squadronId,
|
|
|
+ records.number,
|
|
|
+ records.primaryCompanyNature,
|
|
|
+ ];
|
|
|
+ break;
|
|
|
+ // default:
|
|
|
+ // 默认代码块
|
|
|
+ }
|
|
|
+
|
|
|
+ for (var i = 0; i < classifyTitle.length; i++) {
|
|
|
+ var obj = {};
|
|
|
+ obj.title = classifyTitle[i];
|
|
|
+ obj.value = classifyValue[i];
|
|
|
+ classifyData.value.push(obj);
|
|
|
+
|
|
|
+ // console.log(classifyData.value);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ }
|
|
|
+ });
|
|
|
+}
|
|
|
+// end
|
|
|
+
|
|
|
+watchEffect(() => {
|
|
|
+ goSearch();
|
|
|
+});
|
|
|
+
|
|
|
+// 自定义导航事件
|
|
|
+onNavigationBarButtonTap((e) => {
|
|
|
+ if (e.float == "right") {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: "/pages/business/mhxf/xunJian/collect/components/collectRecord",
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ }
|
|
|
+});
|
|
|
+
|
|
|
+onLoad((options) => {});
|
|
|
+
|
|
|
+onReady(() => {});
|
|
|
+
|
|
|
+onMounted(() => {});
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+.uni-swipe {
|
|
|
+ overflow: visible;
|
|
|
+}
|
|
|
+.is-selected {
|
|
|
+ color: #1989fa;
|
|
|
+}
|
|
|
+
|
|
|
+.needMatter {
|
|
|
+ height: calc(100vh - 88px);
|
|
|
+ background-color: #ffffff;
|
|
|
+ .content {
|
|
|
+ padding: 10px;
|
|
|
+ .u-row {
|
|
|
+ height: 36px;
|
|
|
+ line-height: 36px;
|
|
|
+ .u-col {
|
|
|
+ border: 1px #e4e3e3 solid;
|
|
|
+ border-right: 0px;
|
|
|
+ border-bottom: 0px;
|
|
|
+ text-align: center;
|
|
|
+
|
|
|
+ view {
|
|
|
+ padding: 0 10px;
|
|
|
+ min-height: 36px;
|
|
|
+ overflow: hidden; //超出的文本隐藏
|
|
|
+ // text-overflow: ellipsis; //溢出用省略号显示
|
|
|
+ overflow: auto;
|
|
|
+ white-space: nowrap; // 默认不换行;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .u-col:last-child {
|
|
|
+ border-right: 1px #e4e3e3 solid;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .u-row:last-child {
|
|
|
+ .u-col {
|
|
|
+ border-bottom: 1px #e4e3e3 solid;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+uni-page-body,
|
|
|
+uni-page-refresh {
|
|
|
+ background-color: #f5f6f7;
|
|
|
+}
|
|
|
+
|
|
|
+.time {
|
|
|
+ position: absolute;
|
|
|
+ z-index: 99999;
|
|
|
+ top: 3px;
|
|
|
+ left: 3px;
|
|
|
+ display: inline-block;
|
|
|
+ color: #fff;
|
|
|
+}
|
|
|
+.con {
|
|
|
+ text-align: center;
|
|
|
+ position: relative;
|
|
|
+}
|
|
|
+.whiteBackgroundColor {
|
|
|
+ background-color: #ffffff;
|
|
|
+}
|
|
|
+</style>
|