{"remainingRequest":"D:\\HTC\\program\\善行少年\\security-enterprise-admin\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!D:\\HTC\\program\\善行少年\\security-enterprise-admin\\src\\views\\modules\\sys\\menu-add-or-update.vue?vue&type=style&index=0&id=511f72fd&lang=scss","dependencies":[{"path":"D:\\HTC\\program\\善行少年\\security-enterprise-admin\\src\\views\\modules\\sys\\menu-add-or-update.vue","mtime":1581948666000},{"path":"D:\\HTC\\program\\善行少年\\security-enterprise-admin\\node_modules\\css-loader\\index.js","mtime":499162500000},{"path":"D:\\HTC\\program\\善行少年\\security-enterprise-admin\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"D:\\HTC\\program\\善行少年\\security-enterprise-admin\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"D:\\HTC\\program\\善行少年\\security-enterprise-admin\\node_modules\\sass-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\HTC\\program\\善行少年\\security-enterprise-admin\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"D:\\HTC\\program\\善行少年\\security-enterprise-admin\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\r\n.mod-sys__menu {\r\n  .menu-list,\r\n  .icon-list {\r\n    .el-input__inner,\r\n    .el-input__suffix {\r\n      cursor: pointer;\r\n    }\r\n  }\r\n  &-icon-popover {\r\n    width: 458px;\r\n    overflow: hidden;\r\n  }\r\n  &-icon-inner {\r\n    width: 478px;\r\n    max-height: 258px;\r\n    overflow-x: hidden;\r\n    overflow-y: auto;\r\n  }\r\n  &-icon-list {\r\n    width: 458px;\r\n    padding: 0;\r\n    margin: -8px 0 0 -8px;\r\n    > .el-button {\r\n      padding: 8px;\r\n      margin: 8px 0 0 8px;\r\n      > span {\r\n        display: inline-block;\r\n        vertical-align: middle;\r\n        width: 18px;\r\n        height: 18px;\r\n        font-size: 18px;\r\n      }\r\n    }\r\n  }\r\n}\r\n",{"version":3,"sources":["menu-add-or-update.vue"],"names":[],"mappings":";AAyLA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","file":"menu-add-or-update.vue","sourceRoot":"src/views/modules/sys","sourcesContent":["<template>\r\n  <el-dialog :visible.sync=\"visible\" :title=\"!dataForm.id ? $t('add') : $t('update')\" :close-on-click-modal=\"false\" :close-on-press-escape=\"false\">\r\n    <el-form :model=\"dataForm\" :rules=\"dataRule\" ref=\"dataForm\" @keyup.enter.native=\"dataFormSubmitHandle()\" label-width=\"120px\">\r\n      <el-form-item prop=\"type\" :label=\"$t('menu.type')\" size=\"mini\">\r\n        <el-radio-group v-model=\"dataForm.type\" :disabled=\"!!dataForm.id\">\r\n          <el-radio :label=\"0\">{{ $t('menu.type0') }}</el-radio>\r\n          <el-radio :label=\"1\">{{ $t('menu.type1') }}</el-radio>\r\n        </el-radio-group>\r\n      </el-form-item>\r\n      <el-form-item prop=\"name\" :label=\"$t('menu.name')\">\r\n        <el-input v-model=\"dataForm.name\" :placeholder=\"$t('menu.name')\"></el-input>\r\n      </el-form-item>\r\n      <el-form-item prop=\"parentName\" :label=\"$t('menu.parentName')\" class=\"menu-list\">\r\n        <el-popover v-model=\"menuListVisible\" ref=\"menuListPopover\" placement=\"bottom-start\" trigger=\"click\">\r\n          <el-tree\r\n            :data=\"menuList\"\r\n            :props=\"{ label: 'name', children: 'children' }\"\r\n            node-key=\"id\"\r\n            ref=\"menuListTree\"\r\n            :highlight-current=\"true\"\r\n            :expand-on-click-node=\"false\"\r\n            accordion\r\n            @current-change=\"menuListTreeCurrentChangeHandle\">\r\n          </el-tree>\r\n        </el-popover>\r\n        <el-input v-model=\"dataForm.parentName\" v-popover:menuListPopover :readonly=\"true\" :placeholder=\"$t('menu.parentName')\">\r\n          <i v-if=\"dataForm.pid !== '0'\" slot=\"suffix\" @click.stop=\"deptListTreeSetDefaultHandle()\" class=\"el-icon-circle-close el-input__icon\"></i>\r\n        </el-input>\r\n      </el-form-item>\r\n      <el-form-item v-if=\"dataForm.type === 0\" prop=\"url\" :label=\"$t('menu.url')\">\r\n        <el-input v-model=\"dataForm.url\" :placeholder=\"$t('menu.url')\"></el-input>\r\n      </el-form-item>\r\n      <el-form-item prop=\"sort\" :label=\"$t('menu.sort')\">\r\n        <el-input-number v-model=\"dataForm.sort\" controls-position=\"right\" :min=\"0\" :label=\"$t('menu.sort')\"></el-input-number>\r\n      </el-form-item>\r\n      <el-form-item prop=\"permissions\" :label=\"$t('menu.permissions')\">\r\n        <el-input v-model=\"dataForm.permissions\" :placeholder=\"$t('menu.permissionsTips')\"></el-input>\r\n      </el-form-item>\r\n      <el-form-item v-if=\"dataForm.type === 0\" prop=\"icon\" :label=\"$t('menu.icon')\" class=\"icon-list\">\r\n        <el-popover v-model=\"iconListVisible\" ref=\"iconListPopover\" placement=\"bottom-start\" trigger=\"click\" popper-class=\"mod-sys__menu-icon-popover\">\r\n          <div class=\"mod-sys__menu-icon-inner\">\r\n            <div class=\"mod-sys__menu-icon-list\">\r\n              <el-button\r\n                v-for=\"(item, index) in iconList\"\r\n                :key=\"index\"\r\n                @click=\"iconListCurrentChangeHandle(item)\"\r\n                :class=\"{ 'is-active': dataForm.icon === item }\">\r\n                <svg class=\"icon-svg\" aria-hidden=\"true\"><use :xlink:href=\"`#${item}`\"></use></svg>\r\n              </el-button>\r\n            </div>\r\n          </div>\r\n        </el-popover>\r\n        <el-input v-model=\"dataForm.icon\" v-popover:iconListPopover :readonly=\"true\" :placeholder=\"$t('menu.icon')\"></el-input>\r\n      </el-form-item>\r\n    </el-form>\r\n    <template slot=\"footer\">\r\n      <el-button @click=\"visible = false\">{{ $t('cancel') }}</el-button>\r\n      <el-button type=\"primary\" @click=\"dataFormSubmitHandle()\">{{ $t('confirm') }}</el-button>\r\n    </template>\r\n  </el-dialog>\r\n</template>\r\n\r\n<script>\r\nimport debounce from 'lodash/debounce'\r\nimport { getIconList } from '@/utils'\r\nexport default {\r\n  data () {\r\n    return {\r\n      visible: false,\r\n      menuList: [],\r\n      menuListVisible: false,\r\n      iconList: [],\r\n      iconListVisible: false,\r\n      dataForm: {\r\n        id: '',\r\n        type: 0,\r\n        name: '',\r\n        pid: '0',\r\n        parentName: '',\r\n        url: '',\r\n        permissions: '',\r\n        sort: 0,\r\n        icon: ''\r\n      }\r\n    }\r\n  },\r\n  computed: {\r\n    dataRule () {\r\n      return {\r\n        name: [\r\n          { required: true, message: this.$t('validate.required'), trigger: 'blur' }\r\n        ],\r\n        parentName: [\r\n          { required: true, message: this.$t('validate.required'), trigger: 'change' }\r\n        ]\r\n      }\r\n    }\r\n  },\r\n  watch: {\r\n    'dataForm.type' (val) {\r\n      this.$refs['dataForm'].clearValidate()\r\n    }\r\n  },\r\n  methods: {\r\n    init () {\r\n      this.visible = true\r\n      this.$nextTick(() => {\r\n        this.$refs['dataForm'].resetFields()\r\n        this.iconList = getIconList()\r\n        this.dataForm.parentName = this.$t('menu.parentNameDefault')\r\n        this.getMenuList().then(() => {\r\n          if (this.dataForm.id) {\r\n            this.getInfo()\r\n          }\r\n        })\r\n      })\r\n    },\r\n    // 获取菜单列表\r\n    getMenuList () {\r\n      return this.$http.get('/sys/menu/list?type=0').then(({ data: res }) => {\r\n        if (res.code !== 0) {\r\n          return this.$message.error(res.msg)\r\n        }\r\n        this.menuList = res.data\r\n      }).catch(() => {})\r\n    },\r\n    // 获取信息\r\n    getInfo () {\r\n      this.$http.get(`/sys/menu/${this.dataForm.id}`).then(({ data: res }) => {\r\n        if (res.code !== 0) {\r\n          return this.$message.error(res.msg)\r\n        }\r\n        this.dataForm = {\r\n          ...this.dataForm,\r\n          ...res.data\r\n        }\r\n        if (this.dataForm.pid === '0') {\r\n          return this.deptListTreeSetDefaultHandle()\r\n        }\r\n        this.$refs.menuListTree.setCurrentKey(this.dataForm.pid)\r\n      }).catch(() => {})\r\n    },\r\n    // 上级菜单树, 设置默认值\r\n    deptListTreeSetDefaultHandle () {\r\n      this.dataForm.pid = '0'\r\n      this.dataForm.parentName = this.$t('menu.parentNameDefault')\r\n    },\r\n    // 上级菜单树, 选中\r\n    menuListTreeCurrentChangeHandle (data) {\r\n      this.dataForm.pid = data.id\r\n      this.dataForm.parentName = data.name\r\n      this.menuListVisible = false\r\n    },\r\n    // 图标, 选中\r\n    iconListCurrentChangeHandle (icon) {\r\n      this.dataForm.icon = icon\r\n      this.iconListVisible = false\r\n    },\r\n    // 表单提交\r\n    dataFormSubmitHandle: debounce(function () {\r\n      this.$refs['dataForm'].validate((valid) => {\r\n        if (!valid) {\r\n          return false\r\n        }\r\n        this.$http[!this.dataForm.id ? 'post' : 'put']('/sys/menu', this.dataForm).then(({ data: res }) => {\r\n          if (res.code !== 0) {\r\n            return this.$message.error(res.msg)\r\n          }\r\n          this.$message({\r\n            message: this.$t('prompt.success'),\r\n            type: 'success',\r\n            duration: 500,\r\n            onClose: () => {\r\n              this.visible = false\r\n              this.$emit('refreshDataList')\r\n            }\r\n          })\r\n        }).catch(() => {})\r\n      })\r\n    }, 1000, { 'leading': true, 'trailing': false })\r\n  }\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\">\r\n.mod-sys__menu {\r\n  .menu-list,\r\n  .icon-list {\r\n    .el-input__inner,\r\n    .el-input__suffix {\r\n      cursor: pointer;\r\n    }\r\n  }\r\n  &-icon-popover {\r\n    width: 458px;\r\n    overflow: hidden;\r\n  }\r\n  &-icon-inner {\r\n    width: 478px;\r\n    max-height: 258px;\r\n    overflow-x: hidden;\r\n    overflow-y: auto;\r\n  }\r\n  &-icon-list {\r\n    width: 458px;\r\n    padding: 0;\r\n    margin: -8px 0 0 -8px;\r\n    > .el-button {\r\n      padding: 8px;\r\n      margin: 8px 0 0 8px;\r\n      > span {\r\n        display: inline-block;\r\n        vertical-align: middle;\r\n        width: 18px;\r\n        height: 18px;\r\n        font-size: 18px;\r\n      }\r\n    }\r\n  }\r\n}\r\n</style>\r\n"]}]}