操作宽度

epmet-oper-web/src/views/modules/sys/upgrade-version-history.vue

@@ -1,7 +1,6 @@
 <template>
   <div>
-    <el-card shadow="never"
-             class="aui-card--fill">
+    <el-card shadow="never" class="aui-card--fill">
 
       <!-- 按钮 -->
       <div class="btn-group">
@@ -12,11 +11,9 @@
       <!-- 数据列表 -->
       <div>
         <el-table :data="histories" border style="width: 100%">
-          <el-table-column
-              prop="versionNo"
-              label="版本">
+          <el-table-column prop="versionNo" label="版本">
           </el-table-column>
-          <el-table-column label="操作" :width="250">
+          <el-table-column label="操作" :width="80">
             <template slot-scope="scope">
               <el-button type="primary" size="small" @click="onEditBtnClick(scope.row.id)">编辑</el-button>
             </template>
@@ -26,13 +23,8 @@
       </div>
 
       <!-- 分页条-->
-      <el-pagination
-          background
-          layout="prev, pager, next"
-          @current-change="onCurrentPageChanged"
-          :current-page="this.pageArgs.pageNo"
-          :page-size="this.pageArgs.pageSize"
-          :total="this.pageArgs.total">
+      <el-pagination background layout="prev, pager, next" @current-change="onCurrentPageChanged"
+        :current-page="this.pageArgs.pageNo" :page-size="this.pageArgs.pageSize" :total="this.pageArgs.total">
       </el-pagination>
 
       <!--      <Tinymce
@@ -43,11 +35,8 @@
     </el-card>
 
     <!-- 新增/修改 -->
-    <el-dialog :visible.sync="publishVersionUpgradeShow"
-               v-if="publishVersionUpgradeShow"
-               :close-on-click-modal="false"
-               :close-on-press-escape="false"
-               :title="this.operation === 'create' ? '发布新版本' : '修改'">
+    <el-dialog :visible.sync="publishVersionUpgradeShow" v-if="publishVersionUpgradeShow" :close-on-click-modal="false"
+      :close-on-press-escape="false" :title="this.operation === 'create' ? '发布新版本' : '修改'">
       <el-form :model="createOrUpdateForm" ref="createOrUpdateForm">
         <el-form-item prop="versionNo" label="版本">
           <el-input v-model="createOrUpdateForm.versionNo">
@@ -56,23 +45,17 @@
 
         <el-form-item prop="richContent" label="内容">
           <!-- <el-input v-model="createOrUpdateForm.richContent"> -->
-        <!-- <Tinymce v-model="createOrUpdateForm.richContent" :height="300" placeholder="在这里输入文字" /> -->
-        
-        <!-- :customerId="customerId" -->
-        <div id="J_quillEditor"></div>
-        <!-- 自定义上传图片功能 (使用element upload组件) -->
-        <el-upload
-          :headers="$getElUploadHeaders()"
-          :action="uploadUrl"
-          :show-file-list="false"
-          :before-upload="uploadBeforeUploadHandle"
-          :on-success="uploadSuccessHandle"
-          style="display: none"
-        >
-          <el-button ref="uploadBtn" type="primary" size="small">{{
-            $t('upload.button')
-          }}</el-button>
-        </el-upload>
+          <!-- <Tinymce v-model="createOrUpdateForm.richContent" :height="300" placeholder="在这里输入文字" /> -->
+
+          <!-- :customerId="customerId" -->
+          <div id="J_quillEditor"></div>
+          <!-- 自定义上传图片功能 (使用element upload组件) -->
+          <el-upload :headers="$getElUploadHeaders()" :action="uploadUrl" :show-file-list="false"
+            :before-upload="uploadBeforeUploadHandle" :on-success="uploadSuccessHandle" style="display: none">
+            <el-button ref="uploadBtn" type="primary" size="small">{{
+              $t('upload.button')
+              }}</el-button>
+          </el-upload>
           <!-- </el-input> -->
         </el-form-item>
         <el-button @click="onSubmitBtnClick" type="primary">提交</el-button>
