v2.0.2更新时间4.16

fei.wang

2025-04-16 0b3d2deb37745ea5dce42fa4a18f22a29d2f4a12

 src/views/alarm/log.vue

@@ -1,8 +1,13 @@
<template>
  <div class="app-container">
    <div class="filter-container">
      <el-input v-model="listQuery.keyword" size="small" placeholder="请输入设备ID/设备名称" clearable
        class="filter-item w-200" />
      <el-input
        v-model="listQuery.keyword"
        size="small"
        placeholder="请输入设备ID/设备名称"
        clearable
        class="filter-item w-200"
      />
      <el-button-group class="filter-item">
        <el-button size="small" type="primary" icon="el-icon-search" @click="search">
          搜索
@@ -13,12 +18,22 @@
        <el-button size="small" type="primary" icon="el-icon-edit" @click="recordsall">
          全部处理
        </el-button>

        <el-button size="small" type="primary" icon="el-icon-delete" @click="deleteall">
          全部删除
        </el-button>
      </el-button-group>
    </div>

    <el-table v-loading="listLoading" :data="list" element-loading-text="Loading" border fit height="100%"
      class="table-container" highlight-current-row>
    <el-table
      v-loading="listLoading"
      :data="list"
      element-loading-text="Loading"
      border
      fit
      height="100%"
      class="table-container"
      highlight-current-row
    >
      <el-table-column fixed label="序号" width="70">
        <template slot-scope="scope">
          {{ scope.row.id }}
@@ -56,13 +71,11 @@
        </template>
      </el-table-column>
      <el-table-column label="处理情况" width="90">

        <template slot-scope="scope">
          {{ scope.row.status }}
        </template>
      </el-table-column>
      <el-table-column label="处理情况" width="90">

        <template slot-scope="scope">
          {{ scope.row.records }}
        </template>
@@ -72,13 +85,29 @@
          {{ scope.row.delltime }}
        </template>
      </el-table-column>
      <el-table-column  label="操作" width="200" v-if="uupdate == 'Yes' || udelete == 'Yes'">
      <el-table-column
        label="操作"
        width="200"
        v-if="uupdate == 'Yes' || udelete == 'Yes'"
      >
        <template slot-scope="scope">
          <el-button-group>
            <el-button v-if="uupdate == 'Yes'" type="primary" icon="el-icon-edit" size="mini" @click="edit(scope)">
            <el-button
              v-if="uupdate == 'Yes'"
              type="primary"
              icon="el-icon-edit"
              size="mini"
              @click="edit(scope)"
            >
              处理
            </el-button>
            <el-button v-if="udelete == 'Yes'" type="danger" icon="el-icon-delete" size="mini" @click="del(scope)">
            <el-button
              v-if="udelete == 'Yes'"
              type="danger"
              icon="el-icon-delete"
              size="mini"
              @click="del(scope)"
            >
              删除
            </el-button>
          </el-button-group>
@@ -86,23 +115,41 @@
      </el-table-column>
    </el-table>

    <pagination v-show="total > 0" :total="total" :page.sync="listQuery.current" :limit.sync="listQuery.size"
      @pagination="fetchData" />
    <pagination
      v-show="total > 0"
      :total="total"
      :page.sync="listQuery.current"
      :limit.sync="listQuery.size"
      @pagination="fetchData"
    />

    <el-dialog :visible.sync="dialogVisible" :title="dialogType === 'modify' ? '修改' : '新增'">
    <el-dialog
      :visible.sync="dialogVisible"
      :title="dialogType === 'modify' ? '修改' : '新增'"
    >
      <el-form ref="dataForm" :model="temp" label-width="120px" label-position="right">
        <el-form-item label="序号" v-if="dialogType != 'modifyall'">
          <el-input v-model="temp.id
            " />
          <el-input v-model="temp.id" />
        </el-form-item>
        <el-form-item label="快速处理">
          <div style="display: flex;">
            <div v-for="option in options" :key="option.value" style="margin-right: 15px;">
            <input type="radio" :id="option.value" :value="option.value" v-model="radio" style="margin-right: 5px;width: 15px;height: 15px;-webkit-appearance: auto;"/>
            <label :for="option.value">{{ option.text }}</label>
          <div style="display: flex">
            <div v-for="option in options" :key="option.value" style="margin-right: 15px">
              <input
                type="radio"
                :id="option.value"
                :value="option.value"
                v-model="radio"
                style="
                  margin-right: 5px;
                  width: 15px;
                  height: 15px;
                  -webkit-appearance: auto;
                "
              />
              <label :for="option.value">{{ option.text }}</label>
            </div>
          </div>
          </div>
       

          <!-- <el-radio-group v-model="radio" class="logradio">
            <input type="radio" v-model="radio1" style="width: 10px;">无需处理
            <input type="radio" v-model="radio2">误报
