my_loan/htmldev/accessmanage/src/views/project/filterPath.vue

<template>
    <div>
        <el-dialog title="公共方法配置" :visible.sync="dialog" width="950px" :close-on-click-modal="false" top="50px">
            <p class="top-tip fc-theme">公共方法列表
                <el-button type="primary" v-permission="'method_list_add'" @click="add">添加</el-button>
            </p>
            <el-table :data="tableData" stripe v-loading="tableLoading" fit class="marginT-10 order-table" border :max-height="vheight">
                <el-table-column label="方法ID" prop="id"></el-table-column>
                <el-table-column label="方法路径" prop="method_path"></el-table-column>
                <el-table-column label="方法描述" prop="method_desc"></el-table-column>
                <el-table-column label="操作" width="180">
                    <template slot-scope="scope">
                        <el-button type="text" @click="edit(scope.row)" v-permission="'method_list_edit'">编辑</el-button>
                        <el-button type="text" @click="del(scope.row)" v-permission="'method_list_del'">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination
                class="marginT-20"
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :hide-on-single-page="true"
                :current-page="page"
                :page-size="page_size"
                :page-sizes="[10, 20, 100, 200, 300, 400]"
                background
                layout="total, sizes, prev, pager, next, jumper"
                :total="totalCount" />
            <div slot="footer" class="dialog-footer text-center">
                <el-button @click="dialog = false">取 消</el-button>
                <el-button type="danger" @click="dialog = false">确 定</el-button>
            </div>
        </el-dialog>
        <filterAdd v-if="filterAddDialog.show" v-model="filterAddDialog.show" :exData="filterAddDialog.exData" @success="init"></filterAdd>
    </div>
</template>

<script>
import page from '@/mixin/page'
import filterAdd from './components/filterAdd';
export default {
    mixins: [page],
    components: {
        filterAdd,
    },
    props: {
        value: {
            type: Boolean,
            default: true
        },
        exData: {
            type: Object,
            default: function (){
              return {}
            }
        }
    },
    data() {
        return {
            filterAddDialog: {
                show: false,
                exData: {}
            },
            searchForm: {},
            tableData: [],
            tableUrl: '/method/list',
            dialog: !!this.value,

        }
    },
    methods: {
        add() {
            this.filterAddDialog.exData = {
                method_project_id: this.exData.id
            }
            this.filterAddDialog.show = true
        },
        edit(row) {
            this.filterAddDialog.exData = row
            this.filterAddDialog.show = true
        },
        del(row) {
            this.$confirm('确定要删除吗', '确认', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(async () => {
                const data = await this.$fetch('/method/del', {id: row.id})
                if (data.code == 200) {
                    this.$message.success('删除成功')
                    this.init()
                }
            }).catch(() => {})
        }
    },
    mounted () {
        this.init()
    },
    watch: {
        dialog(val) {
            if (!val) this.$emit('input', val)
        }
    }
}
</script>

<style lang="scss" scoped>
.top-tip {
    margin-top: -20px;
    margin-bottom: 20px;
}
</style>