|
|
@@ -0,0 +1,124 @@
|
|
|
+<template>
|
|
|
+ <div class="mainContainer">
|
|
|
+ <div class="mainTitle">职业技能配置</div>
|
|
|
+ <el-table :data="tableData" style="width: 100%;margin-bottom: 20px;" row-key="id" border default-expand-all :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
|
|
|
+ <el-table-column prop="name" label="名称" width="200"></el-table-column>
|
|
|
+ <el-table-column prop="slug" label="别名" width="200"></el-table-column>
|
|
|
+ <el-table-column prop="sort" label="排序"></el-table-column>
|
|
|
+ <el-table-column label="操作">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button size="mini" type="success" v-if="scope.row.children">新增技能</el-button>
|
|
|
+ <el-button size="mini" type="primary" v-else @click="editDialog = true">编辑</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-button type="primary" size="medium" @click="save">保存</el-button>
|
|
|
+
|
|
|
+ <el-dialog title="编辑技能" :visible.sync="editDialog" width="500px">
|
|
|
+ <el-form :model="form" :label-position="labelPosition" label-width="70px">
|
|
|
+ <el-form-item label="技能名称">
|
|
|
+ <el-input v-model="form.name" autocomplete="off"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="技能别名" >
|
|
|
+ <el-input v-model="form.slug" autocomplete="off"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="排序" >
|
|
|
+ <el-input v-model="form.sort" autocomplete="off" placeholder="请输入数字"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button size="medium" @click="editDialog = false">取消</el-button>
|
|
|
+ <el-button size="medium" type="primary" @click="editDialog = false">确定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ tableData: [{
|
|
|
+ id: 1,
|
|
|
+ name: '后端',
|
|
|
+ slug: 'houduan',
|
|
|
+ sort: 10,
|
|
|
+ children: [{
|
|
|
+ id: 3,
|
|
|
+ name: 'PHP',
|
|
|
+ slug: 'php',
|
|
|
+ sort: 1
|
|
|
+ }, {
|
|
|
+ id: 4,
|
|
|
+ name: 'JS',
|
|
|
+ slug: 'js',
|
|
|
+ sort: 2
|
|
|
+ }]
|
|
|
+ }],
|
|
|
+ editDialog: false,
|
|
|
+ labelPosition: 'right',
|
|
|
+ form: {
|
|
|
+ name: '',
|
|
|
+ slug: '',
|
|
|
+ sort: ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ // this.getFinanceList();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+
|
|
|
+ // // 获取列表数据
|
|
|
+ // async getFinanceList() {
|
|
|
+ // let body = {
|
|
|
+ // page: this.currentPage,
|
|
|
+ // size: this.currentPageSize,
|
|
|
+ // user: this.$route.query.user
|
|
|
+
|
|
|
+ // };
|
|
|
+ // const res = await this.$post("/api/admin/user_credit/get_orders", body);
|
|
|
+ // var data = res.data;
|
|
|
+ // this.finaceList = data.orders;
|
|
|
+ // console.log(data.count);
|
|
|
+ // this.totalCount = Number(data.count.all);
|
|
|
+ // this.waitCount = Number(data.count.wait);
|
|
|
+ // this.successCount = Number(data.count.approve);
|
|
|
+ // this.failCount = Number(data.count.reject);
|
|
|
+ // },
|
|
|
+ // async downFinanceList() {
|
|
|
+ // let body = {
|
|
|
+ // page: this.currentPage,
|
|
|
+ // page_size: this.currentPageSize,
|
|
|
+ // user: this.$route.query.user
|
|
|
+ // };
|
|
|
+ // var url =
|
|
|
+ // window.location.host + "/api/admin/order/export?" + "artificial_mark=1";
|
|
|
+ // console.log(url);
|
|
|
+ // window.location.href = "https://" + url;
|
|
|
+ // },
|
|
|
+
|
|
|
+ save() {
|
|
|
+ console.log(this.tableData);
|
|
|
+ },
|
|
|
+
|
|
|
+ }
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+
|
|
|
+ .custom-tree-node {
|
|
|
+ flex: 1;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 14px;
|
|
|
+ padding-right: 8px;
|
|
|
+ }
|
|
|
+</style>
|