<template>
  <div class="height_100">
    <el-container>
        <el-header>
            <div class="head">
                <div class="head_left">
                    <el-form :inline="true" class="project-file-header-form">
                        <el-form-item label="案号">
                            <el-input v-model="queryParams.number" size="small" placeholder="请输入案号"></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="" size="small" @click="search">查询</el-button>
                        </el-form-item>
                    </el-form>
                </div>
                <div class="head_right">
                    <el-button type="primary" size="small" @click="createNoveltySearch">新建查新检索</el-button>
                </div>
            </div>
        </el-header>
        <el-main class="height_100" v-DivHeight="getDivHeight">
            <el-table :data="tableData" v-if="showTable" border style="width: 100%" header-row-class-name="custom-table-header" @sort-change="sortChange" :height="tableHeight - 20" >
                <el-table-column label="#" width="60" type="index" align="center">
                    <template slot-scope="scope">
                        <span>{{ (scope.$index + 1) + ((queryParams.current - 1) * queryParams.size) }}</span>
                    </template>
                </el-table-column>
                <el-table-column v-for="item in column.filter(item=>!item.ifHidden)" :key="item.value" :prop="item.value" :render-header=" $commonJS.renderHeaderMethods" :label="item.name" :sortable="item.ifSort?'custom':false" align="center">
                    <template slot-scope="scope">
                        <div v-if="['number'].includes(item.value)">
                            <el-link type="primary" @click="handleItem(scope.row,item.value)">
                                <span  v-html="$commonJS.getColumnData(scope.row,item)"></span>
                            </el-link>
                        </div>
                        <div v-else v-html="$commonJS.getColumnData(scope.row,item)"></div>
                    </template>
                </el-table-column>

                <el-table-column  label="操作" align="center" width="150px">
                    <template slot-scope="scope">
                        <el-dropdown @command="handleCommand($event, scope.row)" split-button type="primary" size="small"  @click="handleCommand('e',scope.row)">
                            <span>编辑</span>
                            <el-dropdown-menu slot="dropdown" class="text-align_center">
                                <el-dropdown-item command="search">检索 </el-dropdown-item>
                                <el-dropdown-item command="searchRecord">检索记录 </el-dropdown-item>
                                <el-dropdown-item command="contrastFile">对比文件 </el-dropdown-item>
                                <el-dropdown-item command="exportReport">导出报告 </el-dropdown-item>
                                <el-dropdown-item command="del" divided style="color: red;">删除 </el-dropdown-item>
                            </el-dropdown-menu>
                        </el-dropdown>
                    </template>
                </el-table-column>
            </el-table>
        </el-main>
        <el-footer class="pagination">
            <el-pagination background layout="total,sizes, prev, pager, next, jumper" :current-page.sync="queryParams.current"
            :page-sizes="pageSize" :page-size.sync="queryParams.size" @current-change="handleCurrentChange" @size-change="handleSizeChange" :total="total">
            </el-pagination>
        </el-footer>
    </el-container>
    <reportTemplate ref="reportTemplate"></reportTemplate>
  </div>
</template>

<script>
import { getTableHeight } from '@/views/components/mixins'
import reportTemplate from '@/views/analyse/custom/components/dialog/reportTemplate.vue';
const column = [
    {
        value:'number',
        type:'string',
        name:'案号',
    },
    {
        value:'createName',
        type:'string',
        name:'创建人',
    },
    {
        value:'createTime',
        type:'string',
        name:'创建时间',
    },
]
export default {
    mixins:[getTableHeight],
  components: {
    reportTemplate
  },
  props: {},
  data() {
    return {
        pageSize: [10, 20],//分页数量
        queryParams:{
            current:1,
            size:10,
            number:''
        },
        total:0,
        tableData:[],
        column:column,
    };
  },
  watch: {},
  computed: {},
  created() {},
  mounted() {
    this.getList()
  },
  methods: {
    //检索
    search(){
        this.queryParams.current = 1
        this.getList()
    },
    //获取数据
    getList(){
        this.tableData = [
            {
                id:1,
                number:'5W262525',
                createName:'管理员',
                createTime:'2024-09-06 17:04'
            },
            {
                id:2,
                number:'5W131553',
                createName:'管理员',
                createTime:'2024-09-06 17:04'
            }
        ]
        this.total = 2
    },
    //切换分页
    handleCurrentChange(val){
        this.queryParams.current = val
        this.getList()
    },
    //切换也大小
    handleSizeChange(val){
        this.queryParams.current = 1
        this.queryParams.size = 10
        this.getList()
    },
    //排序
    sortChange({ column, prop, order }){},
    //点击案号
    handleItem(row){
        this.$router.push({
            path:'/noveltySearchDetails',
            query:{
                projectId:row.id
            }
        })
    },
    //操作
    handleCommand(event,row){
        switch(event){
            case 'search'://检索
                this.$router.push(
                    {
                        path:'/conditionImport',
                    }
                )
                break;
            case "searchRecord"://检索记录
                this.$router.push(
                    {
                        path:'/noveltySearchRecord',
                    }
                )   
                break;
            case "contrastFile"://对比文件
                this.$router.push(
                    {
                        path:'/noveltySearchFile',
                    }
                ) 
                break;
            case "exportReport"://导出报告
                this.$refs.reportTemplate.open()
                break;
            case 'del'://删除
                break;
            case 'e'://编辑
                break;
        }
    },
    //创建查新检索
    createNoveltySearch(){
        var number = ''
        this.$prompt('请输入卷号', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          inputPattern: '',
          inputErrorMessage: '格式不正确',
          inputValue:number,
          inputPlaceholder:'请输入卷号'
        }).then(({ value }) => {
            this.$router.push(
                {
                    path:'/conditionImport',
                }
            )
        })
    },
  },
};
</script>
<style lang="scss" scoped>
.head{
    width: 100%;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
</style>