设施采集/设备查看

src/api/business/fireIot/deviceSelect/index.js

@@ -0,0 +1,20 @@
+import upload from "@/utils/upload";
+import request from "@/utils/request";
+
+// 设备查询列表请求
+export function dmpProductInfo(param) {
+    return request({
+        url: "/service-iot/dmpProductInfo/page",
+        method: "POST",
+        data: param,
+    });
+}
+
+// 设备详情列表请求
+export function dmpDeviceInfo(param) {
+    return request({
+        url: "/service-iot/dmpDeviceInfo/page",
+        method: "POST",
+        data: param,
+    });
+}

src/api/business/fireIot/facilitiesGather/index.js

@@ -0,0 +1,29 @@
+import upload from "@/utils/upload";
+import request from "@/utils/request";
+
+// 设施类型查询接口
+export function typeSelect(param) {
+    return request({
+        url: "/service-iot/baseFacilityType/typeSelect",
+        method: "GET",
+        data: param,
+    });
+}
+
+// 设施类型新增接口
+export function add(param) {
+    return request({
+        url: "/service-iot/baseGgpFacility/add",
+        method: "POST",
+        data: param,
+    });
+}
+
+// 图片上传
+export function uploadAvatar(data) {
+    return upload({
+        url: "/service-file/upload",
+        name: data.name,
+        filePath: data.filePath,
+    });
+}

src/pages/business/fireIot/deviceSelect/components/deviceDetails.vue

@@ -0,0 +1,92 @@
+<template>
+  <scroll-view class="scroll-height" :scroll-y="true" :data-theme="'theme-' + proxy.$settingStore.themeColor.name">
+    <view class="deviceDetails-container">
+      <view class="flex bg-white padding-15 margin-b-15">
+        <image style="width: 40px; height: 40px; margin: auto 15px auto 0" :src="'/static/images/404.png'" mode="aspectFill"></image>
+
+        <view style="margin: auto auto auto 0">
+          <view style="font-size: 15px"> 火警设备1 </view>
+        </view>
+
+        <view style="margin: auto 0 auto 0">
+          <!-- {{ siteList.siteStatus == null }} -->
+          <view style="font-size: 15px; color: #30bb00">在线</view>
+          <!-- #f07d28 -->
+        </view>
+      </view>
+
+      <view class="bg-white padding-15 margin-b-15">
+        <uni-section class="margin-bottom-10" title="基本信息" type="line"></uni-section>
+
+        <view class="tableType3 padding-0">
+          <u-empty v-if="dataList.length <= 0" text="暂无数据" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"> </u-empty>
+
+          <u-row v-for="po in dataList" :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 class="bg-white padding-15 margin-b-15">
+        <uni-section class="margin-bottom-10" title="地址信息" type="line"></uni-section>
+
+        <view> 徐乐路208号C幢 </view>
+      </view>
+
+      <view class="bg-white padding-15 margin-b-15" style="height: 170px; max-height: 170px">
+        <uni-section class="margin-bottom-10" title="图表" type="line"></uni-section>
+
+        <view style="height: calc(100% - 25px)"> </view>
+      </view>
+    </view>
+  </scroll-view>
+</template>
+
+<script setup>
+import { onLoad, onShow, onReady, onHide, onLaunch, onNavigationBarButtonTap, onPageScroll } from "@dcloudio/uni-app";
+import { ref, reactive, computed, getCurrentInstance, toRefs, inject } from "vue";
+import { publicStores, useStores } from "@/store/modules/index";
+
+const { proxy } = getCurrentInstance();
+
+const dataList = ref([
+  {
+    title: "设备类型",
+    value: "烟感",
+  },
+  {
+    title: "设备编号",
+    value: "32942389473274923",
+  },
+  {
+    title: "物联网卡号",
+    value: "3489494234564",
+  },
+  {
+    title: "安装位置",
+    value: "上海市青浦区徐泾镇徐乐路208号",
+  },
+  {
+    title: "添加时间",
+    value: "2020-06-01 13:06:20",
+  },
+]);
+
+onReady(() => {});
+
+onShow(() => {
+  //调用系统主题颜色
+  proxy.$settingStore.systemThemeColor([1]);
+});
+
+onLoad((options) => {
+  console.log(options.type);
+});
+</script>
+
+<style lang="scss" scoped></style>