@@ -113,136 +160,190 @@
          </el-radio-group> -->
        </el-form-item>
        <el-form-item label="处理记录">
          <el-input type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" placeholder="请输入处理记录" v-model="temp.records">
          <el-input
            type="textarea"
            :autosize="{ minRows: 2, maxRows: 4 }"
            placeholder="请输入处理记录"
            v-model="temp.records"
          >
          </el-input>
          <!-- <el-input v-model="temp.records
        " placeholder="请输入处理记录" /> -->
        </el-form-item>
      </el-form>
      <div class="text-right">
        <el-button type="danger" @click="dialogVisible = false">
          取消
        </el-button>
        <el-button type="primary" @click="submit">
          确定
        </el-button>
        <el-button type="danger" @click="dialogVisible = false"> 取消 </el-button>
        <el-button type="primary" @click="submit"> 确定 </el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import { getAlarmrecordPage, delAlarmrecord, addorupAlarmrecord, searchAlarmrecord, addSystemOperationLog, recordsall } from '@/api/Alarmrecord'
import { deepClone } from '@/utils'
import Pagination from "@/components/Pagination";
import {
  getAlarmrecordPage,
  delAlarmrecord,
  addorupAlarmrecord,
  searchAlarmrecord,
  addSystemOperationLog,
  recordsall,
  delAlarmrecordAll,
} from "@/api/Alarmrecord";
import { deepClone } from "@/utils";

const _temp = {
  id: '',
  status: '已处理',
  records: '',
}
  id: "",
  status: "已处理",
  records: "",
};

