Browse Source

样式修改

qianlishi 4 năm trước cách đây
mục cha
commit
01f4f2ada8

+ 4 - 4
report-ui/src/assets/styles/index.scss

@@ -302,10 +302,10 @@ a:hover {
     font-weight: normal !important;
   }
 }
-.el-form-item__label {
-  line-height: 30px !important;
-  height: 30px;
-}
+// .el-form-item__label {
+//   line-height: 30px !important;
+//   height: 30px;
+// }
 // .el-form-item__content {
 //   line-height: 30px !important;
 //   height: 30px;

+ 286 - 295
report-ui/src/views/report/datasource/index.vue

@@ -6,227 +6,210 @@
  !-->
 <template>
   <div class="app-container">
-    <el-form ref="form"
-             :model="params"
-             :rules="rules"
-             label-width="120px">
+    <el-form ref="form" :model="params" :rules="rules" label-width="120px">
       <!-- 搜索 -->
       <el-row :gutter="10">
-        <el-col :xs="24"
-                :sm="20"
-                :md="12"
-                :lg="6"
-                :xl="4">
+        <el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4">
           <el-form-item label="数据源名称">
-            <el-input v-model.trim="params.sourceName"
-                      size="mini"
-                      clearable
-                      placeholder="数据源名称"
-                      class="filter-item"
-                      @keyup.enter.native="crud.toQuery" />
+            <el-input
+              v-model.trim="params.sourceName"
+              size="mini"
+              clearable
+              placeholder="数据源名称"
+              class="filter-item"
+              @keyup.enter.native="crud.toQuery"
+            />
           </el-form-item>
         </el-col>
-        <el-col :xs="24"
-                :sm="20"
-                :md="12"
-                :lg="6"
-                :xl="4">
+        <el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4">
           <el-form-item label="数据源编码">
-            <el-input v-model.trim="params.sourceCode"
-                      size="mini"
-                      clearable
-                      placeholder="数据源Code"
-                      class="filter-item"
-                      @keyup.enter.native="crud.toQuery" />
+            <el-input
+              v-model.trim="params.sourceCode"
+              size="mini"
+              clearable
+              placeholder="数据源Code"
+              class="filter-item"
+              @keyup.enter.native="crud.toQuery"
+            />
           </el-form-item>
         </el-col>
-        <el-col :xs="24"
-                :sm="20"
-                :md="12"
-                :lg="6"
-                :xl="4">
-          <el-form-item label="数据源类型"
-                        size="mini">
-            <Dictionary v-model="params.sourceType"
-                        :updata-dict="params.sourceType"
-                        :dict-key="'SOURCE_TYPE'" />
+        <el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4" class="query">
+          <el-form-item label="数据源类型" size="mini">
+            <Dictionary
+              v-model="params.sourceType"
+              :updata-dict="params.sourceType"
+              :dict-key="'SOURCE_TYPE'"
+            />
           </el-form-item>
         </el-col>
-        <el-col :xs="24"
-                :sm="20"
-                :md="4"
-                :lg="4"
-                :xl="4">
-          <el-button type="primary"
-                     size="mini"
-                     @click="search('form')">查询</el-button>
-          <el-button type="danger"
-                     size="mini"
-                     @click="reset('form')">重置</el-button>
+        <el-col :xs="24" :sm="20" :md="4" :lg="4" :xl="4" class="query">
+          <el-button type="primary" size="mini" @click="search('form')"
+            >查询</el-button
+          >
+          <el-button type="danger" size="mini" @click="reset('form')"
+            >重置</el-button
+          >
         </el-col>
       </el-row>
     </el-form>
-    <el-button type="primary"
-               icon="el-icon-plus"
-               size="mini"
-               @click="showAddLogModel()">新增</el-button>
+    <el-button
+      type="primary"
+      icon="el-icon-plus"
+      size="mini"
+      @click="showAddLogModel()"
+      >新增</el-button
+    >
 
     <!--表格渲染-->
-    <el-table v-loading="listLoading"
-              border
-              :data="list"
-              class="mt10"
-              element-loading-text="Loading"
-              style="width: 100%">
-      <el-table-column align="center"
-                       label="序号"
-                       type="index"
-                       min-width="40" />
-      <el-table-column prop="sourceType"
-                       label="数据源类型" />
-      <el-table-column prop="sourceNameCode"
-                       label="数据源名称[编码]" />
-      <el-table-column prop="sourceDesc"
-                       label="数据源描述" />
-      <el-table-column prop="createBy"
-                       label="创建人"
-                       width="100" />
-      <el-table-column prop="createTime"
-                       label="创建时间"
-                       width="140" />
-      <el-table-column prop="updateBy"
-                       label="修改人"
-                       width="100" />
-      <el-table-column prop="updateTime"
-                       label="修改时间"
-                       width="140" />
-      <el-table-column label="操作"
-                       width="120px"
-                       align="center">
+    <el-table
+      v-loading="listLoading"
+      border
+      :data="list"
+      class="mt10"
+      element-loading-text="Loading"
+      style="width: 100%"
+    >
+      <el-table-column
+        align="center"
+        label="序号"
+        type="index"
+        min-width="40"
+      />
+      <el-table-column prop="sourceType" label="数据源类型" />
+      <el-table-column prop="sourceNameCode" label="数据源名称[编码]" />
+      <el-table-column prop="sourceDesc" label="数据源描述" />
+      <el-table-column prop="createBy" label="创建人" width="100" />
+      <el-table-column prop="createTime" label="创建时间" width="140" />
+      <el-table-column prop="updateBy" label="修改人" width="100" />
+      <el-table-column prop="updateTime" label="修改时间" width="140" />
+      <el-table-column label="操作" width="120px" align="center">
         <template slot-scope="scope">