src/pages/business/fireIot/deviceSelect/components/deviceDetailsList.vue

@@ -0,0 +1,108 @@
+<template>
+  <scroll-view class="scroll-height" :scroll-y="true" :data-theme="'theme-' + proxy.$settingStore.themeColor.name">
+    <u-sticky class="example-body" style="top: 0px" v-if="show">
+      <view class="padding-sm padding-tb-10" :class="'bg-' + proxy.$settingStore.themeColor.name">
+        <u--input
+          v-model="deviceName"
+          placeholder="搜索"
+          prefixIcon="search"
+          prefixIconStyle="font-size: 22px;color: #909399"
+          customStyle="height:35px;background-color:#f5f6fa;"
+          @confirm="init()"
+          clearable
+        ></u--input>
+      </view>
+    </u-sticky>
+
+    <view class="deviceDetailsList-container">
+      <view class="menu-list margin-0">
+        <view class="list-cell list-cell-arrow" v-for="(base, index) in dataList" :key="index" @click="handleToDevice(base.type)">
+          <view class="menu-item-box">
+            <view class="title">{{ base.deviceName }}</view>
+          </view>
+        </view>
+      </view>
+
+      <uni-pagination class="app-pagination bg-white" :current="current" :total="total" :pageSize="pageSize" prev-text="上一页" next-text="下一页" @change="paginationChange" />
+    </view>
+  </scroll-view>
+</template>
+
+<script setup>
+import { onLoad, onShow, onReady, onHide, onLaunch, onNavigationBarButtonTap, onPageScroll } from "@dcloudio/uni-app";
+import { ref, reactive, computed, getCurrentInstance, toRefs, inject } from "vue";
+import { publicStores, useStores } from "@/store/modules/index";
+
+import { dmpDeviceInfo } from "@/api/business/fireIot/deviceSelect/index";
+
+const { proxy } = getCurrentInstance();
+
+const dataList = ref([]);
+
+const show = ref(false);
+const deviceName = ref("");
+const productId = ref("");
+const pageSize = ref(20);
+const current = ref(1);
+const total = ref(0);
+
+/**
+ * @页面初始化
+ */
+function init() {
+  dmpDeviceInfo({ productId: productId.value, deviceName: deviceName.value, current: current.value, size: pageSize.value }).then((requset) => {
+    if (requset.status === "SUCCESS") {
+      if (requset.data.records.length > 0) {
+        uni.setNavigationBarTitle({
+          title: `${requset.data.records[0].productName}（${requset.data.total}）`,
+        });
+      }
+
+      dataList.value = requset.data.records;
+      total.value = requset.data.total;
+    }
+  });
+}
+
+/**
+ * @分页chage事件
+ */
+function paginationChange(e) {
+  current.value = e.current;
+  init();
+}
+
+/**
+ * @设备详情跳转点击事件
+ */
+function handleToDevice(type) {
+  proxy.$tab.navigateTo("/pages/business/fireIot/deviceSelect/components/deviceDetails?type=" + type);
+}
+
+onReady(() => {});
+
+onShow(() => {
+  //调用系统主题颜色
+  proxy.$settingStore.systemThemeColor([1]);
+});
+
+onLoad((options) => {
+  if ("id" in options) {
+    productId.value = parseInt(options.id);
+    init();
+  }
+});
+
+// 自定义导航事件
+onNavigationBarButtonTap((e) => {
+  if (e.float == "right") {
+    show.value = !show.value;
+  } else {
+  }
+});
+</script>
+
+<style lang="scss" scoped>
+.deviceDetailsList-container {
+}
+</style>

src/pages/business/fireIot/deviceSelect/index.vue