export default {
  components: {
    Pagination
    Pagination,
  },
  data() {
    return {
      selectedOption: '',
      selectedOption: "",
      options: [
        { text: '无需处理', value: '无需处理' },
        { text: '误报', value: '误报' },
        { text: '已联系', value: '已联系' },
        { text: "无需处理", value: "无需处理" },
        { text: "误报", value: "误报" },
        { text: "已联系", value: "已联系" },
      ],
      uadd: '',
      udelete: '',
      uupdate: '',
      radio: '无需处理',
      uadd: "",
      udelete: "",
      uupdate: "",
      radio: "无需处理",
      total: 0,
      list: [],
      menus: [],
      listLoading: true,
      listQuery: {
        username: localStorage.getItem('username') || '',
        username: localStorage.getItem("username") || "",
        current: 1,
        size: 20,
        keyword: undefined,
        type: 1
        type: 1,
      },
      uploadUrl: '',
      uploadUrl: "",
      temp: Object.assign({}, _temp),
      dialogVisible: false,
      dialogType: 'create',
      loading: false
    }
      dialogType: "create",
      loading: false,
    };
  },

  created() {
    this.fetchData()
    this.fetchData();
  },
  methods: {
    deleteall() {
      if (this.list.length > 0) {
        this.$prompt("输入删除密码", "确认全部删除?", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          // inputPattern: /[\w!#$%&'*+/=?^_`{|}~-]+(?:\.[\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\w](?:[\w-]*[\w])?\.)+[\w](?:[\w-]*[\w])?/,

          inputErrorMessage: "密码错误",
          inputValidator: (value) => {
            //input校验
            if (value != 20151102) {
              return "密码错误";
            }
          },
        })
          .then(({ value }) => {
            console.log(1222222222);

            // const params = { tagid: this.multipleSelection[0].tagid };
            delAlarmrecordAll(this.temp).then((response) => {
              console.log(response);
              this.temp.adminname = localStorage.getItem('username') || '';
              const params = { name:  this.temp.adminname, content: '删除了全部告警日志'};
            addSystemOperationLog(params).then(response => {

                        })
              this.fetchData();
            });
            this.$message({
              type: "success",
              message: "删除成功!",
            });
          })
          .catch(() => {
            this.$message({
              type: "info",
              message: "取消删除",
            });
          });
      } else {
        this.$message({
          type: "info",
          message: "当前已无告警记录",
        });
      }
    },
    recordsall() {
      this.dialogVisible = true
      this.dialogType = 'modifyall'
      this.dialogVisible = true;
      this.dialogType = "modifyall";
    },
    // 搜索
    search() {
      this.listLoading = true
      searchAlarmrecord(this.listQuery).then(response => {
        if (response.data!=null) {
          this.list = response.data.records
          this.total = response.data.total
        }else{
      this.listLoading = true;
      searchAlarmrecord(this.listQuery).then((response) => {
        if (response.data != null) {
          this.list = response.data.records;
          this.total = response.data.total;
        } else {
          this.$message({
            message: '未搜索到数据',
            type: 'error'
          })
            message: "未搜索到数据",
            type: "error",
          });
        }
      
        this.listLoading = false
      })

        this.listLoading = false;
      });
    },
    refresh() {
      this.listQuery = {
        username: localStorage.getItem('username') || '',
        username: localStorage.getItem("username") || "",
        current: 1,
        size: 20,
        keyword: undefined
      }
      this.fetchData()
        keyword: undefined,
      };
      this.fetchData();
    },
    // 分页数据
    fetchData() {
      this.uadd = localStorage.getItem('uadd') || '';
      this.udelete = localStorage.getItem('udelete') || '';
      this.uupdate = localStorage.getItem('uupdate') || '';
      this.listLoading = true
      getAlarmrecordPage(this.listQuery).then(response => {
        this.list = response.data.records
        this.total = response.data.total
        this.listLoading = false
      })
      this.uadd = localStorage.getItem("uadd") || "";
      this.udelete = localStorage.getItem("udelete") || "";
      this.uupdate = localStorage.getItem("uupdate") || "";
      this.listLoading = true;
      getAlarmrecordPage(this.listQuery).then((response) => {
        this.list = response.data.records;
        this.total = response.data.total;
        this.listLoading = false;
      });
    },
    resetTemp() {
      this.temp = Object.assign({}, _temp)
      this.temp = Object.assign({}, _temp);
    },
    add() {
      this.resetTemp()
      this.dialogVisible = true
      this.dialogType = 'create'
      this.resetTemp();
      this.dialogVisible = true;
      this.dialogType = "create";
      // this.$nextTick(() => {
      //   this.$refs['dataForm'].clearValidate()
      // })
    },
    edit(scope) {
      if (scope.row.status == '已处理') {
        this.$message.error('该告警已处理');
      if (scope.row.status == "已处理") {
        this.$message.error("该告警已处理");
      } else {

        this.resetTemp()
        this.dialogVisible = true
        this.dialogType = 'modify'
        this.temp = deepClone(scope.row)
        this.resetTemp();
        this.dialogVisible = true;
        this.dialogType = "modify";
        this.temp = deepClone(scope.row);
        // this.$nextTick(() => {
        //   this.$refs['dataForm'].clearValidate()
        // })
@@ -250,86 +351,88 @@
    },
    changeStatus(value, scope) {
      setTimeout(() => {
        this.list[scope.$index].status = value
        this.list[scope.$index].status = value;
        this.$message({
          message: '更新成功',
          type: 'success'
        })
      }, 300)
          message: "更新成功",
          type: "success",
        });
      }, 300);
    },
    // 删除
    del(scope) {
      this.$confirm('确认删除该条数据吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      this.$confirm("确认删除该条数据吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        setTimeout(() => {
          const params = { id: scope.row.id };
          this.list.splice(scope.$index, 1)
          delAlarmrecord(params).then(response => {
            this.temp.adminname = localStorage.getItem('username') || '';
            const params = { name: this.temp.adminname, content: '删除了一个告警日志，该设备id为：' + scope.row.tagid };
            addSystemOperationLog(params).then(response => {

            })
          this.list.splice(scope.$index, 1);
          delAlarmrecord(params).then((response) => {
            this.temp.adminname = localStorage.getItem("username") || "";
            const params = {
              name: this.temp.adminname,
              content: "删除了一个告警日志，该设备id为：" + scope.row.tagid,
            };
            addSystemOperationLog(params).then((response) => {});
            this.$message({
              message: '删除成功',
              type: 'success'
            })
            this.fetchData()
          })
        }, 300)
      })
              message: "删除成功",
              type: "success",
            });
            this.fetchData();
          });
        }, 300);
      });
    },
    submit() {
      if (this.loading) {
        return
        return;
      }
      if (!this.temp.records) {
        this.temp.records = this.radio
        this.temp.records = this.radio;
      }
      if (this.dialogType == 'modifyall') {
        this.loading = true
      if (this.dialogType == "modifyall") {
        this.loading = true;
        recordsall(this.temp).then(() => {
          this.temp.adminname = localStorage.getItem('username') || '';
          const params = { name: this.temp.adminname, content: '处理了全部告警日志，处理情况为：' + this.temp.records };
          addSystemOperationLog(params).then(response => {

          })
          this.fetchData()
          this.temp.adminname = localStorage.getItem("username") || "";
          const params = {
            name: this.temp.adminname,
            content: "处理了全部告警日志，处理情况为：" + this.temp.records,
          };
          addSystemOperationLog(params).then((response) => {});
          this.fetchData();
          setTimeout(() => {
            this.$message({
              message: '提交成功',
              type: 'success'
            })
            this.dialogVisible = false
            this.loading = false
          }, 300)
        })
              message: "提交成功",
              type: "success",
            });
            this.dialogVisible = false;
            this.loading = false;
          }, 300);
        });
      } else {
        this.loading = true
        this.loading = true;
        addorupAlarmrecord(this.temp).then(() => {
          this.temp.adminname = localStorage.getItem('username') || '';
          const params = { name: this.temp.adminname, content: '处理了一个告警日志，该设备id为：' + this.temp.tagid };
          addSystemOperationLog(params).then(response => {

          })
          this.fetchData()
          this.temp.adminname = localStorage.getItem("username") || "";
          const params = {
            name: this.temp.adminname,
            content: "处理了一个告警日志，该设备id为：" + this.temp.tagid,
          };
          addSystemOperationLog(params).then((response) => {});
          this.fetchData();
          setTimeout(() => {
            this.$message({
              message: '提交成功',
              type: 'success'
            })
            this.dialogVisible = false
            this.loading = false
          }, 300)
        })
              message: "提交成功",
              type: "success",
            });
            this.dialogVisible = false;
            this.loading = false;
          }, 300);
        });
      }

    }
  }
}
    },
  },
};
</script>

<style lang="scss">
@@ -352,24 +455,25 @@
  }
}

.aui-checkbox, input[type=radio] {
    width: 15px;
    height: 15px;
    /* -webkit-appearance: none; */
    /* -webkit-user-select: none; */
.aui-checkbox,
input[type="radio"] {
  width: 15px;
  height: 15px;
  /* -webkit-appearance: none; */
  /* -webkit-user-select: none; */

    /* user-select: none; */
    /* -webkit-transition: background-color .1s ease; */
    /* transition: background-color .1s ease; */
    -ms-flex-negative: 0;
    /* flex-shrink: 0; */
    /* border-radius: 0; */
    /* margin: 0 3px 0 0 !important; */
    /* position: relative; */

}  
  input[type=radio]:checked:after, input[type=radio]:checked:before {
    content: "";
  /* user-select: none; */
  /* -webkit-transition: background-color .1s ease; */
  /* transition: background-color .1s ease; */
  -ms-flex-negative: 0;
  /* flex-shrink: 0; */
  /* border-radius: 0; */
  /* margin: 0 3px 0 0 !important; */
  /* position: relative; */
}
input[type="radio"]:checked:after,
input[type="radio"]:checked:before {
  content: "";
}
.avatar-uploader {
  height: 128px;