-          <el-button type="text"
-                     @click="showAddLogModel(scope.row)">编辑</el-button>
+          <el-button type="text" @click="showAddLogModel(scope.row)"
+            >编辑</el-button
+          >
           <!-- <el-popconfirm :title="'确定删除' + scope.row.sourceNameCode + '吗?'"
                          @onConfirm="delData(scope.row)"> -->
-          <el-button slot="reference"
-                     @click="delData(scope.row)"
-                     type="text">删除</el-button>
+          <el-button slot="reference" @click="delData(scope.row)" type="text"
+            >删除</el-button
+          >
           <!-- </el-popconfirm> -->
         </template>
       </el-table-column>
     </el-table>
     <div class="block">
-      <el-pagination :total="totalCount"
-                     :page-sizes="[10, 20, 50, 100]"
-                     :page-size="params.pageSize"
-                     :current-page="params.pageNumber"
-                     layout="total, sizes, prev, pager, next, jumper"
-                     @size-change="handleSizeChange"
-                     @current-change="handleCurrentChange" />
+      <el-pagination
+        :total="totalCount"
+        :page-sizes="[10, 20, 50, 100]"
+        :page-size="params.pageSize"
+        :current-page="params.pageNumber"
+        layout="total, sizes, prev, pager, next, jumper"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
     </div>
     <!--表单组件-->
-    <el-dialog title="项目基础配置"
-               width="50%"
-               :close-on-click-modal="false"
-               center
-               :visible.sync="basicDialog"
-               @close="closeDialog">
-      <el-form ref="userForm"
-               :model="dialogForm"
-               :rules="rules"
-               size="small"
-               label-width="100px">
+    <el-dialog
+      title="项目基础配置"
+      width="50%"
+      :close-on-click-modal="false"
+      center
+      :visible.sync="basicDialog"
+      @close="closeDialog"
+    >
+      <el-form
+        ref="userForm"
+        :model="dialogForm"
+        :rules="rules"
+        size="small"
+        label-width="100px"
+      >
         <el-row :gutter="10">
-          <el-col :xs="24"
-                  :sm="20"
-                  :md="6"
-                  :lg="6"
-                  :xl="6">
-            <el-form-item label="数据源类型"
-                          prop="sourceType">
-              <el-select v-model.trim="dialogForm.sourceType"
-                         placeholder="请选择"
-                         clearable
-                         @change="selectChange">
-                <el-option v-for="item in dictionaryOptions"
-                           :key="item.id"
-                           :label="item.text"
-                           :value="item.id" />
+          <el-col :xs="24" :sm="20" :md="6" :lg="6" :xl="6">
+            <el-form-item label="数据源类型" prop="sourceType">
+              <el-select
+                v-model.trim="dialogForm.sourceType"
+                placeholder="请选择"
+                clearable
+                @change="selectChange"
+              >
+                <el-option
+                  v-for="item in dictionaryOptions"
+                  :key="item.id"
+                  :label="item.text"
+                  :value="item.id"
+                />
               </el-select>
             </el-form-item>
           </el-col>
-          <el-col :xs="24"
-                  :sm="20"
-                  :md="7"
-                  :lg="7"
-                  :xl="7">
-            <el-form-item label="数据源编码"
-                          prop="sourceCode"
-                          >
-              <el-input :disabled="updataDisabled" v-model.trim="dialogForm.sourceCode" />
+          <el-col :xs="24" :sm="20" :md="7" :lg="7" :xl="7">
+            <el-form-item label="数据源编码" prop="sourceCode">
+              <el-input
+                :disabled="updataDisabled"
+                v-model.trim="dialogForm.sourceCode"
+              />
             </el-form-item>
           </el-col>
-          <el-col :xs="24"
-                  :sm="20"
-                  :md="7"
-                  :lg="7"
-                  :xl="7">
-            <el-form-item label="数据源名称"
-                          prop="sourceName">
+          <el-col :xs="24" :sm="20" :md="7" :lg="7" :xl="7">
+            <el-form-item label="数据源名称" prop="sourceName">
               <el-input v-model.trim="dialogForm.sourceName" />
             </el-form-item>
           </el-col>
-          <el-col :xs="24"
-                  :sm="20"
-                  :md="20"
-                  :lg="20"
-                  :xl="20">
+          <el-col :xs="24" :sm="20" :md="20" :lg="20" :xl="20">
             <el-form-item label="数据源描述">
-              <el-input v-model.trim="dialogForm.sourceDesc"
-                        type="textarea"
-                        :autosize="{ minRows: 2, maxRows: 4 }" />
+              <el-input
+                v-model.trim="dialogForm.sourceDesc"
+                type="textarea"
+                :autosize="{ minRows: 2, maxRows: 4 }"
+              />
             </el-form-item>
           </el-col>
         </el-row>
         <el-row :gutter="10">
