<template>
  <div class="timedTask from-clues">
    <div class="from-clues-header">
      <el-form ref="ruleForm" :model="form" label-width="100px">
       <el-form-item>
          <Breadcrumb />
        </el-form-item>
        <el-row class="mb-5">
          <el-col :span="2" class="btnColRight">
            <btn nativeType="cx" @click="handleAdd()">新增菜单</btn>
          </el-col>
        </el-row>
      </el-form>
    </div>
    <div class="from-clues-content">
      <lb-table
        :column="tableData.columns"
        :data="tabledata"
        row-key="id"
        default-expand-all
        :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
      >
      </lb-table>
    </div>
    <edit-dialog ref="dialogForm" />
   <authorizationdiglog ref="rolesForm" />
  </div>
</template>
<script>
// 定时任务
import data from "./data";
import EditDialog from "./edit-dialog.vue";
import authorizationdiglog from "./authorizationdiglog.vue";
export default {
  name: "menus",
  components: {
    EditDialog,
    authorizationdiglog,
  },
  data() {
    return {
      tabledata: [
        {
          id: "c6221838-187b-4a7a-b173-b0543022f560",
          createdAt: "2021-08-26T07:00:07.101+0000",
          updatedAt: "2021-08-26T07:00:07.101+0000",
          createdBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
          updatedBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
          sort: 35,
          name: "概览",
          code: "GL",
          description: null,
          uri: null,
          parentId: null,
          state: null,
          style: null,
          icon: "",
          jumpMode: 1,
          productId: "d798323e-8834-4417-bbb8-837b8d13e7d5",
          resourceCategoryId: "d798323e-8834-4417-bbb8-837b8d585656",
          metadata: null,
          children: [
            {
              id: "abf28772-a719-44bd-b461-f63ab9e0a53d",
              createdAt: "2022-03-04T08:08:25.703+0000",
              updatedAt: "2022-03-04T09:21:19.578+0000",
              createdBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
              updatedBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
              sort: 197,
              name: "资源概览",
              code: "ZYGL2",
              description: null,
              uri: "/admin/#/resource-overview",
              parentId: "c6221838-187b-4a7a-b173-b0543022f560",
              state: null,
              style: null,
              icon: "",
              jumpMode: 1,
              productId: "d798323e-8834-4417-bbb8-837b8d13e7d5",
              resourceCategoryId: "d798323e-8834-4417-bbb8-837b8d585656",
              metadata:
                '{"icon":"resource-overview","iconActive":"resource-overview-active"}',
              children: null,
            },
            {
              id: "06a0807e-11f5-4046-b245-3bb7b835b1c5",
              createdAt: "2022-03-04T08:09:18.106+0000",
              updatedAt: "2022-03-04T09:21:24.292+0000",
              createdBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
              updatedBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
              sort: 196,
              name: "访问概览",
              code: "FWGL",
              description: null,
              uri: "/admin/#/access-overview",
              parentId: "c6221838-187b-4a7a-b173-b0543022f560",
              state: null,
              style: null,
              icon: "",
              jumpMode: 1,
              productId: "d798323e-8834-4417-bbb8-837b8d13e7d5",
              resourceCategoryId: "d798323e-8834-4417-bbb8-837b8d585656",
              metadata:
                '{"icon":"access-overview","iconActive":"access-overview-active"}',
              children: null,
            },
          ],
        },
        {
          id: "f94c92cb-a032-4b89-8722-79dbcc331894",
          createdAt: null,
          updatedAt: null,
          createdBy: null,
          updatedBy: null,
          sort: 59,
          name: "资源管理",
          code: "ZYGL",
          description: null,
          uri: null,
          parentId: null,
          state: null,
          style: null,
          icon: "",
          jumpMode: 1,
          productId: "d798323e-8834-4417-bbb8-837b8d13e7d5",
          resourceCategoryId: "d798323e-8834-4417-bbb8-837b8d585656",
          metadata: null,
          children: [
            {
              id: "065fe2d7-d59a-442c-92d0-c91aa19d7fae",
              createdAt: null,
              updatedAt: "2021-11-11T09:40:08.951+0000",
              createdBy: null,
              updatedBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
              sort: 35,
              name: "目录管理",
              code: "MLGL",
              description: null,
              uri: "/admin/#/catalog-manage",
              parentId: "f94c92cb-a032-4b89-8722-79dbcc331894",
              state: null,
              style: null,
              icon: "",
              jumpMode: 1,
              productId: "d798323e-8834-4417-bbb8-837b8d13e7d5",
              resourceCategoryId: "d798323e-8834-4417-bbb8-837b8d585656",
              metadata:
                '{"icon":"tubiao_huaban","iconActive":"tubiao_huaban-active"}',
              children: [
                {
                  id: "0b5952bc-dc7f-4d4e-8fcc-af9d33908c2a",
                  createdAt: null,
                  updatedAt: "2022-03-04T01:46:25.515+0000",
                  createdBy: null,
                  updatedBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
                  sort: 137,
                  name: "服务目录",
                  code: "FWML",
                  description: null,
                  uri: "/admin/#/catalog-manage/catalog-service",
                  parentId: "065fe2d7-d59a-442c-92d0-c91aa19d7fae",
                  state: null,
                  style: null,
                  icon: "",
                  jumpMode: 1,
                  productId: "d798323e-8834-4417-bbb8-837b8d13e7d5",
                  resourceCategoryId: "d798323e-8834-4417-bbb8-837b8d585656",
                  metadata: null,
                  children: null,
                },
                {
                  id: "2377caf7-22e5-4261-b88a-0fbbbace1452",
                  createdAt: null,
                  updatedAt: "2022-03-04T01:47:00.774+0000",
                  createdBy: null,
                  updatedBy: "3127e455-43ba-45ff-9326-0e02ef89485e",
                  sort: -3,
                  name: "应用目录",
                  code: "YYML",
                  description: null,
                  uri: "/admin/#/catalog-manage/catalog-application",
                  parentId: "065fe2d7-d59a-442c-92d0-c91aa19d7fae",
                  state: null,
                  style: null,
                  icon: "",
                  jumpMode: 1,
                  productId: "d798323e-8834-4417-bbb8-837b8d13e7d5",
                  resourceCategoryId: "d798323e-8834-4417-bbb8-837b8d585656",
                  metadata: null,
                  children: null,
                },
              ],
            },
          ],
        },
      ],
      taskData: null,
      form: {
        job_name: "",
        currentPage: 1,
      },
      title: "",
      queryParam: {},
      selectType: "0",
      queryName: "",
      organizationId: "", // 组织机构ID
      departmentId: "", // 部门ID
      departmentList: [], // 部门列表
      levelList: [], // 职务级别
      tableData: [],
      sexList: [],
      typeOptions: [
        {
          value: "0",
          label: "姓名",
        },
        {
          value: "1",
          label: "工号",
        },
        {
          value: "2",
          label: "部门",
        },
        {
          value: "3",
          label: "机构",
        },
      ],

      selectionList: [],
      tableData: {
        columns: [].concat(data.columns()).concat([
          {
            label: "操作",
            width: 380,
            render: (h, scope) => {
              return (
                <div>
                  <el-button
                    type="text"
                    size="mini"
                    icon="el-icon-edit"
                    onClick={() => {
                      this.handleEdit(scope.row);
                    }}
                  >
                    修改
                  </el-button>
                  <el-button
                    type="text"
                    size="mini"
                    icon="el-icon-video-pause"
                    onClick={() => {
                      this.authorizationQuery(scope.row);
                    }}
                  >
                    授权
                  </el-button>
                  <el-button
                    type="text"
                    size="mini"
                    icon="el-icon-delete"
                    style="color:#F56C6C"
                    onClick={() => {
                      this.handleDelete(scope.row.id, scope.row.name);
                    }}
                  >
                    删除
                  </el-button>
                </div>
              );
            },
          },
        ]),
        data: [],
      },
      pageData: {
        total: 5,
        pageSize: 15,
        current: 1,
      },
    };
  },
  methods: {
    // 新增菜单
   handleAdd() {
      this.taskData = null;
      this.$refs.dialogForm.add();
      this.$refs.dialogForm.title = "添加";
    },

    // 修改
    handleEdit(record) {
      this.$refs.dialogForm.edit(record);
      this.$refs.dialogForm.title = "修改";
    },
    // 授权
     authorizationQuery(record) {
      this.$refs.rolesForm.authorization(record);
      this.$refs.rolesForm.title = "授权查询";

    },
    // 删除
    handleDelete(row, id) {
      this.$confirm("此操将进行删除操作, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          // sjsbTask.sjsbTaskRemove(row.id)
          //   .then((res) => {
          //     if ((res.code = 200)) {
          //       this.$message({
          //         type: 'success',
          //         message: res.message,
          //       })
          //       this.featchData()
          //     }
          //   })
          //   .catch((error) => {
          //     this.$alert(error, '提示', {
          //       confirmButtonText: '确定',
          //       type: 'error'
          //     })
          //   })
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消",
          });
        });
    },
  },
};
</script>
<style scoped lang="scss">
@import "~@/styles/mixin.scss";
@import "~@/styles/public.scss";
.btnColRight{
  margin-top: 20px;
  }
/deep/.el-table__expand-icon{
  color: #fff;
}
</style>