<template>
    <ATitle label="评级记录列表"></ATitle>
    <a-table class="ant-table-striped" size="middle" :columns="columns" :data-source="data" :row-class-name="
        (_record, index) => (index % 2 === 1 ? 'table-striped' : null)
    ">
        <template #bodyCell="{ column, record }">
            <template v-if="column.dataIndex === 'title'">
                <a @click="routeToDetail">
                    {{ record.title }}
                </a>
            </template>
        </template>
    </a-table>
    <div class="form_footer">
        <a-space>
            <a-button @click="router.go(-1)" type="default">返回</a-button>
        </a-space>
    </div>
</template>

<script setup>
import { reactive } from "vue"
import { useRouter } from "vue-router"
import { PlusOutlined } from "@ant-design/icons-vue"
import ATitle from "@/components/ATitle.vue";
const router = useRouter()

const labelCol = {
    style: {
        width: "120px",
    },
};
const wrapperCol = {
    span: 14,
};
const formState = reactive({
    name: "",
    projectName: "",
    projectAddress: "",
    unitName: "",
    budget: 0,
    editor: "",
    tel: "",
});

const columns = [
    {
        title: "序号",
        align: "center",
        width: 80,
        customRender: (data) => {
            return data.index + 1;
        },
    },
    {
        title: "标题",
        dataIndex: "title"
    },
    {
        title: "产品名称",
        dataIndex: "name",
    },
    {
        title: "时间",
        dataIndex: "date",
    }
];
const data = [
    {
        title: "合格供方评价登记表01",
        name: "商品混凝土",
        date: "2022-11-21"
    },
    {
        title: "合格供方评价登记表02",
        name: "商品混凝土",
        date: "2022-11-21"
    },
    {
        title: "合格供方评价登记表03",
        name: "商品混凝土",
        date: "2022-11-21"
    },
    {
        title: "合格供方评价登记表04",
        name: "商品混凝土",
        date: "2022-11-21"
    },
    {
        title: "合格供方评价登记表05",
        name: "商品混凝土",
        date: "2022-11-21"
    },
    {
        title: "合格供方评价登记表06",
        name: "商品混凝土",
        date: "2022-11-21"
    }
];
function routeToDetail() {
	router.push("/evaluateDetail");
}
</script>

<style lang="scss" scoped>
.ant-table-striped :deep(.table-striped) td {
    background-color: #fafafa;
}
</style>
