<template>
    <!-- 查看标段 -->
    <el-card class="analysis-container">
        <div class="back-container">
            <el-button type="default" size="small" @click="handleBack" class="back-btn">
                返回
            </el-button>
        </div>
        <div class="table-container">
            <TableModel :formLabel="bidFormLabel" :showOperation="true" :showRightTools="false" ref="analysisTableRef"
                :columnsList="bidListColumnsList" :request-api="getBidListAPI" :sendParams="sendParams"
                :handleColWidth="200" :isShowtableCardStyle="false">
                <template slot="parsingState" slot-scope="{ data }">
                    <el-tag v-if="!data.parsingState" type="info">待解析</el-tag>
                    <el-tag v-if="data.parsingState === '0'" type="warn">解析中</el-tag>
                    <el-tag v-else-if="data.parsingState === '1'" type="success">解析成功</el-tag>
                    <el-tag v-else-if="data.parsingState === '2'" type="danger">解析失败</el-tag>
                </template>
                <template slot="tableTitle">
                    <h3>数据列表</h3>
                </template>
                <template slot="handle" slot-scope="{ data }">
                    <el-button type="text" v-hasPermi="['enterpriseLibrary:analysis:detail']" class="action-btn"
                        @click="handleBidDetail(data)">
                        标段解析
                    </el-button>
                    <el-button type="text" v-hasPermi="['enterpriseLibrary:analysis:detail']" class="action-btn"
                        @click="handleDetail(data)">
                        查看
                    </el-button>
                </template>
            </TableModel>
        </div>
    </el-card>
</template>

<script>
import TableModel from '@/components/TableModel2'
import { bidListColumnsList, bidFormLabel } from '../config'
import { encryptWithSM4 } from '@/utils/sm'
import { getBidListAPI, delDataAPI } from '@/api/analysis/analysis'
import { decryptWithSM4 } from '@/utils/sm'
export default {
    name: 'AnalysisBidIndex',
    components: {
        TableModel,
    },
    data() {
        return {
            bidFormLabel,
            bidListColumnsList,
            getBidListAPI,
            sendParams: {
                proId: decryptWithSM4(this.$route.query.proId)
            },
        }
    },

    created() {
    },

    methods: {
        /** 新增按钮操作 */
        handleAdd() {
            this.title = "新建项目";
            this.showAnalysisForm = true;
        },

        /** 修改操作 */
        handleUpdate(row) {
            this.title = "修改项目";
            this.isAdd = 'edit';
            this.row = row;
            this.isflag = true;
        },

        /* 查看操作 */
        handleDetail(row) {
            this.$router.push({
                name: 'AnalysisBidView',
                query: {
                    proId: encryptWithSM4(row.proId + '' || '0'),
                    bidId: encryptWithSM4(row.bidId + '' || '0'),
                }
            })
        },
        /** 标段解析操作 */
        handleBidDetail(row) {
            this.$router.push({
                name: 'AnalysisBidDetail',
                query: {
                    proId: encryptWithSM4(row.proId + '' || '0'),
                    bidId: encryptWithSM4(row.bidId + '' || '0'),
                }
            })
        },


        /* 搜索操作 */
        handleQuery() {
            this.$refs.analysisTableRef.getTableList()
        },

        // 返回上一页
        handleBack() {
            const obj = {
                path: "/analysis",
            }
            this.$tab.closeOpenPage(obj)
        },

    },
}
</script>
<style scoped lang="scss">
.analysis-container {
    height: calc(100vh - 84px);
    overflow: hidden;
    background: linear-gradient(180deg, #F1F6FF 20%, #E5EFFF 100%);
}

::v-deep .table-card {
    height: calc(100vh - 230px) !important;
}



.add-btn {
    width: 121px;
    height: 36px;
    background: #1F72EA;
    box-shadow: 0px 4px 8px 0px rgba(51, 135, 255, 0.5);
    border-radius: 4px 4px 4px 4px;
    color: #fff;
    border: none;
    font-size: 14px;
    transition: all 0.3s;

    &:hover {
        background: #4A8BFF;
        box-shadow: 0px 6px 12px 0px rgba(51, 135, 255, 0.6);
    }
}

.action-btn {
    margin-right: 8px;

    &:last-child {
        margin-right: 0;
    }
}

.back-container {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-bottom: 20px;
    padding: 0 20px;

    .back-btn {
        width: 98px;
        height: 36px;
        background: #FFFFFF;
        box-shadow: 0px 4px 8px 0px rgba(76, 76, 76, 0.2);
        border-radius: 4px;
        border: none;
        color: #666;
        font-size: 14px;
        transition: all 0.3s ease;

        &:hover {
            background: #f5f5f5;
            color: #409EFF;
            box-shadow: 0px 6px 12px 0px rgba(76, 76, 76, 0.3);
        }
    }
}

.table-container {
    ::v-deep .el-card.table-card.is-always-shadow {
        height: calc(100vh - 285px) !important;
    }
}
</style>
