simulation-front/src/views/systemManagement/sceneLibraryManagement/trafficAccidentSimulationScene.vue

<template>
    <div>
        <search-layout :needBox="true">
            <template slot="searchItem1">
                <span class="label">场景来源</span>
                <el-input
                    v-model="searchParams.a1"
                    size="small"
                    clearable
                    placeholder="请输入"
                    maxlength="60"
                >
                </el-input>
            </template>
            <template slot="searchItem2">
                <span class="label">事故类型</span>
                <el-select v-model="searchParams.a2">
                    <!--<el-option
                        v-for="item in list"
                        :label="item.caption"
                        :value="item.code"
                        :key="item.code"
                    ></el-option>-->
                </el-select>
            </template>
            <template slot="searchItem3">
                <span class="label">道路类型</span>
                <el-select v-model="searchParams.a3">
                    <!--<el-option
                        v-for="item in list"
                        :label="item.caption"
                        :value="item.code"
                        :key="item.code"
                    ></el-option>-->
                </el-select>
            </template>
            <template slot="searchItem4">
                <span class="label">地区</span>
                <el-select v-model="searchParams.a4">
                    <!--<el-option
                        v-for="item in list"
                        :label="item.caption"
                        :value="item.code"
                        :key="item.code"
                    ></el-option>-->
                </el-select>
            </template>
            <template slot="searchItem5">
                <span class="label">适用功能</span>
                <el-select v-model="searchParams.a5">
                    <!--<el-option
                        v-for="item in list"
                        :label="item.caption"
                        :value="item.code"
                        :key="item.code"
                    ></el-option>-->
                </el-select>
            </template>
            <template slot="searchItem6">
                <span class="label">目标类型</span>
                <el-select v-model="searchParams.a6">
                    <!--<el-option
                        v-for="item in list"
                        :label="item.caption"
                        :value="item.code"
                        :key="item.code"
                    ></el-option>-->
                </el-select>
            </template>
            <template slot="searchItem7">
                <span class="label">是否存在盲区</span>
                <el-radio v-model="searchParams.a7" label="1"
                    >是</el-radio
                >
                <el-radio v-model="searchParams.a7" label="0"
                    >否</el-radio
                >
            </template>
            <template slot="searchItem8">
                <span class="label">是否发生碰撞</span>
                <el-radio v-model="searchParams.a8" label="1"
                    >是</el-radio
                >
                <el-radio v-model="searchParams.a8" label="0"
                    >否</el-radio
                >
            </template>

            <template slot="searchBtn1">
                <el-button type="primary" @click="doSearch">查询</el-button>
            </template>
            <template slot="searchBtn2">
                <el-button type="primary" @click="doReset">重置</el-button>
            </template>
        </search-layout>

        <div class="myTabsBox myTabsBoxThreeTabs">
            <el-button
                v-bind:class="{ addBtn: true}"
                icon="el-icon-circle-plus-outline"
                @click="addOne"
                type="primary"
                >数据导入</el-button
            >
        </div>

        <tableList
            ref="table"
            style="margin: 0 30px"
            :columns="columns"
            :getDataWay="getDataWay"
            :pagination="pagination"
            index
        >
            <el-table-column label="操作" slot="cgInfos" align="center">
                <template v-slot="scope">
                    <i
                        @click="editRow(scope.row)"
                        class="el-icon-edit-outline elIcon"
                        title="编辑"
                    ></i>
                    <i
                        @click="delOne(scope.row)"
                        class="el-icon-delete elIcon"
                        title="删除"
                    ></i>
                </template>
            </el-table-column>
        </tableList>
    </div>
</template>

<script>
import searchLayout from "@/components/grid/searchLayout";
import tableList from "@/components/grid/TableList";

export default{
    name:"trafficAccidentSimulationScene",
    components:{searchLayout, tableList},
    data(){
        return {
            searchParams: {
                //搜索参数
                
            },
            getDataWay:{
                //dataType: "url",
                dataType: "data",
                type: "post",
                // firstRequest: false,
                // data: this.$api.algorithmsLibrary.selectSharedAlgorithmList,
                data:[{a1:'1',a2:'2',a3:'3',a4:'4',a5:'5',a6:'6'}],
                param: {},
            },
            columns: [
                //表格列
                {
                    label: "场景名称",
                    prop: "a1",
                },
                {
                    label: "场景来源",
                    prop: "a2",
                },
                {
                    label: "事故类型",
                    prop: "a3",
                },
                {
                    label: "道路类型",
                    prop: "a4",
                },
                {
                    label: "时间",
                    prop: "a5",
                },
                {
                    label: "天气",
                    prop: "a6",
                },
                {
                    label: "操作",
                    prop: "cgInfos",
                    template: true
                }
            ],
            pagination: {
                //分页使用
                currentPage: 1,
                pageSize: 10,
                position: "right",
                pageSizes: [10, 30, 50, 100, 200],
                layout: "sizes, total, prev, pager, next, jumper",
            },
        }
    },
    methods:{
        doSearch() {
            this.$nextTick(() => {
                this.refreshList(this.searchParams);
            });
        },
        refreshList(param) {
            param
                ? this.$refs["table"].loadData(param)
                : this.$refs["table"].loadData();
        },
        doReset() {
            this.searchParams = {
                
            };
            this.doSearch();
        },
        addOne() {
            
        },
        editRow(row) {
            
        },
        delOne(row) {
            this.$confirm("确认是否删除？", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
            }).then(() => {
                
            });
        },
    }
}
</script>
<style scope lang="less">
.myTabsBox{
    min-height:99px;
}
</style>