//自定义指令:实现element-ui对话框dialog拖拽功能
import Vue from 'vue';
// v-dialogDrag: 弹窗拖拽属性
Vue.directive('dialogDrag', {
bind(el, binding, vnode, oldVnode) {
const dialogHeaderEl = el.querySelector('.el-dialog__header');
const dragDom = el.querySelector('.el-dialog');
dialogHeaderEl.style.cursor = 'move';
// 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null);
dialogHeaderEl.onmousedown = e => {
// 鼠标按下,计算当前元素距离可视区的距离
const disX = e.clientX - dialogHeaderEl.offsetLeft;
const disY = e.clientY - dialogHeaderEl.offsetTop;
// 获取到的值带px 正则匹配替换
let styL, styT;
// 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px
if (sty.left.includes('%')) {
styL = +document.body.clientWidth * (+sty.left.replace(/\%/g, '') / 100);
styT = +document.body.clientHeight * (+sty.top.replace(/\%/g, '') / 100);
} else {
styL = +sty.left.replace(/\px/g, '');
styT = +sty.top.replace(/\px/g, '');
}
document.onmousemove = function(e) {
// 通过事件委托,计算移动的距离
const l = e.clientX - disX;
const t = e.clientY - disY;
// 移动当前元素
dragDom.style.left = `${l + styL}px`;
dragDom.style.top = `${t + styT}px`;
//将此时的位置传出去
//binding.value({x:e.pageX,y:e.pageY})
};
document.onmouseup = function(e) {
document.onmousemove = null;
document.onmouseup = null;
};
};
},
});
//动态修改网站ico
SET_APP_CONFIG(state) {
var link = document.querySelector("link[rel*='icon']") ||
document.createElement('link');
link.type = 'image/x-icon';
link.rel = 'shortcut icon';
link.href = state.ico;
document.getElementsByTagName('head')[0].appendChild(link);
}
import Vue from 'vue';
import Clipboard from 'clipboard';
import $message from '@/libs/util.message'; //element-ui
// v-copy: 实现clipboard 复制功能
Vue.directive('copy', {
bind(el, binding, vnode, oldVnode) {
const clipboard = new Clipboard(el, {
text: function() {
return binding.value;
},
});
clipboard.on('success', function(e) {
$message.success('复制成功');
e.clearSelection();
});
clipboard.on('error', function(e) {
if (~e.text) {
$message.error('复制失败');
}
});
},
});
import Vue from 'vue'
/**
* 根据value值获取label值
*
* @param {*} value
* @param {*} list
* @param {string} [keyMap={
* key: 'label',
* value: 'value'
* }]
* @return {*} {string}
*/
function ftValuelabel (
value,
list,
keyMap = {
key: 'label',
value: 'value'
}
) {
return list.find(item => item[keyMap.value] === value)?.[keyMap.key]
}
Vue.filter('ftValuelabel', ftValuelabel)
export { ftValuelabel }
import Vue from 'vue';
import { citys } from '@/const/citys'; //城市数据
// 生成城市code和城市名称的映射
const cityMap = citys.reduce((pre, cur) => {
cur.children.forEach(element => {
pre[element.value.toString()] = element.label;
});
return pre;
}, {});
/**
* 根据城市code获取城市名称
*
* @param {*} value 城市code
* @return {*} 城市名称
*/
function ftGetCityByCode(value) {
const city = cityMap[value];
let province = '';
citys.forEach((item, index) => {
item.children.forEach((itt, idx) => {
if (itt.label == city) {
province = item.label;
}
});
});
return province + cityMap[value];
}
Vue.filter('ftGetCityByCode', ftGetCityByCode);
export { ftGetCityByCode };
import Vue from 'vue'
/**
*html文本字符串中的img标签的宽度自适应
*
* @param {*} content htnl文本字符串
* @return {*} htnl文本字符串
*/
function fitHtmlImgWidth (content) {
const regex = new RegExp('<img', 'gi')
return content?.replace(regex, '<img style="max-width: 100%; height: auto"')
}
Vue.filter('fitHtmlImgWidth', fitHtmlImgWidth)
export {
fitHtmlImgWidth
}
/** 日期格式化 */
import dayjs from 'dayjs';
import Vue from 'vue';
/** 年月日时分秒 */
Vue.filter('formatDateTime', timeStr => {
return formatDateTime(timeStr);
});
/** 年月日 */
Vue.filter('formatDate', timeStr => {
return formatDate(timeStr);
});
/** 时分秒 */
Vue.filter('formatTime', timeStr => {
return formatTime(timeStr);
});
/** 日期时间格式 */
export const EDTFormat = {
/** 日期 */
DATE: 'YYYY-MM-DD',
/** 时间 */
TIME: 'HH:mm:ss',
/** 时间 */
TIME_HM: 'HH:mm',
/** 日期时间 */
DATE_TIME: 'YYYY-MM-DD HH:mm:ss',
/** 日期时间 - 没有秒 */
DATE_TIME_HM: 'YYYY-MM-DD HH:mm',
};
function format(dateTime, formatStr = EDTFormat.DATE_TIME) {
if (!dateTime) {
return '';
}
return dayjs(dateTime).format(formatStr);
}
/** 年月日 */
export function formatDate(dateTime) {
return format(dateTime, EDTFormat.DATE);
}
/** 时分秒 */
export function formatTime(dateTime) {
return format(dateTime, EDTFormat.TIME);
}
/** 年月日时分秒 */
export function formatDateTime(dateTime) {
return format(dateTime, EDTFormat.DATE_TIME);
}
/** 年月日时分 */
export function formatDateTimeHM(dateTime) {
return format(dateTime, EDTFormat.DATE_TIME_HM);
}
/** 日期转时间戳 */
export const date2Time = (date, YLdateFormat = EDTFormat.DATE) => {
return date ? dayjs(date, YLdateFormat).valueOf() : null;
};
//校验
const rules = {
//校验数值
isNumber(num = 0, required = true) {
// 0 正整数
let reg = [/^[0-9]*$/, /^[0-9]*[.][0-9]*$/, /^\d+(\.\d{1,2})?$/, /^\d+(\.\d{1,3})?$/];
return [
{ required: required, message: '请输入数值', trigger: 'blur' },
{ pattern: reg[num], message: '请输入正确的数值', trigger: 'blur' },
];
},
//校验手机号
isPhone(required = true) {
return [
{ required: required, message: '请输入手机号', trigger: 'blur' },
{ pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号', trigger: 'blur' },
];
},
//校验富文本是否为空
isRichText(required = true) {
//判断富文本正则,有文字,有img标签属于不为空。
// 判断富文本编辑器输入是否为空或回车
let getText = str => {
return str
.replace(/<[^<p>]+>/g, '') // 将所有<p>标签 replace ''
.replace(/<[</p>$]+>/g, '') // 将所有</p>标签 replace ''
.replace(/ /gi, '') // 将所有 空格 replace ''
.replace(/<[^<br/>]+>/g, ''); // 将所有 换行符 replace ''
};
let isNull = str => {
if (str == '') return true;
var regu = '^[ ]+$';
var re = new RegExp(regu);
return re.test(str);
};
let checkContent = (rule, value, callback) => {
let text = getText(value);
if (isNull(text)) {
callback(new Error('请输入内容'));
} else {
callback();
}
};
return [
{ required: required, message: '请输入内容', trigger: 'blur' },
{ validator: checkContent, trigger: 'blur' },
];
},
//校验编号需要是指定位数的字符串
isCode(required = true, num = 0) {
return [
{ required: required, message: '请输入编号', trigger: 'blur' },
{
pattern: new RegExp(`^[a-zA-Z0-9]{${num}}$`),
message: '请输入正确的编号',
trigger: 'blur',
},
];
},
};
export default rules;
import md5 from 'md5';
const util = {};
/**
* @description 更新标题
* @param {String} title 标题
*/
util.title = function(titleText, processTitle) {
window.document.title = `${processTitle}${titleText ? ` | ${titleText}` : ''}`;
};
/**
* @description 打开新页面
* @param {String} url 地址
*/
util.open = function(url) {
var a = document.createElement('a');
a.setAttribute('href', url);
a.setAttribute('target', '_blank');
a.setAttribute('id', 'd2admin-link-temp');
document.body.appendChild(a);
a.click();
document.body.removeChild(document.getElementById('d2admin-link-temp'));
};
/**
* @param {Number} times 回调函数需要执行的次数
* @param {Function} callback 回调函数
*/
util.doCustomTimes = function(times, callback) {
let i = -1;
while (++i < times) {
callback(i);
}
};
/**
* @param {Number} times 延迟执行
* @param {Function} resolve 回调函数
*/
util.sleep = function(num) {
return new Promise(resolve => {
setTimeout(() => resolve(), num * 1000);
});
};
/**
* @description 随机字符串
* @param {Number} num 执行次数
* @param {Function} resolve 回调函数
*/
util.randStr = function(num = 10) {
let str = '';
const charSet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
util.doCustomTimes(num, () => (str += _.sample(charSet).replace(/,/g, '')));
return str;
};
/**
* @description MD5加盐加密
* @param {String} str 字符串
*/
util.saltMd5 = function(str) {
return md5(str + process.env.VUE_APP_MD5_SALT);
};
export default util;
/**
* 数组中是否包含某个值
* @param {*} key
* @param {*} keys
* @return {*}
*/
had(key, keys) {
if (!key && key !== 0) return false;
if (!keys) return false;
if (!Array.isArray(keys)) return false;
if (!isNaN(key)) return keys.includes(Number(key));
return keys.includes(key);
}
import { Loading } from 'element-ui';
/**
*分页循环导出数据
* @param {*} api 接口
* @param {*} params 附带参数
* @return {*} 数组
*/
const exportExcelData = async (api, params) => {
const loading = Loading.service({
lock: true,
text: 'Loading',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)',
});
return new Promise(async (resolve, reject) => {
let page = 1;
let data = [];
let fn = async params => {
let { records, current, pages } = await api({ ...params, pageNo: page, pageSize: 1000 });
data = data.concat(records);
if (current < pages) {
page++;
fn(params);
} else {
resolve(data);
loading.close();
}
};
fn(params);
});
};
export { exportExcelData };
//自定义指令:实现clipboard 复制功能