factory_web/src/views/ecm/event.vue

<template>
  <el-container>
    <el-header>
			<div class="left-panel">
<el-select v-model="query.cates" placeholder="事件种类" @change="handleQuery">
  <el-option v-for="item in cateOptions" :key="item.id">{{item.name}}</el-option>
</el-select>
			</div>
			<div class="right-panel">

			</div>
		</el-header>
    <el-main class="nopadding">
      <scTable
        ref="table"
        :apiObj="apiObj"
        row-key="id"
        fit
        stripe
        @resetQuery="resetQuery"
      >
        <el-table-column label="#" type="index" width="50"></el-table-column>
        <el-table-column label="事件种类" width="200">
			 <template #default="scope" >
            <el-tag v-for="item in scope.row.cates_"
                    :key="item.id" type="warning">{{item.name}}</el-tag>
          </template>
		</el-table-column>
        <el-table-column label="发生区域" prop="area_.name"></el-table-column>
        <el-table-column label="当事人" prop="employee_.name">
          <template #default="scope">
            <span v-if="scope.row.employee && scope.row.obj_cate == 'people'">{{
              scope.row.employee_.name
            }}</span>
            <span v-else>未知人员</span>
          </template>
        </el-table-column>

        <el-table-column label="人员类型" prop="employee_.type">
          <template #default="scope">
            <span v-if="scope.row.employee && scope.row.obj_cate == 'people'">
              <span
                v-if="
                  scope.row.employee_.type != '' &&
                  scope.row.employee_.type == 'employee'
                "
                >正式员工</span
              >
              <span
                v-if="
                  scope.row.employee_.type != '' &&
                  scope.row.employee_.type == 'remployee'
                "
                >相关方</span
              >
              <span
                v-if="
                  scope.row.employee_.type != '' &&
                  scope.row.employee_.type == 'visitor'
                "
                >访客</span
              >
            </span>
          </template>
        </el-table-column>
        <el-table-column label="发生时间" prop="create_time" width="150"></el-table-column>
      
		  <el-table-column
          label="处理人"
          prop="handle_user_name"
        ></el-table-column>

        <!-- <el-table-column label="处理时间" prop="handle_time"></el-table-column> -->
        <el-table-column label="事件标记" prop="mark">
          <template #default="scope">
            <el-span v-if="scope.row.mark == 20" color="red">误报</el-span>
            <el-span v-else color="green">正常</el-span>
          </template>
        </el-table-column>
        <el-table-column label="处理超时">
          <template #default="scope">
            <el-tag v-if="scope.row.is_timeout" type="warning">是</el-tag>
            <el-tag v-else type="success">否</el-tag>
          </template>
        </el-table-column>
    
        <el-table-column label="操作" fixed="right" align="center">
          <template #default="scope">
              <el-button
                link
                type="info"
                size="small"
                @click="table_show(scope.row, scope.$index)"
                >查看</el-button>
				 <el-button
                link
                type="primary"
                size="small"
                v-if="scope.row.handle_user==null"
                @click="table_handle(scope.row, scope.$index)"
                >处理</el-button>
              <!-- <el-button text type="warning" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button> -->
              <!-- <el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
								<template #reference>
									<el-button text type="danger" size="small">删除</el-button>
								</template>
							</el-popconfirm> -->
          </template>
        </el-table-column>
      </scTable>
    </el-main>
  </el-container>
  
</template>
    <script>
import { CircleCheckFilled, CircleCloseFilled } from "@element-plus/icons-vue";
export default {
  name: "event",
  components: {
    CircleCheckFilled,
    CircleCloseFilled,
	
  },
  data() {
    return {
      dialog: {
        save: false,
        permission: false,
      },
      apiObj: this.$API.ecm.event.list,
      query: {},
      selection: [],
      search: {
        keyword: null,
      },
    };
  },
  methods: {
    //查看
    table_show(row) {
       this.$router.push({
        name: "eventhandlefrom",
        query: {
          id: row.id,
        },
      });
    },
	//事件处理
	table_handle(row) {

		 this.$router.push({
        name: "eventhandlefrom",
        query: {
          id: row.id,
        },
      });
     
    },
    //搜索
    handleQuery() {
				this.$refs.table.queryData(this.query)
			},
    //本地更新数据
   
    resetQuery() {
      this.query = {};
    },
  },
};
</script>