车队拖拽修改

src/views/basicdata/fleet/carManage-add-or-update.vue

@@ -1,9 +1,22 @@
 <template>
   <el-dialog
-    :title="!dataForm.id ? '车辆注册' : '修改'"
+    v-dialogDrag
+    :fullscreen="dialogFull"
+    :title="!dataForm.Id ? '车辆注册' : '修改'"
     :close-on-click-modal="false"
     :visible.sync="visible" width="80%"
   >
+    <template slot="title">
+      <div class="avue-crud__dialog__header">
+            <span class="el-dialog__title">
+            <span style="display:inline-block;width:3px;height:20px;margin-right:5px; float: left;margin-top:2px"></span>
+            车辆注册
+            </span>
+        <div class="avue-crud__dialog__menu enlarge" @click="full">
+          <i  style="cursor: pointer;display: block;width:12px;height:12px;border:1px solid #909399;border-top:3px solid #909399;margin-top: -3px;"></i>
+        </div>
+      </div>
+    </template>
     <el-form :model="dataFormD" :rules="dataRule" ref="dataFormD" @keyup.enter.native="dataFormSubmit()"
              label-width="125px"
     >
@@ -284,7 +297,7 @@
       </el-form>
     </el-collapse>
     <span slot="footer" class="dialog-footer">
-      <el-button type="info" @click="handleUpdata">修改</el-button>
+      <el-button type="info" @click="handleUpdata" v-if="hide">修改</el-button>
       <el-button @click="visible = false">取消</el-button>
       <el-button type="primary" :disabled="doNot" @click="dataFormSubmit">确定</el-button>
     </span>
@@ -294,6 +307,61 @@
 <script>
 import { preservation, company, lookOver } from '@/api/fleet/carManage'
 import { getToken } from '@/utils/auth'