@@ -0,0 +1,61 @@
+<template>
+  <scroll-view class="bg-white scroll-height" :scroll-y="true" :data-theme="'theme-' + proxy.$settingStore.themeColor.type">
+    <u-grid :border="true">
+      <u-grid-item v-for="(base, index) in dataList" :key="index" @click="handleToDevice(base.id)">
+        <u-badge type="primary" max="9999" :value="base.deviceCount" :showZero="true" :absolute="true" :offset="[10, 10, 0, 0]"></u-badge>
+        <image class="margin-b-15" style="width: 40px; height: 40px; margin-top: 35px" :src="base.imagePath" mode="aspectFill"></image>
+        <text class="margin-b-15 grid-text">{{ base.productName }}</text>
+      </u-grid-item>
+    </u-grid>
+
+    <!-- <uni-pagination class="app-pagination bg-white" :current="current" :total="total" :pageSize="pageSize" prev-text="前一页" next-text="后一页" @change="paginationChange" /> -->
+  </scroll-view>
+</template>
+
+<script setup>
+import { onReady, onLoad, onShow, onNavigationBarButtonTap, onPullDownRefresh, onReachBottom } from "@dcloudio/uni-app";
+import { ref, onMounted, inject, shallowRef, reactive, getCurrentInstance } from "vue";
+import { useStores, publicStores } from "@/store/modules/index";
+
+import { dmpProductInfo } from "@/api/business/fireIot/deviceSelect/index";
+
+const { proxy } = getCurrentInstance();
+
+const dataList = ref([]);
+const pageSize = ref(1000);
+const current = ref(1);
+const total = ref(0);
+
+/**
+ * @页面初始化
+ */
+function init() {
+  dmpProductInfo({ productName: "", current: current.value, size: pageSize.value }).then((requset) => {
+    if (requset.status === "SUCCESS") {
+      requset.data.records.forEach((el) => {
+        if ("imagePath" in el == false) {
+          el.imagePath = "/static/images/404.png";
+        }
+
+        if (el.deviceCount == null) {
+          el.deviceCount = 0;
+        }
+      });
+
+      dataList.value = requset.data.records;
+      total.value = requset.data.total;
+    }
+  });
+}
+
+function handleToDevice(id) {
+  proxy.$tab.navigateTo("/pages/business/fireIot/deviceSelect/components/deviceDetailsList?id=" + id);
+}
+
+onShow(() => {
+  //调用系统主题颜色
+  proxy.$settingStore.systemThemeColor([1]);
+
+  init();
+});
+</script>

src/pages/business/fireIot/facilitiesGather/index.vue

