<template>
  <div class="ele-body">
    <el-card shadow="never">
      <PatrolSearch @search="reload" ruleType="0"> </PatrolSearch>
      <ele-pro-table
        ref="tableRef"
        row-key="id"
        :columns="columns"
        :datasource="datasource"
        :cache-key="cacheKeyUrl"
        autoAmendPage
      >
        <template v-slot:toolbar>
          <el-button
            type="primary"
            size="mini"
            icon="el-icon-plus"
            @click="openEdit('add')"
            >新建</el-button
          >
        </template>
        <template v-slot:code="{ row }">
          <el-link
            type="primary"
            :underline="false"
            @click="openEdit('detail', row)"
            >{{ row.code }}
          </el-link>
        </template>
        <template v-slot:action="{ row }">
          <el-link
            type="primary"
            :underline="false"
            icon="el-icon-edit"
            @click="openEdit('edit', row)"
          >
            修改
          </el-link>
          <el-popconfirm
            class="ele-action"
            title="确定要删除此条数据吗？"
            @confirm="deleteRow(row)"
          >
            <template v-slot:reference>
              <el-link type="danger" :underline="false" icon="el-icon-delete">
                删除
              </el-link>
            </template>
          </el-popconfirm>
        </template>
      </ele-pro-table>
    </el-card>

    <programRulesDialog
      ref="programRulesDialogRef"
      @reload="reload"
    ></programRulesDialog>
  </div>
</template>

<script>
  import dictMixins from '@/mixins/dictMixins';
  import tableColumnsMixin from '@/mixins/tableColumnsMixin';
  import {
    recordrulesPlanConfigPage,
    recordrulesPlanConfigDelete
  } from '@/api/recordrules/index';
  import PatrolSearch from './components/patrol-search.vue';
  import programRulesDialog from './components/programRulesDialog.vue';

  export default {
    mixins: [dictMixins, tableColumnsMixin],
    components: {
      PatrolSearch,
      programRulesDialog
    },
    data() {
      return {
        columns: [
          {
            columnKey: 'index',
            label: '序号',
            type: 'index',
            width: 55,
            align: 'center',
            showOverflowTooltip: true,
            fixed: 'left'
          },
          {
            prop: 'code',
            label: '计划配置单号',
            align: 'center',
            minWidth: 130,
            slot: 'code'
          },
          {
            prop: 'name',
            label: '计划配置名称',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'ruleName',
            label: '记录规则名称',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              return row.list.map((i) => i.ruleName).join(',');
            }
          },
          {
            prop: '',
            label: '记录部门',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              if (row.type == 0) {
                return row.executeUsers.map((i) => i.groupName).join(',');
              }
              return '';
            }
          },
          {
            prop: '',
            label: '负责人',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              if (row.type == 0) {
                return row.executeUsers.map((i) => i.userName).join(',');
              }
              return '';
            }
          },
          {
            prop: 'executeUsers',
            label: '班组',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              if (row.type == 1) {
                return row.executeUsers.map((i) => i.teamName).join(',');
              }
              return '';
            }
          },
          {
            prop: '',
            label: '记录对象',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              return row.list
                .map((i) => i.workshops.map((i) => i.workshopName))
                .flat()
                .join(',');
            }
          },
          {
            prop: 'autoOrder',
            label: '自动派单',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              return row.autoOrder ? '是' : '否';
            }
          },
          {
            prop: 'status',
            label: '状态',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110,
            formatter: (row) => {
              return row.status ? '开启' : '关闭';
            }
          },
          {
            prop: 'createUserName',
            label: '创建人',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            prop: 'createTime',
            label: '创建时间',
            align: 'center',
            showOverflowTooltip: true,
            minWidth: 110
          },
          {
            columnKey: 'action',
            label: '操作',
            width: 220,
            align: 'center',
            resizable: false,
            fixed: 'right',
            slot: 'action',
            showOverflowTooltip: true
          }
        ],
        cacheKeyUrl: 'mes-211191938-record-plan-index'
      };
    },
    computed: {},
    methods: {
      // 刷新表格
      reload(where = {}) {
        this.$refs.tableRef.reload({
          where
        });
      },
      /* 表格数据源 */
      datasource({ page, limit, where, order }) {
        // 参数
        const body = {
          ...where,
          ...order,
          pageNum: page,
          size: limit
        };
        return this.getList(body);
      },
      async getList(body) {
        const data = await recordrulesPlanConfigPage(body);
        data.list = data.list.map((item) => {
          // children 改名
          item.list = item.children;
          delete item.children;
          return item;
        });
        return data;
      },
      search(where) {
        this.reload(where);
      },
      openEdit(type, data) {
        console.log(type);
        this.$refs.programRulesDialogRef.open(type, data);
      },
      async deleteRow(row) {
        await recordrulesPlanConfigDelete([row.id]);
        this.$message.success('删除成功');
        this.reload();
      }
    }
  };
</script>

<style></style>
