Prechádzať zdrojové kódy

feat:联合查询前后端解析逻辑(下拉框)

韩帛霖 1 rok pred
rodič
commit
04fff7128c

+ 16 - 9
zkqy-business/src/main/java/com/zkqy/business/service/impl/DragTableServiceImpl.java

@@ -10,6 +10,7 @@ import com.zkqy.execution.produce.dispersed.mapper.CommonMapper;
 import com.zkqy.execution.produce.dispersed.mapper.TableSqlMapper;
 import org.springframework.beans.factory.annotation.Autowired;
 import org.springframework.stereotype.Service;
+
 import javax.annotation.Resource;
 import java.util.*;
 import java.util.stream.Collectors;
@@ -73,6 +74,7 @@ public class DragTableServiceImpl implements IDragTableService {
 
     /**
      * 查询表格个数
+     *
      * @param dragTable
      * @return
      */
@@ -82,10 +84,9 @@ public class DragTableServiceImpl implements IDragTableService {
     }
 
 
-
-
     /**
      * 根据tableKey查询动态表格
+     *
      * @param tableKey 唯一标识
      * @return
      */
@@ -107,6 +108,9 @@ public class DragTableServiceImpl implements IDragTableService {
                 d.setDropDownList(commonMapper.selectDropDownListByDict(d.getConditionTableName()));
             } else if (d.getConditionDatasource() != null && d.getConditionDatasource().equals("1")) {
                 d.setDropDownList(commonMapper.selectDropDownList(d.getConditionTableName(), d.getConditionTableFieldKey(), d.getConditionTableFieldName(), new HashMap<>()));
+            } else if (d.getConditionDatasource() != null) {
+                // 新逻辑直接执行sql语句
+                d.setDropDownList(commonMapper.executeMysql(d.getConditionDatasource()));
             }
         });
         resultMap.put("where", dragTableConditions);
