代码优化

src/views/mnt/deploy/sysRestore.vue

@@ -1,39 +1,23 @@
 <template>
-  <el-dialog
-    :append-to-body="true"
-    :close-on-click-modal="false"
-    :visible.sync="dialog"
-    title="系统还原"
-    width="800px"
-  >
+  <el-dialog :append-to-body="true" :close-on-click-modal="false" :visible.sync="dialog" title="系统还原" width="800px">
     <!--工具栏-->
     <div class="head-container">
-      <el-input
-        v-model="query.value"
-        clearable
-        placeholder="输入部署时间"
-        style="width: 200px"
-        class="filter-item"
-        @keyup.enter.native="toQuery"
+      <el-date-picker
+        v-model="query.createTime"
+        :default-time="['00:00:00','23:59:59']"
+        type="daterange"
+        range-separator=":"
+        class="el-range-editor--small date-item"
+        style="width: 240px;height: 30.5px"
+        value-format="yyyy-MM-dd HH:mm:ss"
+        start-placeholder="部署开始日期"
+        end-placeholder="部署结束日期"
       />
-      <el-button
-        class="filter-item"
-        size="mini"
-        type="success"
-        icon="el-icon-search"
-        @click="toQuery"
-      >搜索
-      </el-button>
+      <el-button class="filter-item" size="mini" type="success" icon="el-icon-search" @click="toQuery">搜索</el-button>
     </div>
     <el-form size="small" label-width="80px">
       <!--表格渲染-->
-      <el-table
-        v-loading="loading"
-        :data="data"
-        size="small"
-        style="width: 100%"
-        @row-click="showRow"
-      >
+      <el-table v-loading="loading" :data="data" size="small" style="width: 100%" @row-click="showRow">
         <el-table-column width="30px">
           <template slot-scope="scope">
             <el-radio v-model="radio" :label="scope.$index" />
@@ -41,19 +25,17 @@
         </el-table-column>
         <el-table-column prop="appName" label="应用名称" />
         <el-table-column prop="ip" label="部署IP" />
-        <el-table-column prop="deployDate" label="部署时间" />
+        <el-table-column prop="deployDate" label="部署时间">
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.deployDate) }}</span>
+          </template>
+        </el-table-column>
         <el-table-column prop="deployUser" label="部署人员" />
       </el-table>
     </el-form>
     <div slot="footer" class="dialog-footer">
       <el-button type="text" @click="cancel">取消</el-button>
-      <el-button
-        v-permission="['admin','deploy:add']"
-        :loading="loading"
-        type="primary"
-        @click="doSubmit"
-      >确认
-      </el-button>
+      <el-button v-permission="['admin','deploy:add']" :loading="submitLoading" type="primary" @click="doSubmit">确认</el-button>
     </div>
     <!--分页组件-->
     <el-pagination
@@ -68,11 +50,10 @@
 </template>
 
 <script>
-import checkPermission from '@/utils/permission'
-import initData from '@/mixins/initData'
-import { reducte } from '@/api/deployHistory'
+import crud from '@/mixins/crud'
+import { reducte } from '@/api/mnt/deployHistory'
 export default {
-  mixins: [initData],
+  mixins: [crud],
   props: {
     appName: {
       type: String,
@@ -81,7 +62,7 @@ export default {
   },
   data() {
     return {
-      loading: false,
+      submitLoading: false,
       dialog: false,
       history: [],
       radio: '',
@@ -95,51 +76,38 @@ export default {
     })
   },
   methods: {
-    checkPermission,
     beforeInit() {
       this.url = 'api/deployHistory'
       this.deployId = this.$parent.deployId
-      debugger
       if (this.deployId === '') {
         return false
       }
-      const sort = 'deployDate,desc'
-      this.params = {
-        page: this.page,
-        size: this.size,
-        sort: sort,
-        deployId: this.$parent.deployId
-      }
-      const query = this.query
-      const type = 'deployDate'
-      const value = query.value
-      this.params[type] = value
+      this.sort = 'deployDate,desc'
+      this.params['deployId'] = this.deployId
       return true
     },
-    formatterAppId(row, column) {
-      return this.appNames
-    },
     showRow(row) {
       this.radio = this.data.indexOf(row)
       this.selectIndex = row.id
     },
     cancel() {
       this.dialog = false
-      this.loading = false
+      this.submitLoading = false
     },
     doSubmit() {
       if (this.selectIndex === '') {
         this.$message.error('请选择要还原的备份')
       } else {
+        this.submitLoading = true
         reducte(JSON.stringify(this.data[this.radio]))
           .then(res => {
             this.dialog = false
-            this.loading = false
+            this.submitLoading = false
             this.appNames = ''
             this.$parent.init()
           })
           .catch(err => {
-            this.loading = false
+            this.submitLoading = false
             console.log('error:' + err.response.data.message)
           })
       }