+import Vue from 'vue'
+Vue.directive('dialogDrag', {
+  bind(el, binding, vnode, oldVnode) {
+    const dialogHeaderEl = el.querySelector('.el-dialog__header')
+    const dragDom = el.querySelector('.el-dialog')
+    const enlarge = el.querySelector('.enlarge')
+    dialogHeaderEl.style.cursor = 'move'
+
+    // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
+    const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null)
+    if(enlarge){
+      enlarge.onclick = (e) => {
+        dragDom.style.top = '0px'
+        dragDom.style.left = '0px'
+      }
+    }
+    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
+
+        // 移动当前元素
+
+        if ((t + styT) >= 0){
+          dragDom.style.top = `${t + styT}px`
+        }
+        dragDom.style.left = `${l + styL}px`
+        // 将此时的位置传出去
+        // binding.value({x:e.pageX,y:e.pageY})
+      }
+
+      document.onmouseup = function(e) {
+        document.onmousemove = null
+        document.onmouseup = null
+      }
+    }
+  }
+})
 
 export default {
   props: {
@@ -304,6 +372,8 @@ export default {
   },
   data() {
     return {
+      hide:false,
+      dialogFull:false,
       fTmsorderbillsattachs:[
         {attachUrl:'',attachName:'',actId:''},
         {attachUrl:'',attachName:'',actId:''},
@@ -336,6 +406,9 @@ export default {
     }
   },
   methods: {
+    full(){
+      this.dialogFull = !this.dialogFull
+    },
     handleUpdata(){
       this.doNot = false
     },
@@ -393,11 +466,11 @@ export default {
       return this.$confirm(`确定移除 ${ file.name }？`);
     },
     init() {
+      this.hide = true
       this.visible = true
       if (this.dataForm.Id) {
         lookOver(this.dataForm.Id).then(data => {
           this.doNot = true
-          console.log(data)
           this.dataFormD = data.data.fleetCarManage
           if (data.data.fTmsorderbillsattachs){
             this.fTmsorderbillsattachs = data.data.fTmsorderbillsattachs
@@ -442,6 +515,7 @@ export default {
           {attachUrl:'',attachName:'',actId:''},
           {attachUrl:'',attachName:'',actId:''},
           {attachUrl:'',attachName:'',actId:''}]
+        this.hide = false
         this.doNot = false
       }
     },
@@ -526,3 +600,27 @@ export default {
   display: block;
 }
 </style>
+
+
+<style lang="scss">
+.avue-crud__dialog__header {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+.el-dialog__title {
+  color: rgba(0,0,0,.85);
+  font-weight: 500;
+  word-wrap: break-word;
+}
+.avue-crud__dialog__menu {
+  padding-right: 20px;
+  float: left;
+}
+</style>

src/views/basicdata/fleet/companyMsg-add-or-update.vue

@@ -1,73 +1,87 @@
 
 <template>
   <el-dialog
+    v-dialogDrag
+    :fullscreen="dialogFull"
     :title="!dataForm.id ? '车队注册' : '修改'"
     :close-on-click-modal="false"
     :visible.sync="visible" width="70%" :before-close="handleClose">
+    <template slot="title">
+      <div class="avue-crud__dialog__header">
+            <span class="el-dialog__title">
+            <span style="display:inline-block;width:3px;height:20px;margin-right:5px; float: left;margin-top:2px"></span>
+            车队注册
+            </span>
+        <div class="avue-crud__dialog__menu enlarge" @click="full">
+          <i  style="cursor: pointer;display: block;width:12px;height:12px;border:1px solid #909399;border-top:3px solid #909399;margin-top: -3px;"></i>
+        </div>
+      </div>
+    </template>
+
     <el-form :model="dataForm_s" :rules="dataRule" ref="dataForm_s" @keyup.enter.native="dataFormSubmit()" label-width="200px">
       <el-form-item label="公司名称" prop="companyName">
-        <el-input v-model="dataForm_s.companyName" placeholder="公司名称"></el-input>
+        <el-input v-model="dataForm_s.companyName" placeholder="公司名称" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="公司地址" prop="companyAddress">
-        <el-input v-model="dataForm_s.companyAddress" placeholder="公司地址"></el-input>
+        <el-input v-model="dataForm_s.companyAddress" placeholder="公司地址" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="公司开户行" prop="openingBank">
-        <el-input v-model="dataForm_s.openingBank" placeholder="公司开户行"></el-input>
+        <el-input v-model="dataForm_s.openingBank" placeholder="公司开户行" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="银行账号" prop="bankAccount">
-        <el-input v-model="dataForm_s.bankAccount" placeholder="银行账号"></el-input>
+        <el-input v-model="dataForm_s.bankAccount" placeholder="银行账号" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="登录账号" prop="loginAccount">
-        <el-input v-model="dataForm_s.loginAccount" :disabled="dataForm.id ? edit:false" placeholder="登录账号"></el-input>
+        <el-input v-model="dataForm_s.loginAccount" :disabled="dataForm.id ? edit:false || doNot" placeholder="登录账号"></el-input>
       </el-form-item>
       <el-form-item label="登录密码" prop="pwd" v-if="dataForm_s.id ? false:true">
-        <el-input v-model="dataForm_s.pwd" placeholder="登录密码" type="password"></el-input>
+        <el-input v-model="dataForm_s.pwd" placeholder="登录密码" type="password" :disabled="doNot"></el-input>
       </el-form-item>
 
       <el-form-item label="信用等级" prop="creditLv">
-        <el-input v-model="dataForm_s.creditLv" placeholder="信用等级"></el-input>
+        <el-input v-model="dataForm_s.creditLv" placeholder="信用等级" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="账期天数(最迟结款天数)" prop="paymentDays">
-        <el-input v-model="dataForm_s.paymentDays" placeholder="账期天数(最迟结款天数)"></el-input>
+        <el-input v-model="dataForm_s.paymentDays" placeholder="账期天数(最迟结款天数)" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="联系人" prop="linkMan">
-        <el-input v-model="dataForm_s.linkMan" placeholder="联系人"></el-input>
+        <el-input v-model="dataForm_s.linkMan" placeholder="联系人" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="联系电话" prop="linkPhone">
-        <el-input v-model="dataForm_s.linkPhone" placeholder="联系电话"></el-input>
+        <el-input v-model="dataForm_s.linkPhone" placeholder="联系电话" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="传真" prop="fax">
-        <el-input v-model="dataForm_s.fax" placeholder="传真"></el-input>
+        <el-input v-model="dataForm_s.fax" placeholder="传真" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="email" prop="email">
-        <el-input v-model="dataForm_s.email" placeholder="email"></el-input>
+        <el-input v-model="dataForm_s.email" placeholder="email" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="总公司" prop="headOffice">
-        <el-input v-model="dataForm_s.headOffice" placeholder="总公司"></el-input>
+        <el-input v-model="dataForm_s.headOffice" placeholder="总公司" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="注册资本" prop="registerdCapital">
-        <el-input v-model="dataForm_s.registerdCapital" placeholder="注册资本"></el-input>
+        <el-input v-model="dataForm_s.registerdCapital" placeholder="注册资本" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="法人" prop="legalPerson">
-        <el-input v-model="dataForm_s.legalPerson" placeholder="法人"></el-input>
+        <el-input v-model="dataForm_s.legalPerson" placeholder="法人" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="所属行业" prop="insdustry">
-        <el-input v-model="dataForm_s.insdustry" placeholder="所属行业"></el-input>
+        <el-input v-model="dataForm_s.insdustry" placeholder="所属行业" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="社会统一信用代码" prop="creditNum">
-        <el-input v-model="dataForm_s.creditNum" placeholder="社会统一信用代码"></el-input>
+        <el-input v-model="dataForm_s.creditNum" placeholder="社会统一信用代码" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="纳税人识别号" prop="taxpayerNum">
-        <el-input v-model="dataForm_s.taxpayerNum" placeholder="纳税人识别号"></el-input>
+        <el-input v-model="dataForm_s.taxpayerNum" placeholder="纳税人识别号" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="工商注册号" prop="industryCommerceNum">
-        <el-input v-model="dataForm_s.industryCommerceNum" placeholder="工商注册号"></el-input>
+        <el-input v-model="dataForm_s.industryCommerceNum" placeholder="工商注册号" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="组织机构代码" prop="organizationNum">
-        <el-input v-model="dataForm_s.organizationNum" placeholder="组织机构代码"></el-input>
+        <el-input v-model="dataForm_s.organizationNum" placeholder="组织机构代码" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="登记机关" prop="registerOrganization">
-        <el-input v-model="dataForm_s.registerOrganization" placeholder="登记机关"></el-input>
+        <el-input v-model="dataForm_s.registerOrganization" placeholder="登记机关" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="成立日期" prop="dateOfEstablishment">
         <!--            <el-input v-model="dataForm.dateOfEstablishment" placeholder="成立日期"></el-input>-->
@@ -76,18 +90,19 @@
           value-format="yyyy-MM-dd HH:mm:ss"
           v-model="dataForm_s.dateOfEstablishment"
           type="date"
+          :disabled="doNot"
           placeholder="创建时间">
         </el-date-picker>
 
       </el-form-item>
       <el-form-item label="企业类型" prop="companyType">
-        <el-input v-model="dataForm_s.companyType" placeholder="企业类型"></el-input>
+        <el-input v-model="dataForm_s.companyType" placeholder="企业类型" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="营业期限" prop="businessDeadline">
-        <el-input v-model="dataForm_s.businessDeadline" placeholder="营业期限"></el-input>
+        <el-input v-model="dataForm_s.businessDeadline" placeholder="营业期限" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="营业区域" prop="businessArea">
-        <el-input v-model="dataForm_s.businessArea" placeholder="营业区域"></el-input>
+        <el-input v-model="dataForm_s.businessArea" placeholder="营业区域" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="审核年检日期" prop="annualDate">
         <!--            <el-input v-model="dataForm.annualDate" placeholder="审核年检日期"></el-input>-->
@@ -96,29 +111,87 @@
           value-format="yyyy-MM-dd HH:mm:ss"
           v-model="dataForm_s.annualDate"
           type="date"
+          :disabled="doNot"
           placeholder="创建时间">
         </el-date-picker>
       </el-form-item>
       <el-form-item label="注册地址" prop="registerdAddress">
-        <el-input v-model="dataForm_s.registerdAddress" placeholder="注册地址"></el-input>
+        <el-input v-model="dataForm_s.registerdAddress" placeholder="注册地址" :disabled="doNot"></el-input>
       </el-form-item>
       <el-form-item label="经营范围" prop="manageScope">
-        <el-input v-model="dataForm_s.manageScope" placeholder="经营范围"></el-input>
+        <el-input v-model="dataForm_s.manageScope" placeholder="经营范围" :disabled="doNot"></el-input>
       </el-form-item>
 
       <el-form-item label="登录密码确认" prop="pwd2" v-if="dataForm_s.id ? false:true">
-        <el-input v-model="dataForm_s.pwd2" placeholder="登录密码确认" type="password"></el-input>
+        <el-input v-model="dataForm_s.pwd2" placeholder="登录密码确认" type="password" :disabled="doNot"></el-input>
       </el-form-item>
     </el-form>
     <span slot="footer" class="dialog-footer">
+      <el-button type="info" @click="handleUpdata" v-if="hide">修改</el-button>
       <el-button @click="cancel">取消</el-button>
-      <el-button type="primary" @click="dataFormSubmit()">确定</el-button>
+      <el-button type="primary" @click="dataFormSubmit()" :disabled="doNot">确定</el-button>
     </span>
   </el-dialog>
 </template>
 
 <script>
 import {preservation,lookOver} from "@/api/fleet/companyMsg"
+import Vue from 'vue'
+Vue.directive('dialogDrag', {
+  bind(el, binding, vnode, oldVnode) {
+    const dialogHeaderEl = el.querySelector('.el-dialog__header')
+    const dragDom = el.querySelector('.el-dialog')
+    const enlarge = el.querySelector('.enlarge')
+    dialogHeaderEl.style.cursor = 'move'
+
+    // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
+    const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null)
+    if(enlarge){
+      enlarge.onclick = (e) => {
+        dragDom.style.top = '0px'
+        dragDom.style.left = '0px'
+      }
+    }
+    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
+
+        // 移动当前元素
+
+        if ((t + styT) >= 0){
+          dragDom.style.top = `${t + styT}px`
+        }
+        dragDom.style.left = `${l + styL}px`
+        // 将此时的位置传出去
+        // binding.value({x:e.pageX,y:e.pageY})
+      }
+
+      document.onmouseup = function(e) {
+        document.onmousemove = null
+        document.onmouseup = null
+      }
+    }
+  }
+})
+
 export default {
   props: {
     dataForm: {
@@ -128,6 +201,9 @@ export default {
   },
   data () {
     return {
+      hide:false,
+      doNot:true,
+      dialogFull:false,
       dataForm_s:{
         annualDate: '',
         bankAccount: '',
@@ -205,6 +281,13 @@ export default {
     }
   },
   methods: {
+    full(){
+      this.dialogFull = !this.dialogFull
+    },
+    handleUpdata(){
+      this.hide = true
+      this.doNot = false
+    },
     cancel(){
       this.$confirm('确认关闭？')
         .then(_ => {
@@ -223,11 +306,58 @@ export default {
         .catch(_ => {});
     },
     init () {
+      this.hide = true
       this.visible = true
         if (this.dataForm.id !== null){
           lookOver(this.dataForm.id).then(data=>{
+            this.doNot = true
             this.dataForm_s = data.data
           })
+        }else{
+          this.dataForm_s = {
+            annualDate: '',
+              bankAccount: '',
+              billStatus: '',
+              businessArea: '',
+              businessDeadline: '',
+              carNum: '',
+              companyAddress:'',
+              companyName: '',
+              companyType: '',
+              creatTime: '',
+              createBy: '',
+              createTime: '',
+              creditLv: '',
+              creditNum: '',
+              dateOfEstablishment: '',
+              delFlag: '',
+              email: '',
+              fax: '',
+              headOffice: '',
+              id: '',
+              industryCommerceNum: '',
+              insdustry: '',
+              legalPerson: '',
+              linkMan: '',
+              linkPhone:'',
+              loginAccount: '',
+              manageScope: '',
+              modificationTime: '',
+              openingBank: '',
+              organizationNum: '',
+              params: '',
+              paymentDays: '',
+              registerOrganization: '',
+              registerdAddress: '',
+              registerdCapital: '',
+              remark: '',
+              searchValue: '',
+              taxpayerNum: '',
+              updateBy: '',
+              updateTime: '',
+          }
+          this.hide = false
+          this.doNot = false
         }
     },
     // 表单提交
@@ -274,3 +404,26 @@ export default {
   margin-left: 50px;
 }
 </style>
+
+<style lang="scss">
+.avue-crud__dialog__header {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+.el-dialog__title {
+  color: rgba(0,0,0,.85);
+  font-weight: 500;
+  word-wrap: break-word;
+}
+.avue-crud__dialog__menu {
+  padding-right: 20px;
+  float: left;
+}
+</style>

src/views/basicdata/fleet/companyMsg.vue

@@ -172,7 +172,7 @@
             icon="el-icon-edit"
             @click="addOrUpdateHandle(scope.row,2)"
             v-hasPermi="['fleet:companyMsg:edit']"
-          >修改
+          >查看
           </el-button>
           <el-button
             size="mini"

src/views/basicdata/fleet/driverMsg-add-or-update.vue

@@ -1,9 +1,22 @@
 
 <template>
   <el-dialog
-    :title="!dataForm.id ? '新增' : '修改'"
+    v-dialogDrag
+    :fullscreen="dialogFull"
     :close-on-click-modal="false"
     :visible.sync="visible" width="70%">
+    <template slot="title">
+      <div class="avue-crud__dialog__header">
+            <span class="el-dialog__title">
+            <span style="display:inline-block;width:3px;height:20px;margin-right:5px; float: left;margin-top:2px"></span>
+            {{!dataForm.id ? '新增' : this.hide ? '查看':'修改'}}
+            </span>
+        <div class="avue-crud__dialog__menu enlarge" @click="full">
+          <i  style="cursor: pointer;display: block;width:12px;height:12px;border:1px solid #909399;border-top:3px solid #909399;margin-top: -3px;"></i>
+        </div>
+      </div>
+    </template>
+
     <el-form :model="dataFormD" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="200px">
       <el-form-item label="驾驶员所属公司" prop="fleetCompanyId">
         <el-select v-model="dataFormD.fleetCompanyId" :disabled="doNot" placeholder="请选择">
@@ -94,7 +107,7 @@
           </el-form-item>
     </el-form>
     <span slot="footer" class="dialog-footer">
-      <el-button type="info" @click="handleUpdata">修改</el-button>
+      <el-button type="info" @click="handleUpdata" v-if="hide">修改</el-button>
       <el-button @click="visible = false">取消</el-button>
       <el-button type="primary" :disabled="doNot" @click="dataFormSubmit()">确定</el-button>
     </span>
@@ -104,7 +117,61 @@
 <script>
 import { company, lookOver, preservation } from '@/api/fleet/driverMsg'
 import { getToken } from '@/utils/auth'
+import Vue from 'vue'
+Vue.directive('dialogDrag', {
+  bind(el, binding, vnode, oldVnode) {
+    const dialogHeaderEl = el.querySelector('.el-dialog__header')
+    const dragDom = el.querySelector('.el-dialog')
+    const enlarge = el.querySelector('.enlarge')
+    dialogHeaderEl.style.cursor = 'move'
+
+    // 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
+    const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null)
+    if(enlarge){
+      enlarge.onclick = (e) => {
+        dragDom.style.top = '0px'
+        dragDom.style.left = '0px'
+      }
+    }
+    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
+
+        // 移动当前元素
+
+        if ((t + styT) >= 0){
+          dragDom.style.top = `${t + styT}px`
+        }
+        dragDom.style.left = `${l + styL}px`
+        // 将此时的位置传出去
+        // binding.value({x:e.pageX,y:e.pageY})
+      }
+
+      document.onmouseup = function(e) {
+        document.onmousemove = null
+        document.onmouseup = null
+      }
+    }
+  }
+})
   export default {
     props: {
       dataForm: {
@@ -114,6 +181,8 @@ import { getToken } from '@/utils/auth'
     },
     data () {
       return {
+        dialogFull:false,
+        hide:false,
         doNot:true,
         visible: false,
         dataFormD:{},
@@ -145,7 +214,11 @@ import { getToken } from '@/utils/auth'
       }
     },
     methods: {
+      full(){
+        this.dialogFull = !this.dialogFull
+      },
       handleUpdata(){
+        this.hide = false
         this.doNot = false
       },
       preview(actid){
@@ -165,6 +238,7 @@ import { getToken } from '@/utils/auth'
         return this.$confirm(`确定移除 ${ file.name }？`);
       },
       init () {
+        this.hide = true
         this.visible = true
         this.needCondition()
         console.log(this.dataForm)
@@ -193,6 +267,7 @@ import { getToken } from '@/utils/auth'
             resumePic:'',
             drivingPic:'',
           }
+          this.hide = false
           this.doNot = false
         }
       },
@@ -266,4 +341,24 @@ import { getToken } from '@/utils/auth'
 .upload-demo {
   margin-left: 50px;
 }
+.avue-crud__dialog__header {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: justify;
+  -ms-flex-pack: justify;
+  justify-content: space-between;
+}
+.el-dialog__title {
+  color: rgba(0,0,0,.85);
+  font-weight: 500;
+  word-wrap: break-word;
+}
+.avue-crud__dialog__menu {
+  padding-right: 20px;
+  float: left;
+}
 </style>

src/views/basicdata/fleet/driverMsg.vue

@@ -149,15 +149,13 @@
             v-hasPermi="['fleet:driverMsg:edit']"
           >查看
           </el-button>
-          <el-tooltip class="item" effect="dark" content="删除" :enterable="false" placement="top">
-            <el-button type="danger"
-                       v-hasPermi="['fleet:driverMsg:delete']"
-                       icon="el-icon-delete"
-                       size="mini"
-                       circle @click="deleteHandle(scope.row.id)"></el-button>
-          </el-tooltip>
+            <el-button
+              type="text"
+              v-hasPermi="['fleet:driverMsg:delete']"
+              icon="el-icon-delete"
+              size="mini"
+              circle @click="deleteHandle(scope.row.id)">删除</el-button>
         </template>
-
       </el-table-column>
     </el-table>
     <el-pagination