@@ -116,28 +120,28 @@ public class DragTableServiceImpl implements IDragTableService {
         DragTableStyle dragTableStyle = new DragTableStyle();
         dragTableStyle.setTableKey(dragTable.getTableKey());
         List<DragTableStyle> dragTableStyleList = dragTableStyleMapper.selectDragTableStyleList(dragTableStyle);
-        resultMap.put("style",dragTableStyleList);
+        resultMap.put("style", dragTableStyleList);
         CommonEntity commonEntity = new CommonEntity();
         // 动态表格按钮信息
         //根据tableKey获取根节点信息
         List<String> btnKeys = dragTableBtnRelevanceMapper.selectBtnKeyByTableKey(dragTable.getTableKey());
-        List<String> newBtnKeys=new ArrayList<>();
+        List<String> newBtnKeys = new ArrayList<>();
         btnKeys.forEach(btnKey -> {
             newBtnKeys.add(btnKey.trim());
         });
         //获取根节点数据
-        if(btnKeys.size() > 0){
+        if (btnKeys.size() > 0) {
             List<DragTableBtn> rootNodes = dragTableBtnMapper.selectDragTableBtnListByBtnKey(newBtnKeys);
             //查询子节点
             List<Long> ids = rootNodes.stream().map(m -> m.getId()).collect(Collectors.toList());
-            if (ids.isEmpty()){
-                resultMap.put("button",rootNodes);
-            }else {
+            if (ids.isEmpty()) {
+                resultMap.put("button", rootNodes);
+            } else {
                 List<DragTableBtn> childNodes = dragTableBtnMapper.selectChildNodeById(ids);
                 List<DragTableBtn> btnList = rootNodes.stream().peek(
                         root -> root.setChildren(getChildrenList(root, childNodes))
                 ).collect(Collectors.toList());
-                resultMap.put("button",btnList);
+                resultMap.put("button", btnList);
             }
         }
         commonEntity.setResultMap(resultMap);
@@ -146,6 +150,7 @@ public class DragTableServiceImpl implements IDragTableService {
 
     /**
      * 获取动态表格详情
+     *
      * @param tId
      * @return
      */
@@ -170,6 +175,7 @@ public class DragTableServiceImpl implements IDragTableService {
 
     /**
      * 根据tableKey获取sqlKey
+     *
      * @param tableKey
      * @return
      */
@@ -186,6 +192,7 @@ public class DragTableServiceImpl implements IDragTableService {
 
     /**
      * 表格按钮过滤子级
+     *
      * @param root
      * @param childNodes
      * @return

+ 27 - 10
zkqy-process-execution/src/main/java/com/zkqy/execution/produce/dispersed/mapper/CommonMapper.java

@@ -20,14 +20,16 @@ public interface CommonMapper {
 
     /**
      * 查询列表
+     *
      * @param tableName
      * @param conditions
      * @return
      */
-    List<Map<String,Object>> selectListMap(@Param("tableName") String tableName, @Param("conditions") Map<String, Object> conditions);
+    List<Map<String, Object>> selectListMap(@Param("tableName") String tableName, @Param("conditions") Map<String, Object> conditions);
 
     /**
      * 获取详情数据
+     *
      * @param tableName
      * @param conditions
      * @return
@@ -49,29 +51,33 @@ public interface CommonMapper {
      * 修改
      */
     int edit(@Param("fields") Map<String, Object> fields, @Param("tableName") String tableName, @Param("conditions") Map<String, Object> conditions);
+
     /**
      * 执行动态sql
      *
-     * @param Sql     执行的sql
+     * @param Sql 执行的sql
      * @return
      */
     List<CommonEntity> queryTableList(String Sql);
 
-    /** 表
+    /**
+     * 表
      * 查询下拉框列表
      */
-    List<Map<String,Object>> selectDropDownList(@Param("tableName")String tableName,@Param("fieldKey") String fieldKey,@Param("fieldName") String fieldName, @Param("conditions") Map<String, Object> conditions);
+    List<Map<String, Object>> selectDropDownList(@Param("tableName") String tableName, @Param("fieldKey") String fieldKey, @Param("fieldName") String fieldName, @Param("conditions") Map<String, Object> conditions);
 
-    List<Map<String,Object>> selectDropDownListNotWhere(@Param("tableName")String tableName);
+    List<Map<String, Object>> selectDropDownListNotWhere(@Param("tableName") String tableName);
 
 
-    /** 字典
+    /**
+     * 字典
      * 查询下拉框列表
      */
-    List<Map<String,Object>> selectDropDownListByDict(String dictType);
+    List<Map<String, Object>> selectDropDownListByDict(String dictType);
 
     /**
      * 查询模板库建表语句
+     *
      * @param tableName 表名
      * @return
      */
@@ -79,6 +85,7 @@ public interface CommonMapper {
 
     /**
      * 执行sql
+     *
      * @param sql sql语句
      * @return
      */
@@ -87,10 +94,11 @@ public interface CommonMapper {
     /**
      * 执行sql,直接返回map形式
      */
-    List<Map<String,Object>> executeSqlSelectData(String sql);
+    List<Map<String, Object>> executeSqlSelectData(String sql);
 
     /**
      * 查询所有数据表
+     *
      * @param databaseName 数据库
      * @return
      */
@@ -103,10 +111,19 @@ public interface CommonMapper {
 
     /**
      * 查询数据
-     * @param tableName 表名
+     *
+     * @param tableName  表名
      * @param conditions key表字段 value字段值集合
      * @return
      */
-    List<Map<String,Object>> queryDropDownBoxData(@Param("tableName") String tableName, @Param("conditions") Map<String, Object> conditions);
+    List<Map<String, Object>> queryDropDownBoxData(@Param("tableName") String tableName, @Param("conditions") Map<String, Object> conditions);
+
+    /**
+     * 直接执行sql语句返回结果
+     *
+     * @param sql
+     * @return
+     */
+    List<Map<String, Object>> executeMysql(String sql);
 
 }

+ 9 - 6
zkqy-process-execution/src/main/java/com/zkqy/execution/produce/dispersed/runbpm/PreExecutionToolClass.java

@@ -140,12 +140,12 @@ public class PreExecutionToolClass<R> {
             }
             // 判断流程类型是否是审批类型
             // 审批类型默认是没有脚本的
-//            if (bpmProcess.getProcessType().equals("1")) {
-//                bpmNodeScriptRelevanceList.addAll(bpmUserScriptVo.getBpmNodeScriptRelevanceList());
-//                bpmUserScriptVoList.add(bpmUserScriptVo);
-//            } else if (bpmProcess.getProcessType().equals("0")) {
-//
-//            }
+            // if (bpmProcess.getProcessType().equals("1")) {
+            // bpmNodeScriptRelevanceList.addAll(bpmUserScriptVo.getBpmNodeScriptRelevanceList());
+            // bpmUserScriptVoList.add(bpmUserScriptVo);
+            // } else if (bpmProcess.getProcessType().equals("0")) {
+            //
+            // }
             bpmUserScriptVo.setBpmNodeScriptRelevanceList(bpmNodeScriptRelevanceMapper.selectBpmNodeScriptRelevanceList(new BpmNodeScriptRelevance(item.getNodeKey())));
             bpmNodeScriptRelevanceList.addAll(bpmUserScriptVo.getBpmNodeScriptRelevanceList());
             bpmUserScriptVoList.add(bpmUserScriptVo);
@@ -302,6 +302,7 @@ public class PreExecutionToolClass<R> {
         Map<String, String> nodeFrom = iBpmExecuteNodeFormService.selectNodeFromInfos(commonEntity.getCommMap().get("process_key").toString());
         // 得到当前表单的所有信息
         Map<String, Object> nodeFromInfoMap = this.getNodeFormInfos(nodeFrom);
+
         bpmExecuteNodeFormList.forEach(item -> {
             item.setTaskNodeFormContent(nodeFromInfoMap.get(item.getTaskNodeFormKey()).toString());
         });
@@ -751,6 +752,8 @@ public class PreExecutionToolClass<R> {
                 ((ArrayList) relationJsonMap.get("subFormList")).forEach(rtem -> {
                     ((Map) rtem).put("showTemplate", commonEntityList.stream().filter(ctem -> ctem.getResultMap().get("formKey").equals(((Map) rtem).get("formKey"))).findFirst().get().getResultMap());
                 });
+                // 添加表单组模版布局
+                relationJsonMap.put("layoutJson", dragFormGroup.getLayoutJson());
                 resultMap.put(item, relationJsonMap.toString());
             } else if (nodeForm.get(item).equals("composeForm")) { // 组合类型的表单
                 String groupTableInfo = iBpmExecuteProcessService.getGroupTableInfo(item);

+ 29 - 23
zkqy-process-execution/src/main/java/com/zkqy/execution/produce/dispersed/service/impl/CommonServiceImpl.java

@@ -332,34 +332,12 @@ public class CommonServiceImpl implements ICommonService {
         //前端传递过来的参数
         Map<String, Object> queryMap = commonEntity.getQueryMap();
         //是否存在
-//        AtomicReference<Boolean> isExist = new AtomicReference<>(true);
         //循环前端传过来的参数 跳过 sqlkey
         AtomicReference<String> replaceSql = new AtomicReference<>(tableSql.getTableCondition());
-//        queryMap.forEach((k, v) -> {
-//            if (!k.equals("sqlkey") && !k.equals("queryCriteriaValue")) { //查询第一个表的数据是不会进行任何替换的
-//                int isExistIndex = tableSql.getTableCondition().indexOf(k);
-//                replaceSql.set(tableSql.getTableCondition().replace(k, v.toString()));
-//                if (isExistIndex < 0) {
-//                    isExist.set(false);
-//                }
-//            }
-//        });
-//        //证明条件不对应不能让他进行查询
-//        if (!isExist.get()) {
-//            List<CommonEntity> commonEntityList = new ArrayList<>();
-//            CommonEntity common = new CommonEntity();
-//            HashMap<String, Object> hashMap = new HashMap();
-//            hashMap.put("err", "查询条件不匹配查询失败");
-//            common.setResultMap(hashMap);
-//            commonEntityList.add(common);
-//            return commonEntityList;
-//        }
-
         Map<String, Object> conditions = JSONObject.parseObject(JSON.toJSONString(commonEntity.getQueryMap()));
         //正常的查询
         String queryCriteriaValue = conditions.containsKey("queryCriteriaValue") ? conditions.get("queryCriteriaValue").toString() : "";
         String endSQL = replaceSql.get().replace("#{val}", queryCriteriaValue);
-
         queryMap.remove("sqlkey");
         queryMap.remove("queryCriteriaValue");
         AtomicReference<String> equivalent = new AtomicReference<>("");
@@ -367,6 +345,12 @@ public class CommonServiceImpl implements ICommonService {
             String querySqlWhere = equivalent.get() + " and " + k + " = " + v;
             equivalent.set(querySqlWhere);
         });
+
+        // 处理时间 开始时间-结束时间
+
+        // 可能会存在多个时间范围的查询,根据查询字段名称做筛选条件
+
+
         //联动表格查询
         AtomicReference<String> stringAtomicReference = new AtomicReference<>(endSQL);
         if (endSQL.contains("#{")) {
@@ -515,4 +499,26 @@ public class CommonServiceImpl implements ICommonService {
         String sqlColumn = input.substring(startIndex + identifier.length() + 1, endIndex);
         return convertToCamelCase(sqlColumn);
     }
-}
+}
+
+/*
+network:
+  ethernets:
+    ens5f1:
+      dhcp4: no
+      addresses: [192.168.0.17/24]
+      optional: true
+      gateway4: 192.168.0.1
+      nameservers:
+        addresses: [114.114.114.114, 8.8.8.8]
+  version: 2
+  renderer: NetworkManager
+
+
+  # Let NetworkManager manage all devices on this system
+
+network:
+  version: 2
+  renderer: NetworkManager
+
+ */

+ 3 - 0
zkqy-process-execution/src/main/resources/mapper/bpm/dispersed/CommonMapper.xml

@@ -148,4 +148,7 @@
             </if>
         </where>
     </select>
+    <select id="executeMysql" resultType="map">
+        ${sql}
+    </select>
 </mapper>

+ 9 - 6
zkqy-ui/src/components/RightToolbar/index.vue

@@ -1,17 +1,19 @@
 <template>
   <div class="top-right-btn" :style="style">
     <el-row>
-      <el-tooltip class="item" effect="dark" :content="showCount ? '隐藏统计' : '显示统计'" placement="top" v-if="counts">
-        <el-button size="mini" circle icon="el-icon-data-analysis" @click="toggleCount()" />
+      <el-tooltip class="item" effect="dark" :content="showCount ? '隐藏统计' : '显示统计'" placement="top"
+                  v-if="counts">
+        <el-button size="mini" circle icon="el-icon-data-analysis" @click="toggleCount()"/>
       </el-tooltip>
-      <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '显示搜索'" placement="top" v-if="search">
-        <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()" />
+      <el-tooltip class="item" effect="dark" :content="showSearch ? '隐藏搜索' : '高级搜索'" placement="top"
+                  v-if="search">
+        <el-button size="mini" circle icon="el-icon-search" @click="toggleSearch()"/>
       </el-tooltip>
       <el-tooltip class="item" effect="dark" content="刷新" placement="top">
-        <el-button size="mini" circle icon="el-icon-refresh" @click="refresh()" />
+        <el-button size="mini" circle icon="el-icon-refresh" @click="refresh()"/>
       </el-tooltip>
       <el-tooltip class="item" effect="dark" content="显隐列" placement="top" v-if="columns">
-        <el-button size="mini" circle icon="el-icon-menu" @click="showColumn()" />
+        <el-button size="mini" circle icon="el-icon-menu" @click="showColumn()"/>
       </el-tooltip>
     </el-row>
     <el-dialog :title="title" :visible.sync="open" append-to-body>
@@ -113,6 +115,7 @@ export default {
   display: block;
   margin-left: 0px;
 }
+
 ::v-deep .el-transfer__button:first-child {
   margin-bottom: 10px;
 }

+ 82 - 64
zkqy-ui/src/views/tablelist/commonTable/queryfrom.vue

@@ -1,50 +1,30 @@
 <template>
   <div>
-    <cardcountpanel :showCount="showCount" :statisticList="statisticList" />
-    <el-form
-      :model="queryParams.queryMap"
-      ref="queryForm"
-      size="small"
-      :inline="true"
-      label-width="68px"
-      @submit.native.prevent
-      v-show="showSearch"
-      class="demo-form-inline"
-    >
+    <cardcountpanel :showCount="showCount" :statisticList="statisticList"/>
+    <el-form :model="queryParams.queryMap" ref="queryForm" size="small" :inline="true" @submit.native.prevent
+             class="demo-form-inline">
       <el-form-item label="超级查询">
-        <el-input
-          v-model="queryParams.queryMap.queryCriteriaValue"
-          placeholder="请输入"
-          @keyup.enter.native="handleQuery"
-          clearable
-        />
+        <el-input v-model="queryParams.queryMap.queryCriteriaValue" placeholder="请输入"
+                  @keyup.enter.native="handleQuery" clearable/>
       </el-form-item>
+
       <el-form-item>
-        <el-button
-          type="primary"
-          icon="el-icon-search"
-          size="mini"
-          @click="handleQuery"
-          >搜索</el-button
-        >
-        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
-          >重置</el-button
-        >
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
       </el-form-item>
 
       <!--   不加载初始数据   -->
-      <div v-if="true" class="btn-wrap">
+      <div v-show="showSearch" class="btn-wrap">
         <!--      条件循环-->
         <span v-for="(item, index) in formVals" :key="index">
           <!--      input框循环-->
           <span
             v-if="item.conditionType == 'input'"
-            style="width: 500px; height: 500px"
-          >
+            style="width: 500px; height: 500px">
             <el-form-item
               :label="item.conditionName"
-              :prop="item.conditionField"
             >
+              <!-- :label-width="calculateLabelWidth(item.conditionName)"-->
               <el-input
                 v-model="queryParams.queryMap[item.conditionField]"
                 :placeholder="
@@ -55,7 +35,6 @@
               />
             </el-form-item>
           </span>
-
           <!--      button按钮循环-->
           <span v-if="item.conditionType == 'button'">
             <el-form-item :label="item.conditionName">
@@ -69,8 +48,7 @@
                 @keyup.enter.native="btnClick"
                 @click="
                   btnClick(item.conditionField, item.conditionDefaultValue)
-                "
-              >
+                ">
                 <span>
                   <svg-icon
                     v-if="item.componentIcon"
@@ -78,37 +56,30 @@
                     slot="prefix"
                     :icon-class="item.componentIcon"
                   />{{
-                    item.conditionNotes == null ? "按钮" : item.conditionNotes
+                    item.conditionName == null ? "按钮" : item.conditionName
                   }}
                 </span>
               </el-button>
             </el-form-item>
-            <div style="clear: both" />
+            <div style="clear: both"/>
           </span>
-          <div style="clear: both" />
-
+          <div style="clear: both"/>
           <!--      select下拉框循环-->
           <span
             v-if="item.conditionType == 'select'"
-            style="width: 500px; height: 500px"
-          >
+            style="width: 500px; height: 500px">
             <el-form-item
-              :label="item.conditionName"
-              :prop="item.conditionField"
-            >
+              :label="item.conditionName">
               <el-select
                 v-model="queryParams.queryMap[item.conditionField]"
                 :placeholder="
                   item.conditionNotes == null ? '请选择' : item.conditionNotes
-                "
-                clearable
-                filterable
-              >
+                " clearable filterable>
                 <el-option
                   v-for="(i, index) in item.dropDownList"
                   :key="index"
-                  :label="i.fieldName"
-                  :value="i.fieldKey"
+                  :label="i.label"
+                  :value="i.value"
                 ></el-option>
               </el-select>
 
@@ -125,7 +96,7 @@
             v-if="item.conditionType == 'radio'"
             style="width: 500px; height: 500px"
           >
-            <el-form-item :prop="item.conditionField">
+            <el-form-item>
               <el-button
                 :type="item.componentType"
                 :icon="item.componentIcon"
@@ -138,25 +109,37 @@
           </span>
           <!--      time时间范围  -->
           <span
-            v-if="item.conditionType == 'between'"
+            v-if="item.conditionType == 'datetimerange'"
             style="width: 500px; height: 500px"
           >
             <el-form-item
               :label="item.conditionName"
-              :prop="item.conditionField"
             >
               <!--  item.componentType 使用某种组件
         year/month/date/dates/months/years week/datetime/datetimerange/ daterange/monthrange-->
-              <el-date-picker
-                v-model="queryParams.queryMap[item.conditionField]"
-                :type="item.componentType"
-                range-separator="至"
-                start-placeholder="开始日期"
-                end-placeholder="结束日期"
-                value-format="yyyy-MM-DD HH:mm:ss"
-                :default-time="['12:00:00']"
-              >
-              </el-date-picker>
+
+                                <el-date-picker
+                                  v-model="queryParams.queryMap[item.conditionField]"
+                                  :type="item.conditionType"
+                                  :picker-options="pickerOptions"
+                                  range-separator="至"
+                                  start-placeholder="开始日期"
+                                  end-placeholder="结束日期"
+                                  value-format="yyyy-MM-DD HH:mm:ss"
+                                  align="right">
+                              </el-date-picker>
+
+              <!--              <el-date-picker-->
+              <!--                v-model="queryParams.queryMap[item.conditionField]"-->
+              <!--                :type="item.componentType"-->
+              <!--                :picker-options="pickerOptions"-->
+              <!--                range-separator="至"-->
+              <!--                start-placeholder="开始日期"-->
+              <!--                end-placeholder="结束日期"-->
+              <!--                value-format="yyyy-MM-DD HH:mm:ss"-->
+              <!--                :default-time="['12:00:00']"-->
+              <!--              >-->
+              <!--              </el-date-picker>-->
             </el-form-item>
           </span>
         </span>
@@ -185,7 +168,7 @@ export default {
       type: Array,
     },
   },
-  components: { cardcountpanel },
+  components: {cardcountpanel},
   data() {
     return {
       // 时间范围临时存储
@@ -217,6 +200,33 @@ export default {
       selects: [],
       // 单选/按钮
       radios: [],
+      pickerOptions: {
+        shortcuts: [{
+          text: '最近一周',
+          onClick(picker) {
+            const end = new Date();
+            const start = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+            picker.$emit('pick', [start, end]);
+          }
+        }, {
+          text: '最近一个月',
+          onClick(picker) {
+            const end = new Date();
+            const start = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+            picker.$emit('pick', [start, end]);
+          }
+        }, {
+          text: '最近三个月',
+          onClick(picker) {
+            const end = new Date();
+            const start = new Date();
+            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+            picker.$emit('pick', [start, end]);
+          }
+        }]
+      },
       // card
     };
   },
@@ -251,6 +261,12 @@ export default {
     // console.log("statisticList", this.statisticList)
   },
   methods: {
+    // 计算form宽度-label
+    calculateLabelWidth(font) {
+      // 一个汉字为20px宽度
+      console.log("当前form中label宽度:", 20 * font.length, font);
+      return 20 * font.length;
+    },
     // radio 点击事件调用getList
     buttonClick(tem) {
       // 调用父组件中的getlist    待处理
@@ -301,6 +317,7 @@ export default {
 .pre-icon {
   margin-right: 5px;
 }
+
 .cardBox {
   display: flex;
   align-content: space-between;
@@ -346,8 +363,9 @@ export default {
     font-size: 30px;
   }
 }
+
 .btn-wrap {
   display: flex;
-  flex-direction: row-reverse;
+  //flex-direction: row-reverse;
 }
 </style>

+ 14 - 21
zkqy-ui/src/views/tablelist/components/cardCountPanel.vue

@@ -1,29 +1,17 @@
 <template>
   <div>
     <div class="cardBox" v-show="showCount">
-      <el-card
-        shadow="hover"
-        :body-style="{ padding: '20px' }"
-        class="card"
-        v-for="(item, index) in statisticList"
-        :key="index"
-      >
-        <el-tooltip
-          class="item"
-          effect="dark"
-          :content="
-            item.statisticTitle
-              ? item.statisticTitle
-              : item.statisticDescription
-          "
-          placement="top-start"
-        >
+      <el-card shadow="hover" :body-style="{ padding: '20px' }" class="card" v-for="(item, index) in statisticList"
+               :key="index">
+        <el-tooltip class="item" effect="dark"
+                    :content=" item.statisticTitle ? item.statisticTitle : item.statisticDescription"
+                    placement="top-start">
           <div class="title">
             <span class="left">{{
-              item.statisticTitle
-                ? item.statisticTitle
-                : item.statisticDescription
-            }}</span>
+                item.statisticTitle
+                  ? item.statisticTitle
+                  : item.statisticDescription
+              }}</span>
             <span class="right">{{ item.result }}</span>
           </div>
         </el-tooltip>
@@ -62,12 +50,14 @@ export default {
   align-content: flex-start; */
   display: flex;
 }
+
 .card {
   width: 100%;
   /* flex-basis: 15%; */
   margin-bottom: 10px;
   margin-right: 15px;
   max-width: 200px;
+
   .title {
     /* width:20%; */
     /* display: flex; */
@@ -88,6 +78,7 @@ export default {
       font-weight: 800;
     }
   }
+
   .description {
     width: 70%;
     font-size: 13px;
@@ -100,10 +91,12 @@ export default {
     word-break: break-all;
     float: left;
   }
+
   .type {
     float: right;
     margin-top: 10px;
   }
+
   .count {
     font-size: 30px;
   }