@@ -0,0 +1,388 @@
+<template>
+  <scroll-view class="scroll-height" :scroll-y="true" :data-theme="'theme-' + proxy.$settingStore.themeColor.name">
+    <view id="unitInfoCollection" v-if="!successBool">
+      <view class="centerOne">
+        <view class="title"> </view>
+
+        <u--form :model="form" ref="uForm" :rules="rules" labelWidth="90">
+          <view style="padding: 10px 0">
+            <view style="padding: 10px 10px 20px 10px; background: #ffffff">
+              <view style="padding-left: 9px">
+                <u-form-item label="所属部门" prop="department" :borderBottom="true" @click="handleAction('所属部门')" required>
+                  <u-input v-model="form.department" placeholder="请选择所属部门" suffixIcon="arrow-right" suffixIconStyle="color: #909399" border="none" disabledColor="transparent" disabled />
+                </u-form-item>
+                <u-form-item label="设施类型" prop="facilityTypeName" :borderBottom="true" @click="handleAction('设施类型')" required>
+                  <u-input v-model="form.facilityTypeName" placeholder="请选择设施类型" suffixIcon="arrow-right" suffixIconStyle="color: #909399" border="none" disabledColor="transparent" disabled />
+                </u-form-item>
+                <u-form-item label="设施名称" prop="facilityName" :borderBottom="true" required>
+                  <u-input v-model="form.facilityName" placeholder="请输入设施名称" border="none" />
+                </u-form-item>
+                <u-form-item label="状态" prop="status" :borderBottom="true" required>
+                  <u-radio-group v-model="form.status" placement="row">
+                    <u-radio v-for="se in sexList" :key="se" :activeColor="proxy.$settingStore.themeColor.color" :label="se.text" :name="se.value" style="margin-right: 15px"></u-radio>
+                  </u-radio-group>
+                </u-form-item>
+                <u-form-item label="设施地址" prop="address" :borderBottom="true" @click="handleAction('设施地址')" required>
+                  <u-input v-model="form.address" placeholder="请选择设施地址" border="none" disabledColor="transparent" disabled>
+                    <template #suffix>
+                      <view class="iconfont ucicon-map menu-icon" style="font-size: 18px; color: #909399"> </view>
+                    </template>
+                  </u-input>
+                </u-form-item>
+                <u-form-item label="行政区划" prop="facilityAddress" :borderBottom="true" required>
+                  <view>
+                    <u-input v-model="form.address" placeholder="" border="none" disabledColor="transparent" disabled />
+                    <u-input v-model="form.facilityAddress" placeholder="请输入详细地址" border="none" />
+                  </view>
+                </u-form-item>
+                <u-form-item label="表现形式" prop="gpsAreas" :borderBottom="true" @click="handleAction('表现形式')" required> </u-form-item>
+                <u-form-item label="联系人" prop="contact" :borderBottom="true" required>
+                  <u-input v-model="form.contact" placeholder="请输入联系人" border="none" />
+                </u-form-item>
+                <u-form-item label="联系电话" prop="contactPhone" required :borderBottom="true">
+                  <u-input v-model="form.contactPhone" placeholder="请输入联系电话" border="none" maxlength="11" />
+                </u-form-item>
+                <u-form-item label="设备图片" prop="imagesUrl" required :borderBottom="true">
+                  <view class="flex flex-wrap">
+                    <view class="uploadView" style="width: 110px; margin-bottom: 0px" v-if="form.imagesUrl">
+                      <view class="uploadUimage">
+                        <u-image width="100%" height="100%" :src="form.imagesUrl"></u-image>
+                      </view>
+
+                      <view class="uploadViewClose" @click="uploadViewClose()">
+                        <u-icon name="close" color="#ffffff" size="12"></u-icon>
+                      </view>
+                    </view>
+                    <view :class="'uploadView upload-buttom'" style="width: 110px; margin-bottom: 0px" v-if="!form.imagesUrl" @click="uploadClick">
+                      <u-icon style="margin: auto" name="plus" color="#909399" size="28"></u-icon>
+                    </view>
+                  </view>
+                </u-form-item>
+                <u-form-item label="备注" prop="facilityDesc" required :borderBottom="true">
+                  <u-textarea v-model="form.facilityDesc" placeholder="请输入" border="none" maxlength="30" style="padding: 0px"></u-textarea>
+                </u-form-item>
+              </view>
+            </view>
+          </view>
+        </u--form>
+
+        <view style="padding-bottom: 70px"> </view>
+
+        <view class="app-button-fixed">
+          <view class="app-flex">
+            <u-button class="app-buttom" style="margin-right: 15px" @click="handleSubmit('取消')" shape="circle"> 取消 </u-button>
+
+            <u-button class="app-buttom" type="primary" @click="handleSubmit('提交')" shape="circle"> 提交 </u-button>
+          </view>
+        </view>
+      </view>
+
+      <u-picker
+        :show="actionShow"
+        :columns="actionsList"
+        :title="'请选择' + actionTitle"
+        keyName="name"
+        visibleItemCount="6"
+        :defaultIndex="[actionDefaultIndex]"
+        :closeOnClickOverlay="true"
+        @close="actionShow = false"
+        @cancel="actionShow = false"
+        @confirm="selectAction"
+      ></u-picker>
+    </view>
+
+    <view v-else>
+      <view style="display: flex">
+        <image style="width: 120px; height: 120px; margin: 50px auto 20px auto" src="@/static/images/unitInfoCollection/success.png" />
+      </view>
+      <view style="text-align: center; font-weight: 600">提交成功</view>
+    </view>
+  </scroll-view>
+</template>
+
+<script setup>
+import { onLoad, onShow, onHide, onLaunch, onReady } from "@dcloudio/uni-app";
+import { ref, onMounted, inject, shallowRef, reactive, toRefs, getCurrentInstance } from "vue";
+import { publicStores, useStores } from "@/store/modules/index";
+import { getToken } from "@/utils/auth";
+
+import { typeSelect, add, uploadAvatar } from "@/api/business/fireIot/facilitiesGather/index";
+
+const { proxy } = getCurrentInstance();
+
+const publicStore = publicStores();
+
+//设施类型下拉数据存储
+const typeSelectList = ref([[]]);
+
+const dataList = reactive({
+  sexList: [
+    {
+      text: "正常",
+      value: "0",
+    },
+    {
+      text: "维修",
+      value: "1",
+    },
+    {
+      text: "关闭",
+      value: "2",
+    },
+  ],
+
+  form: {
+    department: "", //所属部门
+    facilityType: "", //设施类型
+    facilityTypeName: "", //设施类型名称
+    facilityName: "", //设施名称
+    status: "", //设施状态
+    address: "", //设施地址
+    longitude: "", //经度
+    latitude: "", //纬度
+    province: "", //省
+    city: "", //市
+    area: "", //区（县）
+    facilityAddress: "", //详细地址
+    streetTown: null, //所属街镇
+    gpsAreas: "", //经纬度集合
+    contact: "", //联系人
+    contactPhone: "", //联系方式
+    imagesUrl: "", //图⽚地址URL
+    facilityDesc: "", //备注
+    extendData: '{"detachment":"闵行支队","squadron":"马桥站"}', //扩展属性
+    recordPictureList: [],
+  },
+
+  rules: {
+    department: [
+      {
+        required: false,
+        message: "请选择所属部门",
+        trigger: ["blur", "change"],
+      },
+    ],
+    facilityTypeName: [
+      {
+        required: true,
+        message: "请选择设施类型",
+        trigger: ["blur", "change"],
+      },
+    ],
+    facilityName: [
+      {
+        required: true,
+        message: "请输入设施名称",
+        trigger: ["blur", "change"],
+      },
+    ],
+    status: [
+      {
+        required: true,
+        message: "请选择设施状态",
+        trigger: ["blur", "change"],
+      },
+    ],
+    address: [
+      {
+        required: false,
+        message: "请选择设施地址",
+        trigger: ["blur", "change"],
+      },
+    ],
+    facilityAddress: [
+      {
+        required: true,
+        message: "请输入详细地址",
+        trigger: ["blur", "change"],
+      },
+    ],
+    contact: [
+      {
+        required: true,
+        message: "请输入联系人",
+        trigger: ["blur", "change"],
+      },
+    ],
+    contactPhone: [
+      {
+        required: true,
+        message: "请输入联系人电话",
+        trigger: ["blur", "change"],
+      },
+      {
+        type: "string",
+        min: 11,
+        required: true,
+        message: "请输入正确11位联系人电话",
+        pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
+        trigger: ["blur", "change"],
+      },
+    ],
+    imagesUrl: [
+      {
+        required: true,
+        message: "请选择图片",
+        trigger: ["blur", "change"],
+      },
+    ],
+    facilityDesc: [
+      {
+        required: true,
+        message: "请输入备注",
+        trigger: ["blur", "change"],
+      },
+    ],
+  },
+
+  actionIndex: 0,
+  actionIndex1: 0,
+  actionTitle: "",
+  actionShow: false,
+  actionDefaultIndex: 0,
+  actionsList: [[]],
+});
+
+const { sexList, form, rules, actionIndex, actionIndex1, actionTitle, actionShow, actionDefaultIndex, actionsList } = toRefs(dataList);
+
+const uForm = ref(null);
+const successBool = ref(false);
+
+/**
+ * @api提交
+ */
+function handleSubmit(type) {
+  let param = {};
+
+  uForm.value
+    .validate()
+    .then((res) => {
+      uni.$u.toast("校验通过");
+
+      param = {
+        facilityType: form.value.facilityType,
+        facilityName: form.value.facilityName,
+        status: form.value.status, //设施状态
+        address: "徐乐路208号", //设施地址
+        longitude: "121.3632126", //经度
+        latitude: "30.98168041", //纬度
+        province: "", //省
+        city: "", //市
+        area: "", //区（县）
+        facilityAddress: form.value.facilityAddress, //详细地址
+        gpsAreas: "", //经纬度集合
+        contact: form.value.contact, //联系人
+        contactPhone: form.value.contactPhone, //联系方式
+        imagesUrl: form.value.imagesUrl, //图⽚地址URL
+        facilityDesc: form.value.facilityDesc, //备注
+      };
+
+      add(param).then((requset) => {});
+    })
+    .catch((errors) => {
+      uni.$u.toast("校验失败");
+    });
+}
+
+/**
+ * @action弹出框点击事件
+ */
+function handleAction(value, index, ind) {
+  actionsList.value = [[]];
+
+  if (value == "设施类型") {
+    actionTitle.value = "设施类型";
+    actionsList.value = typeSelectList.value;
+  }
+
+  actionShow.value = true;
+}
+
+/**
+ * @action弹出框选择事件
+ */
+function selectAction(e) {
+  if (actionTitle.value == "设施类型") {
+    form.value.facilityType = e.value[0].value;
+    form.value.facilityTypeName = e.value[0].name;
+  }
+
+  // if (actionTitle.value == "灭火器") {
+  //   form.value.baseBuildList[actionIndex.value].baseBuildExtinguishList[actionIndex1.value].extinguishType = e.value[0].name;
+  //   form.value.baseBuildList[actionIndex.value].baseBuildExtinguishList[actionIndex1.value].extinguishTypeValue = e.value[0].value;
+  // }
+
+  actionShow.value = false;
+}
+
+/**
+ * @upload图片上传
+ * @点击事件
+ */
+function uploadClick() {
+  uni.chooseImage({
+    count: 1, //默认9
+    sizeType: ["original", "compressed"], //可以指定是原图还是压缩图，默认二者都有
+    sourceType: ["album", "camera"], //从相册选择、摄像头
+    success: function (res) {
+      uploadApi(res);
+    },
+  });
+}
+
+/**
+ * @upload图片上传
+ * @api接口请求
+ */
+function uploadApi(res) {
+  let data = { name: "file", filePath: res.tempFilePaths[0] };
+
+  uploadAvatar(data).then((response) => {
+    form.value.imagesUrl = response.data.url;
+  });
+}
+
+/**
+ * @upload图片上传
+ * @点击事件
+ * @删除事件
+ */
+function uploadViewClose(el) {
+  form.value.imagesUrl = "";
+}
+
+onLoad((options) => {
+  form.value.baseBuildList = [];
+  rules.value.baseBuildList = [];
+
+  typeSelect({ id: undefined }).then((requset) => {
+    if (requset.status === "SUCCESS") {
+      requset.data.forEach((el) => {
+        typeSelectList.value[0].push({ name: el.typeName, value: el.id });
+      });
+    }
+  });
+});
+
+onShow(() => {
+  //调用系统主题颜色
+  proxy.$settingStore.systemThemeColor([1]);
+});
+</script>
+
+<style lang="scss">
+#unitInfoCollection {
+  .centerOne,
+  .centerTwo {
+    .title {
+      color: #333333;
+      text-align: center;
+      margin-top: 10px;
+    }
+  }
+
+  :deep(.u-picker__view__column__item) {
+    font-size: 13px;
+  }
+}
+</style>