SOURCE

/*
  **************************************************
  version: '0.10'
  author": "46898"
  description": element-ui
  **************************************************
 */
import {
  Pagination,
  Dialog,
  Dropdown,
  DropdownMenu,
  DropdownItem,
  Input,
  InputNumber,
  Radio,
  RadioGroup,
  RadioButton,
  Checkbox,
  CheckboxButton,
  CheckboxGroup,
  Select,
  Option,
  OptionGroup,
  Button,
  ButtonGroup,
  Table,
  TableColumn,
  Popover,
  Tooltip,
  Form,
  FormItem,
  Collapse,
  CollapseItem,
  Icon,
  Scrollbar,
  Image,
  Backtop,
  TimeSelect,
  DatePicker,
  Cascader,
  CascaderPanel,
  MessageBox,
  Message,
  Upload,
  Progress,
  Tabs,
  TabPane,
  Tag
} from 'element-ui'
import '@/assets/css/element-variables.scss'

export default {
  install (Vue, options) {
    Vue.use(Pagination)
    Vue.use(Dialog)
    Vue.use(Dropdown)
    Vue.use(DropdownMenu)
    Vue.use(DropdownItem)
    Vue.use(Input)
    Vue.use(InputNumber)
    Vue.use(Radio)
    Vue.use(RadioGroup)
    Vue.use(RadioButton)
    Vue.use(Checkbox)
    Vue.use(CheckboxButton)
    Vue.use(CheckboxGroup)
    Vue.use(Select)
    Vue.use(Option)
    Vue.use(OptionGroup)
    Vue.use(Button)
    Vue.use(ButtonGroup)
    Vue.use(Table)
    Vue.use(TableColumn)
    Vue.use(TimeSelect)
    Vue.use(DatePicker)
    Vue.use(Popover)
    Vue.use(Tooltip)
    Vue.use(Form)
    Vue.use(FormItem)
    Vue.use(Collapse)
    Vue.use(CollapseItem)
    Vue.use(Icon)
    Vue.use(Scrollbar)
    Vue.use(Image)
    Vue.use(Backtop)
    Vue.use(Cascader)
    Vue.use(CascaderPanel)
    Vue.use(Upload)
    Vue.use(Progress)
    Vue.use(Tabs)
    Vue.use(TabPane)
    Vue.use(Tag)

    // Message实例
    const instanceMessage = (type, message, { dangerouslyUseHTMLString = false, duration = 2000 } = {}) => Message({
      message,
      type,
      dangerouslyUseHTMLString,
      duration
    })

    const $Message = {
      success: (message, option) => instanceMessage('success', message, option),
      warning: (message, option) => instanceMessage('warning', message, option),
      error: (message, option) => instanceMessage('error', message, option)
    }

    // 二次确认弹窗
    const $confirm = (message, option = {}) => {
      const {
        title = '提示',
        type = 'warning',
        showConfirmButton = true,
        showCancelButton = true,
        showClose = true,
        customClass = '',
        confirmButtonText = '确定',
        cancelButtonText = '取消',
        dangerouslyUseHTMLString = false,
        confirmCallback,
        cancelCallbck
      } = option

      if (!message) {
        return
      }

      MessageBox.confirm(message, title, {
        type,
        showConfirmButton,
        showCancelButton,
        showClose,
        customClass: `custom-confirm-dialog ${customClass}`,
        confirmButtonText,
        cancelButtonText,
        dangerouslyUseHTMLString,
        beforeClose: (action, instance, done) => {
          if (action === 'confirm') {
            instance.confirmButtonLoading = true
            confirmCallback && confirmCallback({ action, instance, done })
          } else {
            cancelCallbck && cancelCallbck({ action, instance, done })
            instance.confirmButtonLoading = false
            done()
          }
        }
        // callback: (action, instance) => {
        //   this.$confirm.closeAll()
        // }
      })
    }

    Object.defineProperty(Vue.prototype, '$msgbox', { value: MessageBox })
    Object.defineProperty(Vue.prototype, '$message', { value: $Message })
    Object.defineProperty(Vue.prototype, '$confirm', { value: $confirm })
    window.$message = $Message
  }
}
console 命令行工具 X clear

                    
>
console