import Vue from 'vue'
import Element from 'element-ui'
import i18n from '@/lang'
// import '../element-variables.scss'
import { closeMenuOnScroll } from '@/mixin/close-menu-onscroll.js'
import message from '@/mixin/message.js'
import dragDialog from '@/mixin/dragDialog.js'
import router from '@/router/router'
import MdElementUi from 'mdzy-component-frontend'
import 'mdzy-component-frontend/dist/mdzy-component-frontend.css'
let ElementConfig = {
size: 'mini'
}
console.log('%c 第20行', 'color: red; font-size: 2em')
console.log(Element)
// 扩展下拉框选项的过滤方法,使可以匹配非绑定字段的搜索
Element.Option.mixins[Element.Option.mixins.length] = {
props: {
optionData: {
type: Object
},
filterVal: {
type: String
},
customFilterMethod: Function
},
watch: {
filterVal: {
handler(val) {
if (this.customFilterMethod && val) {
this.visible = this.visible || this.customFilterMethod(val, this.optionData)
}
},
deep: true,
immediate: true
}
}
}
Element.Select.mixins[Element.Select.mixins.length] = {
props: {
onOptionsOneSelect: {
// 当只有一个选项的时候默认选择第一个选项
type: Boolean,
default: false
},
bindKey: {
type: String
}
},
watch: {
options: {
handler(val) {
if (this.onOptionsOneSelect) {
if (val.length === 1) {
if (val[0].value && typeof val[0].value === 'string') {
this.$emit('input', val[0].value)
}
}
}
},
deep: true,
immediate: true
},
previousQuery: {
handler(val) {
this.$emit('filter-change', val, this.bindKey)
},
deep: true,
immediate: true
}
}
}
Element.DatePicker.mixins[Element.DatePicker.mixins.length] = {
created() {
let shortcuts = []
if (!this.pickerOptions.shortcuts) {
if (this.type === 'date' || this.type === 'datetime') {
shortcuts = [
{
text: '今天',
onClick(picker) {
picker.$emit('pick', new Date())
}
},
{
text: '昨天',
onClick(picker) {
const date = new Date()
date.setTime(date.getTime() - 3600 * 1000 * 24)
picker.$emit('pick', date)
}
},
{
text: '一周前',
onClick(picker) {
const date = new Date()
date.setTime(date.getTime() - 3600 * 1000 * 24 * 7)
picker.$emit('pick', date)
}
}
]
}
if (this.type === 'daterange') {
shortcuts = [
{
text: '最近一周',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
picker.$emit('pick', [start, end])
}
},
{
text: '最近一个月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
picker.$emit('pick', [start, end])
}
},
{
text: '最近三个月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
picker.$emit('pick', [start, end])
}
}
]
}
if (this.type === 'monthrange') {
shortcuts = [
{
text: '本月',
onClick(picker) {
picker.$emit('pick', [new Date(), new Date()])
}
},
{
text: '今年至今',
onClick(picker) {
const end = new Date()
const start = new Date(new Date().getFullYear(), 0)
picker.$emit('pick', [start, end])
}
},
{
text: '最近六个月',
onClick(picker) {
const end = new Date()
const start = new Date()
start.setMonth(start.getMonth() - 6)
picker.$emit('pick', [start, end])
}
}
]
}
if (shortcuts.length > 0) {
this.$set(this.pickerOptions, 'shortcuts', shortcuts)
}
}
}
}
// 全局弹窗可以拖动
dragDialog(Element)
// 页面滚动时关闭展开的下拉框,下拉菜单等
closeMenuOnScroll(Element)
// 全局弹窗默认点击外面不关闭
Element.Dialog.props.closeOnClickModal.default = false
// 默认全局弹窗设置为append-to-body
Element.Dialog.props.appendToBody.default = true
Element.MessageBox.setDefaults({
closeOnClickModal: false,
closeOnPressEscape: false
})
// console.log(MdElementUi);
try {
// 拦截button click时间 阻止冒泡
let _buttonClick = MdElementUi.MdButton.methods.onclick
MdElementUi.MdButton.methods.onclick = function (e) {
e.stopPropagation()
_buttonClick.apply(this, arguments)
}
} catch {}
if (!MdElementUi.MdButton.mixins) {
MdElementUi.MdButton.mixins = []
}
MdElementUi.MdButton.mixins[MdElementUi.MdButton.mixins.length] = {
props: {
menuCode: {
type: String,
default: ''
},
menuCodePrifix: {
//自定义权限前缀,有该值不用路由名拼接
type: String,
default: ''
}
},
mounted() {
// console.log('mounted-button', this.menuCode, router.app._route.name)
this.initBtnConfig()
},
watch: {
menuCode(val) {
this.initBtnConfig()
},
'$store.state.permissionList': {
handler(val) {
this.initBtnConfig()
}
}
},
activated() {
// console.log('activated-button', this.menuCode, router.app._route.name)
this.initBtnConfig()
},
methods: {
initBtnConfig() {
if (!this.menuCode) return
if (this.menuCode && this.menuCode === 'alwaysShow') return
this.$nextTick(() => {
setTimeout(() => {
let list = this.$store.state.permissionList || {}
// 获取当前路由和权限编码
let routerName = this.menuCodePrifix || router.app._route.name //这个就是用来获取路由name
let id = routerName + '-' + this.menuCode // 获取到 v-permission的值
let exit = list[id.toLowerCase()]
// console.log('idididididid', routerName, id, exit)
if (!exit) {
this.$el.style.display = 'none'
return
}
if (this.$el.style.display === 'none') {
this.$el.style.display = null
}
let spanElement = this.$el.querySelector('span')
let checkboxEl = this.$el.querySelector('.el-checkbox__label')
if (checkboxEl) {
spanElement = checkboxEl
}
if (!spanElement) return
if (exit) {
// 设置按钮的文本内容,并保留icon
spanElement.innerText = exit[0]
// 设置按钮的排序
this.$el.style.order = exit[1]
}
})
})
}
}
}
if (!MdElementUi.MdSelect.mixins) {
MdElementUi.MdSelect.mixins = []
}
MdElementUi.MdSelect.mixins[MdElementUi.MdSelect.mixins.length] = {
props: {
groupCode: {
type: Number | String,
default: ''
}
},
created() {
if (this.groupCode) {
this.$commonMethods.getSelectData(this.groupCode).then((res) => {
this.computedOptions = res
})
}
}
}
Vue.use(MdElementUi, MdElementUi)
Vue.use(Element, ElementConfig)
message(Vue)
//重写element的$comirm,便于国际化处理
Vue.prototype.$confirm = function (message, title, options) {
if (options?.cancelButtonText) {
options.cancelButtonText = i18n.t(options.cancelButtonText)
}
if (options?.confirmButtonText) {
options.confirmButtonText = i18n.t(options.confirmButtonText)
}
if (!options.hasOwnProperty('type')) {
options.type = 'warning'
}
return Element.MessageBox.confirm(i18n.t(message), i18n.t(title), options)
}
标签:picker,混入,elements,MdElementUi,Element,start,公共,Date,new
From: https://www.cnblogs.com/yibottlec/p/18393985