LSSE-front/src/views/simulationScene/database/jcsjk.vue

<template>
  <page-header-wrapper>
    <Grid :columns="['400px', 1]">
      <a-card title="想定列表" class="my-card my-card-has-title" :bordered="false" v-loading="xd.loading">
        <template #extra>
          <a-icon type="sync" style="font-size: 30px" @click="getXdListData()" />
        </template>
        <a-tree
          :treeData="xd.listData"
          :replaceFields="{ title: 'name', key: 'id' }"
          :selectedKeys.sync="xd.selectedKeys"
          @select="handleChangeXdSelected"
        >
        </a-tree>
      </a-card>
      <a-card title="进程列表" class="my-card my-card-has-title" :bordered="false">
        <template #extra>
          <a-icon type="sync" style="font-size: 30px" @click="() => {}" />
        </template>
        <AntQueryTable
          ref="jc-table"
          height="100%"
          :queryConfig="jc.queryConfig"
          :tableConfig="jc.tableConfig"
          :pageConfig="jc.pageConfig"
          :showTool="jc.showTool"
        >
        </AntQueryTable>
      </a-card>
    </Grid>
  </page-header-wrapper>
</template>

<script>
export default {
  name: 'Jcsjk',
  data() {
    return {
      xd: {
        loading: false,
        listData: [],
        selectedKeys: [],
      },
      jc: {
        queryConfig: false,
        tableConfig: {
          table: {},
          immediate: false,
          query: (params) =>
            this.$http({
              url: '/baseData/scenario/taskList',
              method: 'get',
              params: { id: this.xd.selectedKeys[0], ...params },
            }).then((res) => ({
              data: res.data.map(([a, b, c], index) => ({ id: index, 0: a, 1: b, 2: c })),
            })),
          columns: [
            { dataIndex: 'serial' },
            { title: '任务进程名称', dataIndex: '0', width: 'auto', minWidth: 150 },
            { title: '开始时间', dataIndex: '1', width: 'auto', minWidth: 150 },
            { title: '失效时间', dataIndex: '2', width: 'auto', minWidth: 150 },
          ],
        },
        pageConfig: false,
        showTool: false,
      },
    }
  },
  created() {
    this.getXdListData()
  },
  methods: {
    async getXdListData() {
      try {
        this.xd.loading = true
        const res = await this.$http({
          url: `/baseData/scenario/all`,
          method: 'get',
        })
        this.xd.listData = res.data
        if (this.xd.selectedKeys.length === 0) {
          this.xd.selectedKeys = [this.xd.listData[0].id]
          this.handleChangeXdSelected()
        }
      } catch (error) {
        console.log(error)
      } finally {
        this.xd.loading = false
      }
    },
    handleChangeXdSelected() {
      this.$refs['jc-table'].commitAction('query')
    },
  },
}
</script>

<style lang="less" scoped></style>