@@ -91,13 +74,13 @@ export default {
 
   components: {},
 
-  activated() {
+  activated () {
     this.loadVersionUpgradeHistories();
   },
-  mounted(){
-    
+  mounted () {
+
   },
-  data() {
+  data () {
     return {
       quillEditor: null,
       quillEditorToolbarOptions: [
@@ -135,7 +118,7 @@ export default {
 
   methods: {
     // 图片上传前
-    uploadBeforeUploadHandle(file) {
+    uploadBeforeUploadHandle (file) {
       if (
         file.type !== 'image/jpg' &&
         file.type !== 'image/jpeg' &&
@@ -147,7 +130,7 @@ export default {
       }
     },
     // 上传图片成功
-    uploadSuccessHandle(res, file, fileList) {
+    uploadSuccessHandle (res, file, fileList) {
       if (res.code !== 0) {
         return this.$message.error(res.msg)
       }
@@ -158,7 +141,7 @@ export default {
       )
     },
     // 加载富文本编辑器
-    initQuill() {
+    initQuill () {
       console.log(document.getElementById('J_quillEditor'));
       this.quillEditor = new Quill('#J_quillEditor', {
         modules: {
@@ -167,9 +150,8 @@ export default {
         theme: 'snow'
       })
       // 自定义上传图片功能 (使用element upload组件)
-      this.uploadUrl = `${
-        window.SITE_CONFIG['apiURL']
-      }/oss/file/upload?token=${Cookies.get('token')}`
+      this.uploadUrl = `${window.SITE_CONFIG['apiURL']
+        }/oss/file/upload?token=${Cookies.get('token')}`
       this.quillEditor.getModule('toolbar').addHandler('image', () => {
         this.$refs.uploadBtn.$el.click()
       })
@@ -181,31 +163,31 @@ export default {
     /**
      * 加载版本更新历史
      */
-    loadVersionUpgradeHistories() {
+    loadVersionUpgradeHistories () {
       this.$http.get(`/sys/sysVersionUpgrade/page?pageNo=${this.pageArgs.pageNo}&pageSize=${this.pageArgs.pageSize}`)
-          .then(({data: result, status: httpStatus}) => {
-            if (result.code === 0) {
-              this.histories = result.data.list
-              this.pageArgs.total = result.data.total
-            } else {
-              this.$message({
-                type: 'error',
-                message: result.msg
-              })
-            }
-          })
+        .then(({ data: result, status: httpStatus }) => {
+          if (result.code === 0) {
+            this.histories = result.data.list
+            this.pageArgs.total = result.data.total
+          } else {
+            this.$message({
+              type: 'error',
+              message: result.msg
+            })
+          }
+        })
     },
     // 新增按钮点击
-    onAddBtnClick() {
+    onAddBtnClick () {
       this.publishVersionUpgradeShow = true;
       this.operation = 'create';
-      this.$nextTick(()=>{
+      this.$nextTick(() => {
         this.initQuill()
       })
     },
 
     // 编辑按钮点击
-    async onEditBtnClick(id) {
+    async onEditBtnClick (id) {
       this.publishVersionUpgradeShow = true;
       this.operation = 'edit';
       await this.getDetail(id);
@@ -213,7 +195,7 @@ export default {
 
     },
 
-    onCancelBtnClick() {
+    onCancelBtnClick () {
       this.$refs['createOrUpdateForm'].resetFields();
       this.publishVersionUpgradeShow = false;
       this.operation = null;
@@ -223,7 +205,7 @@ export default {
     /**
      * 翻页
      */
-    onCurrentPageChanged(pageNo) {
+    onCurrentPageChanged (pageNo) {
       this.pageArgs.pageNo = pageNo
       this.loadVersionUpgradeHistories()
     },
@@ -231,63 +213,63 @@ export default {
     /**
      * 提交
      */
-    onSubmitBtnClick() {
+    onSubmitBtnClick () {
       let url = this.operation === 'create' ? `/sys/sysVersionUpgrade/publish` : '/sys/sysVersionUpgrade/update';
       this.$http.post(url, this.$data.createOrUpdateForm)
-          .then(({data: rst, status: httpStatus}) => {
-            if (httpStatus !== 200) {
-              this.$message({
-                type: 'error',
-                message: '请求失败'
-              })
-            } else if (rst.code !== 0) {
-              this.$message({
-                type: 'error',
-                message: rst.msg
-              });
-            } else {
-              this.$message({
-                type: 'success',
-                message: '提交成功'
-              });
+        .then(({ data: rst, status: httpStatus }) => {
+          if (httpStatus !== 200) {
+            this.$message({
+              type: 'error',
+              message: '请求失败'
+            })
+          } else if (rst.code !== 0) {
+            this.$message({
+              type: 'error',
+              message: rst.msg
+            });
+          } else {
+            this.$message({
+              type: 'success',
+              message: '提交成功'
+            });
 
-              this.$refs['createOrUpdateForm'].resetFields();
-              this.publishVersionUpgradeShow = false;
-              this.loadVersionUpgradeHistories();
-            }
-          })
+            this.$refs['createOrUpdateForm'].resetFields();
+            this.publishVersionUpgradeShow = false;
+            this.loadVersionUpgradeHistories();
+          }
+        })
     },
 
     /**
      * 加载详情
      * @param id
      */
-    getDetail(id) {
+    getDetail (id) {
       this.$http.get(`/sys/sysVersionUpgrade/detail/${id}`)
-          .then(({status: httpStatus, data: epmetRst}) => {
-            if (httpStatus !== 200) {
-              this.$message({
-                type: 'error',
-                message: '请求失败'
-              })
-            } else if (epmetRst.code != 0) {
-              this.$message({
-                type: 'error',
-                message: epmetRst.msg
-              })
-            } else {
-              this.createOrUpdateForm = epmetRst.data;
+        .then(({ status: httpStatus, data: epmetRst }) => {
+          if (httpStatus !== 200) {
+            this.$message({
+              type: 'error',
+              message: '请求失败'
+            })
+          } else if (epmetRst.code != 0) {
+            this.$message({
+              type: 'error',
+              message: epmetRst.msg
+            })
+          } else {
+            this.createOrUpdateForm = epmetRst.data;
             this.quillEditor.root.innerHTML = this.createOrUpdateForm.richContent
 
-            }
-          })
+          }
+        })
     }
   }
 }
 </script>
 
 <style scoped lang="css">
-::v-deep .ql-toolbar{
+::v-deep .ql-toolbar {
   margin-top: 36px;
 }
 </style>