<!-- 模板管理列表 -->
<script name="TemplateList" lang="ts" setup>
import type { IlistType } from './template-interface'
import type { TableColumn } from '@/components/NormalTable/table_interface'
import { getTemplateAllList, getTemplateList } from '@/api/quality/template/template'
const { proxy } = getCurrentInstance() as any
const listQuery = ref({
  temName: '',
})
const columns = ref<TableColumn[]>([
  { text: '模板标识', value: 'temTip', align: 'center' },
  { text: '模板名称', value: 'temName', align: 'center' },
  { text: '更新人', value: 'updateName', align: 'center' },
  { text: '更新时间', value: 'updateTime', align: 'center' },
])
const tableList = ref<IlistType[]>([])
const loadingTable = ref(true)
const searchList = () => {
  loadingTable.value = true
  getTemplateAllList(listQuery.value).then((res) => {
    tableList.value = res.data
    loadingTable.value = false
  })
}
searchList()
const clearList = () => {
  listQuery.value.temName = ''
  searchList()
}
const $router = useRouter()
const handler = (type: string, row: IlistType | any) => {
  $router.push({
    path: `/templatelist/${type}`,
    query: {
      row: JSON.stringify(row),
      templateFlag: row.temTip,
    },
  })
}
</script>

<template>
  <app-container>
    <search-area :need-clear="true" @search="searchList" @clear="clearList">
      <search-item>
        <el-input v-model="listQuery.temName" placeholder="模板名称" clearable />
      </search-item>
    </search-area>

    <table-container>
      <!-- <template #btns-right>
        <icon-button icon="icon-add" title="新建" type="primary" />
        <icon-button icon="icon-export" title="导出" type="primary" />
      </template> -->
      <normal-table
        :data="tableList" :columns="columns" :list-loading="loadingTable"
        :is-showmulti-select="false" :is-multi="true" :pagination="false"
      >
        <template #preColumns>
          <el-table-column label="序号" width="55" align="center">
            <template #default="scope">
              {{ scope.$index + 1 }}
            </template>
          </el-table-column>
        </template>
        <template #columns>
          <el-table-column
            label="操作"
            align="center"
            fixed="right"
            width="120"
          >
            <template #default="{ row }">
              <el-button
                v-if="proxy.hasPerm('/quality/template/manager/update')"
                size="small"
                type="primary"
                link
                @click="handler('update', row)"
              >
                编辑
              </el-button>
              <el-button
                size="small"
                type="primary"
                link
                @click="handler('detail', row)"
              >
                详情
              </el-button>
            </template>
          </el-table-column>
        </template>
      </normal-table>
    </table-container>
  </app-container>
</template>