vue项目、js原生封装可拖动弹窗，a-modal进行二次封装，antd_vue封装可拖动弹窗

Vue项目开发中，可随意拖动弹窗。

描述：最近在做Vue项目开发中，使用了最近比较流行的ant-design-vue组件库，但是在在使用中，发现好多需要的组件都没有，然后就自己动手开发几个，该文章只是记录一个可拖动弹窗，其他在下一篇或者上一篇(输入框封装，表格的二次封装…）

基于Vue2和Ant-Design-Vue封装的后台系统，其中包括很多常用组件和方法：Smile Admin

说明：该组件并不涉及任何UI库，原生封装，任何项目都可以使用。
原理其实，可以简化为，一个撑满屏幕的黑色背景，中间一个显示内容的白色区域，利用定位来做，但是底层的黑色背景层级一定要高，我们都知道，UI库的好多组件层级数都非常大，还有就是，获取元素的位置，和计算鼠标的移动的距离，最后赋值给定位元素就搞定了。

template部分

<template>
  <div class="modal_drag_wrap">
    <div class="wrap">
      <div class="modal_wrap" :style="{ width: width, height: height }">
        <div class="modal_title" ref="modalTitle" @mousedown="onMousedown">
          <span>
            <slot name="modalTitle"></slot>
          </span>
          <span>
            <a-icon type="close" @click="handlerClose"></a-icon>
          </span>
        </div