|
|
@@ -1,9 +1,328 @@
|
|
|
<script setup lang="ts">
|
|
|
-import { defineProps, reactive, ref, toRefs } from "vue"
|
|
|
-import apis from "@/api/index"
|
|
|
-const company = ref<any>({})
|
|
|
+import { computed, ref } from "vue"
|
|
|
+import configs from "@/core/config/Index"
|
|
|
+import moment from "moment"
|
|
|
+import router from "@/router"
|
|
|
+import { ElInput } from "element-plus"
|
|
|
+import type { VbFormItem } from "@/components/Forms/models"
|
|
|
+import Rs from "@/core/services/RequestService"
|
|
|
+const table = ref()
|
|
|
+const cols = ref([
|
|
|
+ {
|
|
|
+ name: "序号",
|
|
|
+ field: configs.TABLE_INDEX_FIELD,
|
|
|
+ width: 60,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "区域",
|
|
|
+ field: "org_name",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "企业名称",
|
|
|
+ field: "company_name",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "监测类型",
|
|
|
+ field: "monitoring_type_name",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "告警类型",
|
|
|
+ field: "warn_type_name",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "告警时间",
|
|
|
+ field: "warn_starttime",
|
|
|
+ },
|
|
|
+ // {
|
|
|
+ // name: "处理时间",
|
|
|
+ // field: "abnormal_date",
|
|
|
+ // },
|
|
|
+ {
|
|
|
+ name: "处理结果",
|
|
|
+ field: "abnormal_state_name",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "操作",
|
|
|
+ width: 210,
|
|
|
+ field: "action",
|
|
|
+ },
|
|
|
+])
|
|
|
+const jump = function (v: any) {
|
|
|
+ console.log("jump", v)
|
|
|
+ router.push({
|
|
|
+ path: "/goLineData/oilFumeConcentration",
|
|
|
+ query: {
|
|
|
+ back: 1,
|
|
|
+ comName: v.company_name,
|
|
|
+ company_id: v.company_id,
|
|
|
+ },
|
|
|
+ })
|
|
|
+}
|
|
|
+const size = ref<any>("default")
|
|
|
+const dySearchSelectStyle = { width: "180px" }
|
|
|
+const companyName = ref("")
|
|
|
+const orgId = ref<string | null>(null)
|
|
|
+const warnType = ref("")
|
|
|
+const abnormalState = ref("")
|
|
|
+const monitoringType = ref("")
|
|
|
+const dateRange = ref<[Date, Date]>([moment(new Date()).add(-7, "d").toDate(), new Date()])
|
|
|
+const queryParams = ref<any>({
|
|
|
+ query_start_time: moment(dateRange.value[0]).format("YYYYMMDD"),
|
|
|
+ query_end_time: moment(dateRange.value[1]).format("YYYYMMDD"),
|
|
|
+})
|
|
|
+function query() {
|
|
|
+ const params = {
|
|
|
+ query_start_time: moment(dateRange.value[0]).format("YYYYMMDD"),
|
|
|
+ query_end_time: moment(dateRange.value[1]).format("YYYYMMDD"),
|
|
|
+ warn_type: warnType.value,
|
|
|
+ abnormal_state: abnormalState.value,
|
|
|
+ monitoring_type: monitoringType.value,
|
|
|
+ company_name: companyName.value,
|
|
|
+ org_id: orgId.value,
|
|
|
+ }
|
|
|
+ const keys = Object.keys(params)
|
|
|
+ keys.forEach((key) => {
|
|
|
+ if (params[key] == "") {
|
|
|
+ delete params[key]
|
|
|
+ }
|
|
|
+ })
|
|
|
+ queryParams.value = params
|
|
|
+}
|
|
|
+function reset() {
|
|
|
+ companyName.value = ""
|
|
|
+ orgId.value = ""
|
|
|
+ warnType.value = ""
|
|
|
+ abnormalState.value = ""
|
|
|
+ monitoringType.value = ""
|
|
|
+ dateRange.value = [moment(new Date()).add(-7, "d").toDate(), new Date()]
|
|
|
+ query()
|
|
|
+}
|
|
|
+const modal = ref()
|
|
|
+const operationType = ref<"D" | "N">("D")
|
|
|
+const modalTitle = computed(() => {
|
|
|
+ return operationType.value == "D" ? "告警详情" : operationType.value == "N" ? "下发通知" : ""
|
|
|
+})
|
|
|
+const formData = ref<any>({})
|
|
|
+const formItems = computed(() => {
|
|
|
+ return (
|
|
|
+ operationType.value == "N"
|
|
|
+ ? [
|
|
|
+ {
|
|
|
+ label: "企业名称：",
|
|
|
+ field: "company_name",
|
|
|
+ component: "innerText",
|
|
|
+ span: 12,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "异常类型：",
|
|
|
+ field: "warn_type_name",
|
|
|
+ component: "innerText",
|
|
|
+ span: 12,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "告警设备：",
|
|
|
+ field: "device_name",
|
|
|
+ component: "innerText",
|
|
|
+ span: 12,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "告警时间：",
|
|
|
+ field: "warn_starttime",
|
|
|
+ component: "innerText",
|
|
|
+ span: 12,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "通知内容：",
|
|
|
+ field: "content",
|
|
|
+ placeholder: "请输入通知内容",
|
|
|
+ required: true,
|
|
|
+ component: ElInput,
|
|
|
+ type: "textarea",
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "通知部门：",
|
|
|
+ field: "notice_org",
|
|
|
+ component: "innerText",
|
|
|
+ span: 12,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: "通知人：",
|
|
|
+ field: "notifier",
|
|
|
+ placeholder: "请输入通知人",
|
|
|
+ required: true,
|
|
|
+ component: ElInput,
|
|
|
+ span: 24,
|
|
|
+ },
|
|
|
+ ]
|
|
|
+ : operationType.value == "D"
|
|
|
+ ? []
|
|
|
+ : []
|
|
|
+ ) as Array<VbFormItem>
|
|
|
+})
|
|
|
+const details = ref<any>({})
|
|
|
+function detail(row: any) {
|
|
|
+ operationType.value = "D"
|
|
|
+ if (row.warn_type == "000100003" || row.warn_type == "000100005" || row.warn_type == "000100007") {
|
|
|
+ router.push({
|
|
|
+ path: "/warnList/strongWarn",
|
|
|
+ query: { back: 1, id: row.id, type: row.warn_type },
|
|
|
+ })
|
|
|
+ } else if (row.warn_type == "000100006") {
|
|
|
+ router.push({
|
|
|
+ path: "/warnList/disConnect",
|
|
|
+ query: { back: 1, id: row.id, type: row.warn_type },
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ router.push({
|
|
|
+ path: "/warnList/overdueWarn",
|
|
|
+ query: { back: 1, id: row.id, type: row.warn_type },
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+function notity(row: any) {
|
|
|
+ formData.value = Object.assign({}, row)
|
|
|
+ formData.value.content = ""
|
|
|
+ formData.value.notifier = ""
|
|
|
+ if (formData.value.warn_starttime) {
|
|
|
+ formData.value.warn_starttime = moment(formData.value.warn_starttime, "YYYYMMDD").format("YYYY-MM-DD")
|
|
|
+ }
|
|
|
+ operationType.value = "N"
|
|
|
+ modal.value.show()
|
|
|
+}
|
|
|
+
|
|
|
+function onSave() {
|
|
|
+ if (operationType.value == "D") {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const data = {
|
|
|
+ name: formData.value.warn_type,
|
|
|
+ company_id: formData.value.company_id,
|
|
|
+ type: 0,
|
|
|
+ warn_id: formData.value.id,
|
|
|
+ content: formData.value.content,
|
|
|
+ notifier: formData.value.notifier,
|
|
|
+ }
|
|
|
+ Rs.post("sys/notice/sendNotice", { data }).then(() => {
|
|
|
+ table.value.search()
|
|
|
+ })
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <div>warnList -- {{ company.name }}</div>
|
|
|
+ <VbDataTable
|
|
|
+ ref="table"
|
|
|
+ :header="cols"
|
|
|
+ url="sys/warn/getWarnForPage"
|
|
|
+ method="post"
|
|
|
+ :query-params="queryParams"
|
|
|
+ :has-checkbox="false"
|
|
|
+ >
|
|
|
+ <template v-slot:table-tool="">
|
|
|
+ <el-form class="align-items-center" :inline="true">
|
|
|
+ <el-form-item class="mb-0 me-5 align-items-center" label="商户名称">
|
|
|
+ <el-input
|
|
|
+ class=""
|
|
|
+ :style="dySearchSelectStyle"
|
|
|
+ v-model="companyName"
|
|
|
+ placeholder="请输入商户名称"
|
|
|
+ :size="size"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item class="mb-0 me-5 align-items-center" label="区域">
|
|
|
+ <OrgSelectTree v-model:value="orgId" :style="dySearchSelectStyle"></OrgSelectTree>
|
|
|
+ </el-form-item>
|
|
|
+
|
|
|
+ <el-form-item class="mb-0 me-5 align-items-center" label="告警类型">
|
|
|
+ <DySelect
|
|
|
+ v-model="warnType"
|
|
|
+ :formatRemoteData="(v:any)=>{return v?.list}"
|
|
|
+ :url="'sys/dict/getList?code=000100001&key=temp'"
|
|
|
+ :style="dySearchSelectStyle"
|
|
|
+ placeholder="请选择告警类型"
|
|
|
+ ></DySelect>
|
|
|
+ </el-form-item>
|
|
|
+ <!-- <el-form-item class="mb-0 me-5 align-items-center" label="处理结果">
|
|
|
+ <DySelect
|
|
|
+ v-model="abnormalState"
|
|
|
+ :formatRemoteData="(v:any)=>{return v?.list}"
|
|
|
+ :url="'sys/dict/getList?code=000170000&key=temp'"
|
|
|
+ :style="dySearchSelectStyle"
|
|
|
+ placeholder="请选择处理结果"
|
|
|
+ ></DySelect>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item class="mb-0 me-5 align-items-center" label="监测类型">
|
|
|
+ <DySelect
|
|
|
+ v-model="monitoringType"
|
|
|
+ :url="'sys/dict/getCompanyMonitoringType'"
|
|
|
+ :style="dySearchSelectStyle"
|
|
|
+ placeholder="请选择监测类型"
|
|
|
+ ></DySelect>
|
|
|
+ </el-form-item> -->
|
|
|
+ <el-form-item class="mb-0 me-5 align-items-center" label="日期">
|
|
|
+ <el-date-picker
|
|
|
+ v-model="dateRange"
|
|
|
+ type="daterange"
|
|
|
+ range-separator="~"
|
|
|
+ start-placeholder="开始时间"
|
|
|
+ end-placeholder="结束时间"
|
|
|
+ :size="size"
|
|
|
+ style="width: 230px"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item class="mb-0 me-0 align-items-center">
|
|
|
+ <el-button class="ms-3 mt-0 btn btn-sm btn-primary" @click="query">查询</el-button>
|
|
|
+ <el-button class="ms-3 mt-0 btn btn-sm btn-light-primary btn-outline" @click="reset">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </template>
|
|
|
+ <template #company_name="{ row }">
|
|
|
+ <span class="text-primary" @click="jump(row)" style="cursor: pointer">{{ row["company_name"] }}</span>
|
|
|
+ </template>
|
|
|
+ <template #warn_starttime="{ row }">
|
|
|
+ {{ moment(row["warn_starttime"], "YYYYMMDDHHmmss").format("YYYY-MM-DD HH:mm:ss") }}
|
|
|
+ </template>
|
|
|
+ <template #abnormal_date="{ row }">
|
|
|
+ {{ row["abnormal_date"] ? moment(row["abnormal_date"], "YYYYMMDDHHmmss").format("YYYY-MM-DD HH:mm:ss") : "" }}
|
|
|
+ </template>
|
|
|
+ <template #action="{ row }">
|
|
|
+ <div class="text-danger text-center">
|
|
|
+ <span class="table-action" @click="detail(row)">查看详情</span>
|
|
|
+ <span class="table-action" @click="notity(row)">下发通知</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </VbDataTable>
|
|
|
+ <VbModal
|
|
|
+ v-model:modal="modal"
|
|
|
+ v-model:form-data="formData"
|
|
|
+ :form-items="formItems"
|
|
|
+ :title="modalTitle"
|
|
|
+ :confirm-btn="operationType == 'N'"
|
|
|
+ :close-btn-class="`btn btn-${operationType == 'N' ? 'light' : 'primary'}`"
|
|
|
+ @confirm="onSave"
|
|
|
+ >
|
|
|
+ <template #body>
|
|
|
+ <el-row v-if="operationType == 'D'">
|
|
|
+ <el-col :span="12">
|
|
|
+ <dl>
|
|
|
+ <dt>是否清洗：</dt>
|
|
|
+ <dd>{{ details.is_clear ? "已清洗" : "未清洗" }}</dd>
|
|
|
+ </dl>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <dl>
|
|
|
+ <dt>清洗时间：</dt>
|
|
|
+ <dd>{{ details.clear_date }}</dd>
|
|
|
+ </dl>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <dl>
|
|
|
+ <dt>备注：</dt>
|
|
|
+ <dd>{{ details.remark }}</dd>
|
|
|
+ </dl>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </template>
|
|
|
+ </VbModal>
|
|
|
</template>
|
