修改预警

src/views/device/warning/index.vue

@@ -62,7 +62,7 @@
       }
       const handleMark = async (record: Recordable) => {
         await markWarningLogs(record.id)
-        message.success('删除成功')
+        message.success('标记成功')
         reload()
       }
 

src/views/device/warning/warning.data.ts

@@ -3,6 +3,8 @@ import dayjs from 'dayjs'
 import { h } from 'vue'
 import { Tag } from 'ant-design-vue'
 import { ColEx } from '/@/components/Form/src/types'
+// import { formatDataByObject } from '/@/utils/index'
+// import { getGriculturalDeviceBasic, getaGriculturalDevicePoint } from '/@/api/sys/user'
 
 const colProps: Partial<ColEx> = {
   xs: 24,
@@ -12,6 +14,43 @@ const colProps: Partial<ColEx> = {
   xl: 6,
   xxl: 4,
 }
+const diviceTypes = [
+  {
+    label: '监控设备',
+    value: 1,
+  },
+  {
+    label: '土壤设备',
+    value: 2,
+  },
+  {
+    label: '水质设备',
+    value: 3,
+  },
+  {
+    label: '气象设备',
+    value: 4,
+  },
+]
+
+const lvOptions = [
+  {
+    label: 'Ⅰ级预警',
+    value: 1,
+  },
+  {
+    label: 'Ⅱ级预警',
+    value: 2,
+  },
+  {
+    label: 'Ⅲ级预警',
+    value: 3,
+  },
+  {
+    label: 'Ⅳ级预警',
+    value: 4,
+  },
+]
 
 const statusOptions = [
   {
@@ -36,6 +75,23 @@ export const columns: BasicColumn[] = [
     title: 'ID',
     dataIndex: 'id',
   },
+  {
+    title: '基地',
+    dataIndex: 'base_name',
+  },
+  {
+    title: '监控点',
+    dataIndex: 'point_name',
+  },
+  {
+    title: '设备类型',
+    dataIndex: 'device_type',
+    customRender: ({ text }) => {
+      const item = diviceTypes.find(({ value }) => value == text)
+
+      return item?.label ?? text
+    },
+  },
   {
     title: '内容',
     dataIndex: 'content',
@@ -44,6 +100,10 @@ export const columns: BasicColumn[] = [
     title: '等级',
     dataIndex: 'lv',
     width: 100,
+    customRender: ({ text }) => {
+      const item = lvOptions.find(({ value }) => value == text)
+      return item?.label ?? text
+    },
   },
   {
     title: '状态',
@@ -78,6 +138,69 @@ export const columns: BasicColumn[] = [
 ]
 
 export const searchFormSchema: FormSchema[] = [
+  // {
+  //   field: 'base',
+  //   component: 'ApiSelect',
+  //   label: '基地',
+  //   colProps,
+  //   componentProps: ({ formModel, formActionType }) => {
+  //     return {
+  //       placeholder: '基地',
+  //       allowClear: true,
+  //       api: getGriculturalDeviceBasic,
+  //       labelField: 'name',
+  //       valueField: 'id',
+  //       onChange: (e: any) => {
+  //         formModel.point = undefined
+  //         if (!e) return
+  //         const { updateSchema } = formActionType
+  //         updateSchema({
+  //           field: 'point',
+  //           componentProps: {
+  //             api: async (e) => {
+  //               const resData = await getaGriculturalDevicePoint(e)
+  //               return formatDataByObject(resData)
+  //             },
+  //             params: {
+  //               device_type: 4,
+  //               agricultural_basic: e,
+  //             },
+  //             labelField: 'label',
+  //             valueField: 'value',
+  //           },
+  //         })
+  //       },
+  //     }
+  //   },
+  // },
+  // {
+  //   field: 'point',
+  //   component: 'ApiSelect',
+  //   label: '监控点',
+  //   colProps,
+  //   componentProps: {
+  //     allowClear: true,
+  //     placeholder: '监控点',
+  //   },
+  // },
+  {
+    field: 'lv',
+    label: '等级',
+    component: 'Select',
+    componentProps: {
+      options: lvOptions,
+    },
+    colProps,
+  },
+  {
+    field: 'device',
+    label: '设备类型',
+    component: 'Select',
+    componentProps: {
+      options: diviceTypes,
+    },
+    colProps,
+  },
   {
     field: 'status',
     label: '状态',

src/views/main/monitor/components/LiveBroadcast.vue

@@ -98,7 +98,7 @@
       colProps,
       componentProps: {
         allowClear: true,
-        placeholder: '检测点',
+        placeholder: '监控点',
       },
     },
   ]

src/views/main/soil-monitoring/index.vue

@@ -18,7 +18,7 @@
                 :options="baseDate"
                 v-model:value="formState.base_id"
                 placeholder="请选择基地"
-              ></Select>
+              />
             </FormItem>
           </Col>
           <Col
@@ -35,7 +35,7 @@
                 placeholder="请选择检测点"
                 :options="pointDate"
                 v-model:value="formState.device_id"
-              ></Select>
+              />
             </FormItem>
           </Col>
           <Col
@@ -51,7 +51,7 @@
                 :disabledDate="disabledDate"
                 @change="onChangTime"
                 v-model:value="formState.time"
-              ></RangePicker>
+              />
             </FormItem>
           </Col>
           <Col
@@ -78,7 +78,7 @@
       </Form>
       <template v-if="baseDate.length === 0">
         <div class="h-500px flex items-center justify-center flex-col">
-          <Empty></Empty>
+          <Empty />
         </div>
       </template>
       <!--  -->
@@ -89,7 +89,8 @@
         </div>
         <div class="mt-20px md:flex enter-y flex-wrap -mr-4">
           <EarlyWarningItem
-            class="md:w-200px w-full !mr-4 !mb-4"
+            class="md:w-200px w-full !mr-4 !mb-4 cursor-pointer"
+            @click="handleWarning(item)"
             v-for="(item, index) in earlyWarningList"
             :key="index"
             :data="item"
@@ -112,6 +113,7 @@
       </template>
     </Card>
     <FormDrawer @register="registerDrawer" @success="handleSuccess" />
+    <WarningModal @register="registerModal" />
   </PageWrapper>
 </template>
 
@@ -126,7 +128,8 @@
   import LineCharts from './components/LineCharts.vue'
   import FormDrawer from './components/FormDrawer.vue'
   import { useDrawer } from '/@/components/Drawer'
-
+  import { useModal } from '/@/components/Modal'
+  import WarningModal from './warningModal.vue'
   import {
     getGriculturalDeviceBasic,
     getaGriculturalDevicePoint,
@@ -150,6 +153,8 @@
   const RadioButton = Radio.Button
   const RadioGroup = Radio.Group
 
+  const [registerModal, { openModal }] = useModal()
+
   const [registerDrawer, { openDrawer }] = useDrawer()
   const formRef = ref<FormInstance>()
   const formState = reactive({
@@ -167,25 +172,30 @@
     icon: String
     title: String
     value: String | Number
+    lv: Number
   }
   const earlyWarningList = computed(() => {
     const arr: EarlyWarningItem[] = [
       {
+        lv: 1,
         icon: 'yujing1',
         title: 'Ⅰ级预警',
         value: '',
       },
       {
+        lv: 2,
         icon: 'yujing2',
         title: 'Ⅱ级预警',
         value: '',
       },
       {
+        lv: 3,
         icon: 'yujing3',
         title: 'Ⅲ级预警',
         value: '',
       },
       {
+        lv: 4,
         icon: 'yujing4',
         title: 'Ⅳ级预警',
         value: '',
@@ -318,6 +328,14 @@
     getPoint()
   }
 
+  const handleWarning = (e) => {
+    openModal(true, {
+      ...e,
+      base: formState.base_id,
+      device: formState.device_id,
+    })
+  }
+
   const handleSetting = () => {
     openDrawer(true, {
       isUpdate: false,

src/views/main/soil-monitoring/warningModal.vue

@@ -0,0 +1,190 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    @register="registerModal"
+    showFooter
+    :title="getTitle"
+    :showOkBtn="false"
+    width="1200px"
+  >
+    <BasicTable @register="registerTable">
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <div class="flex items-center justify-center">
+            <TableAction
+              :actions="[
+                {
+                  label: '标记',
+                  popConfirm: {
+                    title: '是否确认标记',
+                    placement: 'topRight',
+                    confirm: handleMark.bind(null, record),
+                  },
+                  ifShow: record.status == 0,
+                },
+              ]"
+            />
+          </div>
+        </template>
+      </template>
+    </BasicTable>
+  </BasicModal>
+</template>
+<script lang="ts" setup>
+  import { BasicTable, useTable, TableAction } from '/@/components/Table'
+  import { computed, ref, h } from 'vue'
+  import { getWarningLogs, markWarningLogs } from '/@/api/sys/user'
+  import { BasicModal, useModalInner } from '/@/components/Modal'
+  import dayjs from 'dayjs'
+  import { Tag, message } from 'ant-design-vue'
+
+  const diviceTypes = [
+    {
+      label: '监控设备',
+      value: 1,
+    },
+    {
+      label: '土壤设备',
+      value: 2,
+    },
+    {
+      label: '水质设备',
+      value: 3,
+    },
+    {
+      label: '气象设备',
+      value: 4,
+    },
+  ]
+  const lvOptions = [
+    {
+      label: 'Ⅰ级预警',
+      value: 1,
+    },
+    {
+      label: 'Ⅱ级预警',
+      value: 2,
+    },
+    {
+      label: 'Ⅲ级预警',
+      value: 3,
+    },
+    {
+      label: 'Ⅳ级预警',
+      value: 4,
+    },
+  ]
+  const statusOptions = [
+    {
+      value: 0,
+      color: 'red',
+      label: '未处理',
+    },
+    {
+      value: 1,
+      color: 'green',
+      label: '已处理',
+    },
+    {
+      value: 2,
+      color: 'pink',
+      label: '已忽略',
+    },
+  ]
+  const getTitle = computed(() => '预警列表')
+  const params = ref({})
+  const [registerModal] = useModalInner(async (data) => {
+    params.value = data
+    reload()
+  })
+
+  const [registerTable, { reload }] = useTable({
+    pagination: { pageSize: 10, pageSizeOptions: ['10', '20', '30', '40'] },
+    immediate: false,
+    canResize: false,
+    api: async (e) => {
+      const { data, meta } = await getWarningLogs({ ...e, ...params.value })
+      return {
+        items: data,
+        total: meta?.total,
+      }
+    },
+    rowKey: 'id',
+    columns: [
+      {
+        title: 'ID',
+        dataIndex: 'id',
+        width: 80,
+      },
+      {
+        title: '基地',
+        dataIndex: 'base_name',
+      },
+      {
+        title: '监控点',
+        dataIndex: 'point_name',
+      },
+      {
+        title: '设备类型',
+        dataIndex: 'device_type',
+        customRender: ({ text }) => {
+          const item = diviceTypes.find(({ value }) => value == text)
+
+          return item?.label ?? text
+        },
+      },
+      {
+        title: '内容',
+        dataIndex: 'content',
+      },
+      {
+        title: '等级',
+        dataIndex: 'lv',
+        width: 100,
+        customRender: ({ text }) => {
+          const item = lvOptions.find(({ value }) => value == text)
+          return item?.label ?? text
+        },
+      },
+      {
+        title: '状态',
+        dataIndex: 'status',
+        width: 100,
+        customRender: ({ record }) => {
+          const status = record.status
+
+          const list = statusOptions
+          const item = list.find((e) => e.value === status)
+          const color = item?.color ?? 'red'
+          const text = item?.label ?? status
+          return h(Tag, { color: color }, () => text)
+        },
+      },
+      {
+        title: '开始时间',
+        dataIndex: 'created_at',
+        width: 180,
+        customRender: ({ text }) => {
+          if (!text) return ''
+          return dayjs.unix(text).format('YYYY-MM-DD HH:mm:ss')
+        },
+      },
+      {
+        width: 90,
+        title: '操作',
+        dataIndex: 'action',
+        align: 'center',
+        fixed: 'right',
+      },
+    ],
+    useSearchForm: false,
+    showTableSetting: false,
+    bordered: true,
+  })
+
+  const handleMark = async (record: Recordable) => {
+    await markWarningLogs(record.id)
+    message.success('成功')
+    reload()
+  }
+</script>

src/views/main/water-quality/index.vue

@@ -18,7 +18,7 @@
                 :options="baseDate"
                 v-model:value="formState.base_id"
                 placeholder="请选择基地"
-              ></Select>
+              />
             </FormItem>
           </Col>
           <Col
@@ -35,7 +35,7 @@
                 placeholder="请选择检测点"
                 :options="pointDate"
                 v-model:value="formState.device_id"
-              ></Select>
+              />
             </FormItem>
           </Col>
           <Col
@@ -51,7 +51,7 @@
                 :disabledDate="disabledDate"
                 @change="onChangTime"
                 v-model:value="formState.time"
-              ></RangePicker>
+              />
             </FormItem>
           </Col>
           <Col
@@ -78,7 +78,7 @@
       </Form>
       <template v-if="baseDate.length === 0">
         <div class="h-500px flex items-center justify-center flex-col">
-          <Empty></Empty>
+          <Empty />
         </div>
       </template>
       <!--  -->
@@ -89,7 +89,8 @@
         </div>
         <div class="mt-20px md:flex enter-y flex-wrap -mr-4">
           <EarlyWarningItem
-            class="md:w-200px w-full !mr-4 !mb-4"
+            class="md:w-200px w-full !mr-4 !mb-4 cursor-pointer"
+            @click="handleWarning(item)"
             v-for="(item, index) in earlyWarningList"
             :key="index"
             :data="item"
@@ -112,6 +113,7 @@
       </template>
     </Card>
     <FormDrawer @register="registerDrawer" @success="handleSuccess" />
+    <WarningModal @register="registerModal" />
   </PageWrapper>
 </template>
 
@@ -126,7 +128,8 @@
   import LineCharts from './components/LineCharts.vue'
   import FormDrawer from './components/FormDrawer.vue'
   import { useDrawer } from '/@/components/Drawer'
-
+  import { useModal } from '/@/components/Modal'
+  import WarningModal from './warningModal.vue'
   import {
     getGriculturalDeviceBasic,
     getaGriculturalDevicePoint,
@@ -149,6 +152,9 @@
   import type { FormInstance } from 'ant-design-vue'
   const RadioButton = Radio.Button
   const RadioGroup = Radio.Group
+
+  const [registerModal, { openModal }] = useModal()
+
   const [registerDrawer, { openDrawer }] = useDrawer()
   const formRef = ref<FormInstance>()
   const formState = reactive({
@@ -167,6 +173,7 @@
     icon: String
     title: String
     value: String | Number
+    lv: Number
   }
   const earlyWarningList = computed(() => {
     const arr: EarlyWarningItem[] = [
@@ -174,21 +181,25 @@
         icon: 'yujing1',
         title: 'Ⅰ级预警',
         value: '',
+        lv: 1,
       },
       {
         icon: 'yujing2',
         title: 'Ⅱ级预警',
         value: '',
+        lv: 2,
       },
       {
         icon: 'yujing3',
         title: 'Ⅲ级预警',
         value: '',
+        lv: 3,
       },
       {
         icon: 'yujing4',
         title: 'Ⅳ级预警',
         value: '',
+        lv: 4,
       },
     ]
     Object.values(earlyNums.value).forEach((v: number | string, index: number) => {
@@ -318,6 +329,16 @@
     getPoint()
   }
 
+  const handleWarning = (e) => {
+    console.log(e)
+
+    openModal(true, {
+      ...e,
+      base: formState.base_id,
+      device: formState.device_id,
+    })
+  }
+
   const handleSetting = () => {
     openDrawer(true, {
       isUpdate: false,

src/views/main/water-quality/warningModal.vue

@@ -0,0 +1,190 @@
+<template>
+  <BasicModal
+    v-bind="$attrs"
+    @register="registerModal"
+    showFooter
+    :title="getTitle"
+    :showOkBtn="false"
+    width="1200px"
+  >
+    <BasicTable @register="registerTable">
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <div class="flex items-center justify-center">
+            <TableAction
+              :actions="[
+                {
+                  label: '标记',
+                  popConfirm: {
+                    title: '是否确认标记',
+                    placement: 'topRight',
+                    confirm: handleMark.bind(null, record),
+                  },
+                  ifShow: record.status == 0,
+                },
+              ]"
+            />
+          </div>
+        </template>
+      </template>
+    </BasicTable>
+  </BasicModal>
+</template>
+<script lang="ts" setup>
+  import { BasicTable, useTable, TableAction } from '/@/components/Table'
+  import { computed, ref, h } from 'vue'
+  import { getWarningLogs, markWarningLogs } from '/@/api/sys/user'
+  import { BasicModal, useModalInner } from '/@/components/Modal'
+  import dayjs from 'dayjs'
+  import { Tag, message } from 'ant-design-vue'
+
+  const diviceTypes = [
+    {
+      label: '监控设备',
+      value: 1,
+    },
+    {
+      label: '土壤设备',
+      value: 2,
+    },
+    {
+      label: '水质设备',
+      value: 3,
+    },
+    {
+      label: '气象设备',
+      value: 4,
+    },
+  ]
+  const lvOptions = [
+    {
+      label: 'Ⅰ级预警',
+      value: 1,
+    },
+    {
+      label: 'Ⅱ级预警',
+      value: 2,
+    },
+    {
+      label: 'Ⅲ级预警',
+      value: 3,
+    },
+    {
+      label: 'Ⅳ级预警',
+      value: 4,
+    },
+  ]
+  const statusOptions = [
+    {
+      value: 0,
+      color: 'red',
+      label: '未处理',
+    },
+    {
+      value: 1,
+      color: 'green',
+      label: '已处理',
+    },
+    {
+      value: 2,
+      color: 'pink',
+      label: '已忽略',
+    },
+  ]
+  const getTitle = computed(() => '预警列表')
+  const params = ref({})
+  const [registerModal] = useModalInner(async (data) => {
+    params.value = data
+    reload()
+  })
+
+  const [registerTable, { reload }] = useTable({
+    pagination: { pageSize: 10, pageSizeOptions: ['10', '20', '30', '40'] },
+    immediate: false,
+    canResize: false,
+    api: async (e) => {
+      const { data, meta } = await getWarningLogs({ ...e, ...params.value })
+      return {
+        items: data,
+        total: meta?.total,
+      }
+    },
+    rowKey: 'id',
+    columns: [
+      {
+        title: 'ID',
+        dataIndex: 'id',
+        width: 80,
+      },
+      {
+        title: '基地',
+        dataIndex: 'base_name',
+      },
+      {
+        title: '监控点',
+        dataIndex: 'point_name',
+      },
+      {
+        title: '设备类型',
+        dataIndex: 'device_type',
+        customRender: ({ text }) => {
+          const item = diviceTypes.find(({ value }) => value == text)
+
+          return item?.label ?? text
+        },
+      },
+      {
+        title: '内容',
+        dataIndex: 'content',
+      },
+      {
+        title: '等级',
+        dataIndex: 'lv',
+        width: 100,
+        customRender: ({ text }) => {
+          const item = lvOptions.find(({ value }) => value == text)
+          return item?.label ?? text
+        },
+      },
+      {
+        title: '状态',
+        dataIndex: 'status',
+        width: 100,
+        customRender: ({ record }) => {
+          const status = record.status
+
+          const list = statusOptions
+          const item = list.find((e) => e.value === status)
+          const color = item?.color ?? 'red'
+          const text = item?.label ?? status
+          return h(Tag, { color: color }, () => text)
+        },
+      },
+      {
+        title: '开始时间',
+        dataIndex: 'created_at',
+        width: 180,
+        customRender: ({ text }) => {
+          if (!text) return ''
+          return dayjs.unix(text).format('YYYY-MM-DD HH:mm:ss')
+        },
+      },
+      {
+        width: 90,
+        title: '操作',
+        dataIndex: 'action',
+        align: 'center',
+        fixed: 'right',
+      },
+    ],
+    useSearchForm: false,
+    showTableSetting: false,
+    bordered: true,
+  })
+
+  const handleMark = async (record: Recordable) => {
+    await markWarningLogs(record.id)
+    message.success('成功')
+    reload()
+  }
+</script>

src/views/system/links/links.data.ts

@@ -150,7 +150,7 @@ export const columns: BasicColumn[] = [
 export const searchFormSchema: FormSchema[] = [
   {
     field: 'type',
-    label: '动作',
+    label: '类型',
     component: 'Select',
     componentProps: {
       options,
@@ -193,6 +193,9 @@ export const accountFormSchema: FormSchema[] = [
     required: true,
     defaultValue: 1,
     component: 'InputNumber',
+    componentProps: {
+      precision: 0,
+    },
   },
   {
     field: 'is_recommend',