-          <el-col v-for="(data, index) in dataLink"
-                  :key="index"
-                  :xs="24"
-                  :sm="20"
-                  :md="20"
-                  :lg="20"
-                  :xl="20">
+          <el-col
+            v-for="(data, index) in dataLink"
+            :key="index"
+            :xs="24"
+            :sm="20"
+            :md="20"
+            :lg="20"
+            :xl="20"
+          >
             <el-form-item :label="data.labelValue">
               <el-input v-model.trim="data.value" />
             </el-form-item>
           </el-col>
         </el-row>
       </el-form>
-      <div slot="footer"
-           class="dialog-footer">
+      <div slot="footer" class="dialog-footer">
         <el-button @click="closeDialog">取消</el-button>
-        <el-button type="warning"
-                   @click="test">测试</el-button>
-        <el-button type="primary"
-                   @click="UserConfirm('userForm')">确定</el-button>
+        <el-button type="warning" @click="test">测试</el-button>
+        <el-button type="primary" @click="UserConfirm('userForm')"
+          >确定</el-button
+        >
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { pageList, testConnection, addDataSource, editDataSource, deleteDataSource } from '@/api/report'
-import { getDictList } from '@/api/dict-data' // 获取数据字典
-import Dictionary from '@/components/Dictionary/index'
+import {
+  pageList,
+  testConnection,
+  addDataSource,
+  editDataSource,
+  deleteDataSource
+} from "@/api/report";
+import { getDictList } from "@/api/dict-data"; // 获取数据字典
+import Dictionary from "@/components/Dictionary/index";
 
 export default {
-  name: 'Support',
+  name: "Support",
   components: { Dictionary },
-  data () {
+  data() {
     return {
       dictionaryOptions: [], // 数据源类型
       selectedList: [],
-      clickType: '',
+      clickType: "",
       formData: {},
       list: null,
       totalCount: 0,
@@ -236,201 +219,206 @@ export default {
       dialogFormVisible: false,
       basicDialog: false,
       params: {
-        sourceName: '',
-        sourceCode: '',
-        sourceType: '',
+        sourceName: "",
+        sourceCode: "",
+        sourceType: "",
         pageNumber: 1,
         pageSize: 10,
-        order: 'DESC',
-        sort: 'update_time',
+        order: "DESC",
+        sort: "update_time"
       },
       dialogForm: {
-        sourceName: '',
-        sourceCode: '',
-        sourceType: '',
-        sourceDesc: '',
-        sourceConfig: '',
+        sourceName: "",
+        sourceCode: "",
+        sourceType: "",
+        sourceDesc: "",
+        sourceConfig: ""
       },
       dataLink: [],
       rules: {
-        sourceType: [{ required: true, message: '数据集名称必选', trigger: 'change' }],
-        sourceCode: [{ required: true, message: '数据集编码必填', trigger: 'blur' }],
-        sourceName: [{ required: true, message: '数据源名称必选', trigger: 'blur' }],
+        sourceType: [
+          { required: true, message: "数据集名称必选", trigger: "change" }
+        ],
+        sourceCode: [
+          { required: true, message: "数据集编码必填", trigger: "blur" }
+        ],
+        sourceName: [
+          { required: true, message: "数据源名称必选", trigger: "blur" }
+        ]
       },
-      value: '',
+      value: "",
       updataDisabled: false,
       testReplyCode: null
-    }
+    };
   },
   watch: {},
   // 在生命周期 beforeCreate里面改变this指向
-  beforeCreate: function () { },
-  mounted () { },
-  created () {
-    this.getSystem()
-    this.queryByPage()
+  beforeCreate: function() {},
+  mounted() {},
+  created() {
+    this.getSystem();
+    this.queryByPage();
   },
   methods: {
     // 查询
-    search () {
-      this.params.pageNumber = 1
-      this.queryByPage()
+    search() {
+      this.params.pageNumber = 1;
+      this.queryByPage();
     },
     // 重置
-    reset (formName) {
+    reset(formName) {
       // this.$refs[formName].resetFields()
-      this.params.sourceName = ''
-      this.params.sourceCode = ''
-      this.params.pageNumber = 1
-      this.params.sourceType = ''
-      this.queryByPage()
+      this.params.sourceName = "";
+      this.params.sourceCode = "";
+      this.params.pageNumber = 1;
+      this.params.sourceType = "";
+      this.queryByPage();
     },
-    async queryByPage () {
-      const res = await pageList(this.params)
-      if (res.code != '200') return
-      this.listLoading = true
-      this.list = res.data.records
-      this.list.forEach((value) => {
-        value['sourceNameCode'] = value.sourceName + '[' + value.sourceCode + ']'
-      })
-      this.totalCount = res.data.total
-      this.totalPage = res.data.pages
-      this.listLoading = false
+    async queryByPage() {
+      const res = await pageList(this.params);
+      if (res.code != "200") return;
+      this.listLoading = true;
+      this.list = res.data.records;
+      this.list.forEach(value => {
+        value["sourceNameCode"] =
+          value.sourceName + "[" + value.sourceCode + "]";
+      });
+      this.totalCount = res.data.total;
+      this.totalPage = res.data.pages;
+      this.listLoading = false;
     },
-    handleSizeChange (val) {
-      this.params.pageSize = val
-      this.queryByPage()
+    handleSizeChange(val) {
+      this.params.pageSize = val;
+      this.queryByPage();
     },
-    handleCurrentChange (val) {
-      this.params.pageNumber = val
-      this.queryByPage()
+    handleCurrentChange(val) {
+      this.params.pageNumber = val;
+      this.queryByPage();
     },
     // 关闭模态框
-    closeDialog (bool) {
+    closeDialog(bool) {
       // bool && this.search('form') // 点确定关闭弹窗的时候才会刷新列表
       // this.$refs['userForm'].resetFields()
-      this.basicDialog = false
+      this.basicDialog = false;
     },
     // 打开模态框
-    showAddLogModel (val) {
-      this.basicDialog = true
+    showAddLogModel(val) {
+      this.basicDialog = true;
       if (val == undefined) {
-        this.updataDisabled = false
-        this.getSystem()
+        this.updataDisabled = false;
+        this.getSystem();
         this.dialogForm = {
-          sourceName: '',
-          sourceCode: '',
-          sourceType: '',
-          sourceDesc: '',
-          sourceConfig: '',
-        }
+          sourceName: "",
+          sourceCode: "",
+          sourceType: "",
+          sourceDesc: "",
+          sourceConfig: ""
+        };
       } else {
-        this.updataDisabled = true
-        this.dialogForm = val
-        const newSourceType = this.dialogForm
-        let newDataLink = []
-        this.dictionaryOptions.map((item) => {
+        this.updataDisabled = true;
+        this.dialogForm = val;
+        const newSourceType = this.dialogForm;
+        let newDataLink = [];
+        this.dictionaryOptions.map(item => {
           if (item.id == newSourceType.sourceType) {
-            newDataLink = JSON.parse(item.extend)
-            var sourceConfigJson = JSON.parse(newSourceType.sourceConfig)
+            newDataLink = JSON.parse(item.extend);
+            var sourceConfigJson = JSON.parse(newSourceType.sourceConfig);
             for (var i = 0; i < newDataLink.length; i++) {
-              newDataLink[i].value = sourceConfigJson[newDataLink[i].label]
+              newDataLink[i].value = sourceConfigJson[newDataLink[i].label];
             }
           }
-        })
-        this.dataLink = newDataLink
+        });
+        this.dataLink = newDataLink;
       }
     },
     // 获取数据字典
-    async getSystem () {
-      const { code, data } = await getDictList('SOURCE_TYPE')
-      if (code != '200') return
-      this.dictionaryOptions = data
-      this.dialogForm.sourceType = this.dictionaryOptions[0].text
-      this.dataLink = JSON.parse(this.dictionaryOptions[0].extend)
+    async getSystem() {
+      const { code, data } = await getDictList("SOURCE_TYPE");
+      if (code != "200") return;
+      this.dictionaryOptions = data;
+      this.dialogForm.sourceType = this.dictionaryOptions[0].text;
+      this.dataLink = JSON.parse(this.dictionaryOptions[0].extend);
     },
-    selectChange (val) {
-      this.dataLink = []
-      const extendJSON = this.dictionaryOptions.find(function (obj) {
-        return obj.id == val
-      })
-      this.dataLink = JSON.parse(extendJSON.extend)
+    selectChange(val) {
+      this.dataLink = [];
+      const extendJSON = this.dictionaryOptions.find(function(obj) {
+        return obj.id == val;
+      });
+      this.dataLink = JSON.parse(extendJSON.extend);
     },
     // 测试
-    test () {
-      const newList = {}
-      this.dataLink.forEach((item) => {
-        newList[item.label] = item.value
-      })
-      this.dialogForm.sourceConfig = JSON.stringify(newList)
-      testConnection(this.dialogForm).then((data) => {
-        if (data.code == '200') {
+    test() {
+      const newList = {};
+      this.dataLink.forEach(item => {
+        newList[item.label] = item.value;
+      });
+      this.dialogForm.sourceConfig = JSON.stringify(newList);
+      testConnection(this.dialogForm).then(data => {
+        if (data.code == "200") {
           this.testReplyCode = data.code;
           this.$message({
-            message: '测试成功!',
-            type: 'success'
+            message: "测试成功!",
+            type: "success"
           });
-
         } else {
-          this.testReplyCode = null
+          this.testReplyCode = null;
         }
-      })
+      });
     },
-    async delData (val) {
-      this.$confirm('确定删除?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning',
+    async delData(val) {
+      this.$confirm("确定删除?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
         .then(async () => {
-          this.$emit('deletelayer')
-          this.visible = false
-          const { code, data } = await deleteDataSource(val)
-          if (code != '200') return
-          this.queryByPage()
+          this.$emit("deletelayer");
+          this.visible = false;
+          const { code, data } = await deleteDataSource(val);
+          if (code != "200") return;
+          this.queryByPage();
           this.$message({
-            type: 'success',
-            message: '删除成功!',
-          })
+            type: "success",
+            message: "删除成功!"
+          });
         })
         .catch(() => {
           this.$message({
-            type: 'info',
-            message: '已取消删除',
-          })
-        })
-
+            type: "info",
+            message: "已取消删除"
+          });
+        });
     },
     // 提交
-    async UserConfirm (formName) {
-      const newList = {}
-      this.dataLink.forEach((item) => {
-        newList[item.label] = item.value
-      })
-      this.dialogForm.sourceConfig = JSON.stringify(newList)
+    async UserConfirm(formName) {
+      const newList = {};
+      this.dataLink.forEach(item => {
+        newList[item.label] = item.value;
+      });
+      this.dialogForm.sourceConfig = JSON.stringify(newList);
       this.$refs[formName].validate(async (valid, obj) => {
         if (valid) {
-          if (this.testReplyCode != '200') {
-            this.$message.error("测试结果为成功后方可保存!")
-            return
+          if (this.testReplyCode != "200") {
+            this.$message.error("测试结果为成功后方可保存!");
+            return;
           }
           if (this.dialogForm.id == undefined) {
-            const { code } = await addDataSource(this.dialogForm)
-            if (code != '200') return
-            this.queryByPage()
+            const { code } = await addDataSource(this.dialogForm);
+            if (code != "200") return;
+            this.queryByPage();
           } else {
-            const { code } = await editDataSource(this.dialogForm)
-            if (code != '200') return
-            this.queryByPage()
+            const { code } = await editDataSource(this.dialogForm);
+            if (code != "200") return;
+            this.queryByPage();
           }
-          this.closeDialog(false)
+          this.closeDialog(false);
         } else {
-          return
+          return;
         }
-      })
-    },
-  },
-}
+      });
+    }
+  }
+};
 </script>
 <style lang="scss" scoped>
 .title {
@@ -438,4 +426,7 @@ export default {
   display: inline-block;
   text-align: left;
 }
+.query {
+  margin-top: 5px;
+}
 </style>

+ 226 - 221
report-ui/src/views/report/report/index.vue

@@ -6,36 +6,29 @@
  !-->
 <template>
   <div class="app-container">
-    <el-form ref="form"
-             :model="params"
-             :rules="rules"
-             label-width="120px">
+    <el-form ref="form" :model="params" :rules="rules" label-width="120px">
       <!-- 搜索 -->
       <el-row :gutter="10">
-        <el-col :xs="24"
-                :sm="20"
-                :md="12"
-                :lg="6"
-                :xl="4">
+        <el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4">
           <el-form-item label="名称">
-            <el-input v-model="params.reportName"
-                      size="mini"
-                      clearable
-                      placeholder="名称"
-                      class="filter-item" />
+            <el-input
+              v-model="params.reportName"
+              size="mini"
+              clearable
+              placeholder="名称"
+              class="filter-item"
+            />
           </el-form-item>
         </el-col>
-        <el-col :xs="24"
-                :sm="20"
-                :md="12"
-                :lg="6"
-                :xl="4">
+        <el-col :xs="24" :sm="20" :md="12" :lg="6" :xl="4">
           <el-form-item label="报表编码">
-            <el-input v-model="params.reportCode"
-                      size="mini"
-                      clearable
-                      placeholder="报表编码"
-                      class="filter-item" />
+            <el-input
+              v-model="params.reportCode"
+              size="mini"
+              clearable
+              placeholder="报表编码"
+              class="filter-item"
+            />
           </el-form-item>
         </el-col>
         <!-- <el-col :xs="24"
@@ -50,98 +43,96 @@
                         :dict-key="'REPORT_TYPE'" />
           </el-form-item>
         </el-col> -->
-        <el-col :xs="24"
-                :sm="20"
-                :md="4"
-                :lg="4"
-                :xl="4">
-          <el-button type="primary"
-                     size="mini"
-                     @click="search('form')">查询</el-button>
-          <el-button type="danger"
-                     size="mini"
-                     @click="reset('form')">重置</el-button>
+        <el-col :xs="24" :sm="20" :md="4" :lg="4" :xl="4" class="query">
+          <el-button type="primary" size="mini" @click="search('form')"
+            >查询</el-button
+          >
+          <el-button type="danger" size="mini" @click="reset('form')"
+            >重置</el-button
+          >
         </el-col>
       </el-row>
     </el-form>
-    <el-button type="primary"
-               size="mini"
-               icon="el-icon-plus"
-               @click="showAddReportModel()">新增</el-button>
+    <el-button
+      type="primary"
+      size="mini"
+      icon="el-icon-plus"
+      @click="showAddReportModel()"
+      >新增</el-button
+    >
 
     <!--表格渲染-->
-    <el-table v-loading="listLoading"
-              border
-              :data="list"
-              element-loading-text="Loading"
-              class="mt10"
-              style="width: 100%">
-      <el-table-column align="center"
-                       label="序号"
-                       type="index"
-                       min-width="40" />
+    <el-table
+      v-loading="listLoading"
+      border
+      :data="list"
+      element-loading-text="Loading"
+      class="mt10"
+      style="width: 100%"
+    >
+      <el-table-column
+        align="center"
+        label="序号"
+        type="index"
+        min-width="40"
+      />
       <!-- <el-table-column label="报表类型">
         <template slot-scope="scope">
           {{scope.row.reportType | reportTableType}}
         </template>
       </el-table-column> -->
-      <el-table-column prop="reportName"
-                       label="名称" />
-      <el-table-column prop="reportCode"
-                       label="报表编码" />
+      <el-table-column prop="reportName" label="名称" />
+      <el-table-column prop="reportCode" label="报表编码" />
       <!-- <el-table-column prop="reportGroup"
                        label="分组">
         <template slot-scope="scope">
           {{scope.row.reportGroup | filterPushType}}
         </template>
       </el-table-column> -->
-      <el-table-column prop="reportDesc"
-                       label="备注" />
-      <el-table-column prop="createBy"
-                       label="创建人" />
-      <el-table-column prop="createTime"
-                       label="创建时间" />
-      <el-table-column prop="updateBy"
-                       label="更新人" />
-      <el-table-column prop="updateTime"
-                       label="更新时间" />
-      <el-table-column label="操作"
-                       width="200px"
-                       align="center">
+      <el-table-column prop="reportDesc" label="备注" />
+      <el-table-column prop="createBy" label="创建人" />
+      <el-table-column prop="createTime" label="创建时间" />
+      <el-table-column prop="updateBy" label="更新人" />
+      <el-table-column prop="updateTime" label="更新时间" />
+      <el-table-column label="操作" width="200px" align="center">
         <template slot-scope="scope">
-          <el-button type="text"
-                     @click="preview(scope.row)">预览</el-button>
-          <el-button type="text"
-                     @click="design(scope.row)">设计</el-button>
-          <el-button type="text"
-                     @click="showAddReportModel(scope.row)">编辑</el-button>
-          <el-button type="text"
-                     @click="del(scope.row)">删除</el-button>
+          <el-button type="text" @click="preview(scope.row)">预览</el-button>
+          <el-button type="text" @click="design(scope.row)">设计</el-button>
+          <el-button type="text" @click="showAddReportModel(scope.row)"
+            >编辑</el-button
+          >
+          <el-button type="text" @click="del(scope.row)">删除</el-button>
         </template>
       </el-table-column>
     </el-table>
     <div class="block">
-      <el-pagination :total="totalCount"
-                     :page-sizes="[10, 20, 50, 100]"
-                     :page-size="params.pageSize"
-                     :current-page="params.pageNumber"
-                     layout="total, sizes, prev, pager, next, jumper"
-                     @size-change="handleSizeChange"
-                     @current-change="handleCurrentChange" />
+      <el-pagination
+        :total="totalCount"
+        :page-sizes="[10, 20, 50, 100]"
+        :page-size="params.pageSize"
+        :current-page="params.pageNumber"
+        layout="total, sizes, prev, pager, next, jumper"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
     </div>
     <!--表单组件-->
-    <el-dialog title="项目基础配置"
-               width="50%"
-               :close-on-click-modal="false"
-               center
-               :visible.sync="basicDialog"
-               @close="closeDialog">
-      <el-form ref="userForm"
-               :model="dialogForm"
-               :rules="rules"
-               size="small"
-               style="min-height:200px"
-               label-width="100px">
+    <el-dialog
+      title="项目基础配置"
+      width="50%"
+      :close-on-click-modal="false"
+      center
+      :visible.sync="basicDialog"
+      @close="closeDialog"
+    >
+      <el-form
+        ref="userForm"
+        :model="dialogForm"
+        :rules="rules"
+        size="small"
+        style="min-height:200px"
+        label-width="100px"
+      >
         <el-row :gutter="10">
           <!-- <el-col :xs="24"
                   :sm="20"
@@ -159,24 +150,17 @@
               </el-select>
             </el-form-item> -->
           <!-- </el-col> -->
-          <el-col :xs="24"
-                  :sm="20"
-                  :md="12"
-                  :lg="12"
-                  :xl="12">
-            <el-form-item label="名称"
-                          prop="reportName">
+          <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
+            <el-form-item label="名称" prop="reportName">
               <el-input v-model="dialogForm.reportName" />
             </el-form-item>
           </el-col>
-          <el-col :xs="24"
-                  :sm="20"
-                  :md="12"
-                  :lg="12"
-                  :xl="12">
-            <el-form-item label="报表编码"
-                          prop="reportCode">
-              <el-input :disabled="reportCodeDisable" v-model="dialogForm.reportCode" />
+          <el-col :xs="24" :sm="20" :md="12" :lg="12" :xl="12">
+            <el-form-item label="报表编码" prop="reportCode">
+              <el-input
+                :disabled="reportCodeDisable"
+                v-model="dialogForm.reportCode"
+              />
             </el-form-item>
           </el-col>
         </el-row>
@@ -200,10 +184,12 @@
         </el-row> -->
         <el-col :span="24">
           <el-form-item label="备注">
-            <el-input v-model="dialogForm.reportDesc"
-                      type="textarea"
-                      placeholder="请输入内容"
-                      show-word-limit />
+            <el-input
+              v-model="dialogForm.reportDesc"
+              type="textarea"
+              placeholder="请输入内容"
+              show-word-limit
+            />
           </el-form-item>
         </el-col>
         <el-col :span="24">
@@ -214,66 +200,73 @@
               :headers="headers"
               :show-file-list="false"
               :on-success="handleAvatarSuccess"
-              :before-upload="beforeAvatarUpload">
-              <img v-if="dialogForm.reportImage" :src="dialogForm.reportImage == null ? require('../../../assets/images/charts.jpg') : dialogForm.reportImage " class="avatar">
+              :before-upload="beforeAvatarUpload"
+            >
+              <img
+                v-if="dialogForm.reportImage"
+                :src="
+                  dialogForm.reportImage == null
+                    ? require('../../../assets/images/charts.jpg')
+                    : dialogForm.reportImage
+                "
+                class="avatar"
+              />
               <i v-else class="el-icon-plus avatar-uploader-icon"></i>
             </el-upload>
           </el-form-item>
         </el-col>
       </el-form>
-      <div slot="footer"
-           class="dialog-footer">
+      <div slot="footer" class="dialog-footer">
         <el-button @click="basicDialog = false">取消</el-button>
-        <el-button type="primary"
-                   @click="UserConfirm">保存</el-button>
+        <el-button type="primary" @click="UserConfirm">保存</el-button>
       </div>
     </el-dialog>
   </div>
 </template>
 
 <script>
-import { dataDictionary } from '@/api/common'
+import { dataDictionary } from "@/api/common";
 import { getToken } from "@/utils/auth";
-import { reportPageList, addReport, editReport, delReport } from '@/api/report'
-import Dictionary from '@/components/Dictionary/index'
-var typeData
+import { reportPageList, addReport, editReport, delReport } from "@/api/report";
+import Dictionary from "@/components/Dictionary/index";
+var typeData;
 export default {
-  name: 'Report',
+  name: "Report",
   components: { Dictionary },
   filters: {
-    filterPushType (val) {
+    filterPushType(val) {
       for (var i = 0; i < typeData.dictionaryGroupOptions.length; i++) {
         if (typeData.dictionaryGroupOptions[i].id == val) {
-          return typeData.dictionaryGroupOptions[i].text
+          return typeData.dictionaryGroupOptions[i].text;
         }
       }
     },
-    reportTableType (val) {
+    reportTableType(val) {
       for (var i = 0; i < typeData.dictionaryTypeOptions.length; i++) {
         if (typeData.dictionaryTypeOptions[i].id == val) {
-          return typeData.dictionaryTypeOptions[i].text
+          return typeData.dictionaryTypeOptions[i].text;
         }
       }
-    },
+    }
   },
-  data () {
+  data() {
     return {
       params: {
-        reportCode: '',
-        reportName: '',
+        reportCode: "",
+        reportName: "",
         // reportType: '',
         pageNumber: 1,
         pageSize: 10,
-        order: 'DESC',
-        sort: 'update_time',
+        order: "DESC",
+        sort: "update_time"
       },
       dialogForm: {
-        reportName: '',
-        reportCode: '',
+        reportName: "",
+        reportCode: "",
         // reportType: '',
         // reportGroup: '',
-        reportDesc: '',
-        reportImage: '',
+        reportDesc: "",
+        reportImage: ""
       },
       basicDialog: false,
       listLoading: true,
@@ -287,142 +280,151 @@ export default {
       requestUrl: process.env.BASE_API + "/file/upload",
       headers: {
         Authorization: getToken()
-      },
-
-    }
+      }
+    };
   },
 
-  mounted () { },
+  mounted() {},
   // 在生命周期 beforeCreate里面改变this指向
-  beforeCreate: function () {
-    typeData = this
+  beforeCreate: function() {
+    typeData = this;
   },
-  created () {
-    this.queryByPage()
-
+  created() {
+    this.queryByPage();
   },
   methods: {
     // 查询
-    search () {
-      this.params.pageNumber = 1
-      this.queryByPage()
+    search() {
+      this.params.pageNumber = 1;
+      this.queryByPage();
     },
     // 重置
-    reset (formName) {
-      this.$refs[formName].resetFields()
-      this.params.reportName = ''
-      this.params.reportCode = ''
+    reset(formName) {
+      this.$refs[formName].resetFields();
+      this.params.reportName = "";
+      this.params.reportCode = "";
       // this.params.reportType = ''
-      this.params.pageNumber = 1
-      this.queryByPage()
+      this.params.pageNumber = 1;
+      this.queryByPage();
     },
-    async queryByPage () {
-      const res = await reportPageList(this.params)
-      if (res.code != '200') return
-      this.listLoading = true
-      this.list = res.data.records
-      this.list.forEach((value) => {
-        value['reportNameCode'] = value.reportName + '[' + value.reportCode + ']'
-      })
-      this.totalCount = res.data.total
-      this.totalPage = res.data.pages
-      this.listLoading = false
+    async queryByPage() {
+      const res = await reportPageList(this.params);
+      if (res.code != "200") return;
+      this.listLoading = true;
+      this.list = res.data.records;
+      this.list.forEach(value => {
+        value["reportNameCode"] =
+          value.reportName + "[" + value.reportCode + "]";
+      });
+      this.totalCount = res.data.total;
+      this.totalPage = res.data.pages;
+      this.listLoading = false;
     },
 
     handleAvatarSuccess(res) {
-      this.dialogForm.reportImage = res.data.urlPath
+      this.dialogForm.reportImage = res.data.urlPath;
     },
     beforeAvatarUpload(file) {
-      const isJPG = file.type === 'image/jpeg';
+      const isJPG = file.type === "image/jpeg";
       const isLt2M = file.size / 1024 / 1024 < 2;
       return true;
     },
 
     // 打开模态框
-    showAddReportModel (val) {
-      this.basicDialog = true
+    showAddReportModel(val) {
+      this.basicDialog = true;
       if (val === undefined) {
-        this.reportCodeDisable = false
+        this.reportCodeDisable = false;
         this.dialogForm = {
-          reportName: '',
-          reportCode: '',
+          reportName: "",
+          reportCode: "",
           // reportType: '',
-          reportDesc: '',
-          reportImage: ''
-        }
+          reportDesc: "",
+          reportImage: ""
+        };
       } else {
-        this.dialogForm = val
-        this.reportCodeDisable = true
+        this.dialogForm = val;
+        this.reportCodeDisable = true;
       }
     },
     // 预览
-    preview (val) {
-      var routeUrl = this.$router.resolve({ path: '/bigscreen/viewer', query: { reportCode: val.reportCode } })
-      window.open(routeUrl.href, '_blank')
+    preview(val) {
+      var routeUrl = this.$router.resolve({
+        path: "/bigscreen/viewer",
+        query: { reportCode: val.reportCode }
+      });
+      window.open(routeUrl.href, "_blank");
       // }
     },
     // 设计
-    design (val) {
-      var routeUrl = this.$router.resolve({ path: '/bigscreen/designer', query: { reportCode: val.reportCode, reportId: val.id, accessKey: val.accessKey } })
-      window.open(routeUrl.href, '_blank')
+    design(val) {
+      var routeUrl = this.$router.resolve({
+        path: "/bigscreen/designer",
+        query: {
+          reportCode: val.reportCode,
+          reportId: val.id,
+          accessKey: val.accessKey
+        }
+      });
+      window.open(routeUrl.href, "_blank");
       // }
     },
     // 删除
-    async delReport (val) {
-      const { code } = await delReport(val)
-      if (code != '200') return
-      this.queryByPage()
+    async delReport(val) {
+      const { code } = await delReport(val);
+      if (code != "200") return;
+      this.queryByPage();
     },
-    del (val) {
-      this.$confirm('确定删除此条数据, 是否继续?', '删除', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning',
+    del(val) {
+      this.$confirm("确定删除此条数据, 是否继续?", "删除", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       })
         .then(() => {
-          this.delReport(val)
+          this.delReport(val);
         })
         .catch(() => {
           this.$message({
-            type: 'info',
-            message: '取消删除',
-          })
-        })
+            type: "info",
+            message: "取消删除"
+          });
+        });
     },
     // 关闭模态框
-    closeDialog (bool) {
-      bool && this.search('form') // 点确定关闭弹窗的时候才会刷新列表
-      this.$refs['userForm'].resetFields()
-      this.basicDialog = false
+    closeDialog(bool) {
+      bool && this.search("form"); // 点确定关闭弹窗的时候才会刷新列表
+      this.$refs["userForm"].resetFields();
+      this.basicDialog = false;
     },
-    handleSizeChange (val) {
-      this.params.pageSize = val
-      this.queryByPage()
+    handleSizeChange(val) {
+      this.params.pageSize = val;
+      this.queryByPage();
     },
-    handleCurrentChange (val) {
-      this.params.pageNumber = val
-      this.queryByPage()
+    handleCurrentChange(val) {
+      this.params.pageNumber = val;
+      this.queryByPage();
     },
     // 提交
-    UserConfirm () {
-      debugger
+    UserConfirm() {
+      debugger;
       this.$refs.form.validate(async (valid, obj) => {
         if (valid) {
           if (this.dialogForm.id == undefined) {
-            const { code } = await addReport(this.dialogForm)
-            if (code != '200') return
+            const { code } = await addReport(this.dialogForm);
+            if (code != "200") return;
           } else {
-            const { code } = await editReport(this.dialogForm)
-            if (code != '200') return
+            const { code } = await editReport(this.dialogForm);
+            if (code != "200") return;
           }
-          this.closeDialog(true)
+          this.closeDialog(true);
         } else {
-          return
+          return;
         }
-      })
-    },
-  },
-}
+      });
+    }
+  }
+};
 </script>
 
 <style>
@@ -434,7 +436,7 @@ export default {
   overflow: hidden;
 }
 .avatar-uploader .el-upload:hover {
-  border-color: #409EFF;
+  border-color: #409eff;
 }
 .avatar-uploader-icon {
   font-size: 28px;
@@ -449,4 +451,7 @@ export default {
   height: 30%;
   display: block;
 }
+.query {
+  margin-top: 5px;
+}
 </style>

+ 4 - 1
report-ui/src/views/report/resultset/index.vue

@@ -41,7 +41,7 @@
                 :sm="20"
                 :md="4"
                 :lg="4"
-                :xl="4">
+                :xl="4" class="query">
           <el-button type="primary"
                      size="mini"
                      @click="search('form')">查询</el-button>
@@ -1089,4 +1089,7 @@ export default {
   overflow-y: auto;
   padding: 10px;
 }
+.query{
+  margin-top: 5px;
+}
 </style>