任务记录样式调整

dangan-ui/src/views/dangan/task/index.vue

@@ -1,29 +1,35 @@
 <template>
   <div class="app-container">
-    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="70px">
-      <el-form-item label="总数量" prop="num">
+      <el-form-item label="业务类型" prop="ywType">
-        <el-input
+        <el-select
-          v-model="queryParams.num"
+          v-model="queryParams.ywType"
-          placeholder="请输入总数量"
+          placeholder="业务类型"
           clearable
-          @keyup.enter.native="handleQuery"
+          style="width:100%"
+        >
+          <el-option
+            v-for="dict in dict.type.yw_type"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
           />
+        </el-select>
       </el-form-item>
-      <el-form-item label="成功" prop="successNum">
+      <el-form-item label="任务状态" prop="status">
-        <el-input
+        <el-select
-          v-model="queryParams.successNum"
+          v-model="queryParams.status"
-          placeholder="请输入成功"
+          placeholder="任务状态"
           clearable
-          @keyup.enter.native="handleQuery"
+          style="width:100%"
-        />
+        >
-      </el-form-item>
+          <el-option
-      <el-form-item label="失败" prop="failNum">
+            v-for="dict in dict.type.task_status"
-        <el-input
+            :key="dict.value"
-          v-model="queryParams.failNum"
+            :label="dict.label"
-          placeholder="请输入失败"
+            :value="dict.value"
-          clearable
-          @keyup.enter.native="handleQuery"
           />
+        </el-select>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@@ -32,72 +38,25 @@
     </el-form>
 
     <el-row :gutter="10" class="mb8">
-<!--      <el-col :span="1.5">
-        <el-button
-          type="primary"
-          plain
-          icon="el-icon-plus"
-          size="mini"
-          @click="handleAdd"
-          v-hasPermi="['dangan:task:add']"
-        >新增</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="success"
-          plain
-          icon="el-icon-edit"
-          size="mini"
-          :disabled="single"
-          @click="handleUpdate"
-          v-hasPermi="['dangan:task:edit']"
-        >修改</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="danger"
-          plain
-          icon="el-icon-delete"
-          size="mini"
-          :disabled="multiple"
-          @click="handleDelete"
-          v-hasPermi="['dangan:task:remove']"
-        >删除</el-button>
-      </el-col>
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['dangan:task:export']"
-        >导出</el-button>
-      </el-col>-->
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
-    <el-table v-loading="loading" :data="taskList">
+    <el-table v-loading="loading" :data="taskList" border>
-<!--      <el-table-column type="selection" width="55" align="center" />-->
+      <el-table-column label="创建人" align="center" prop="createBy"  min-width="60" show-overflow-tooltip/>
-      <el-table-column label="创建人" align="center" prop="createBy" />
+      <el-table-column label="创建时间" align="center" prop="createTime"  min-width="100" show-overflow-tooltip/>
-      <el-table-column label="创建时间" align="center" prop="createTime" />
       <el-table-column label="业务类型" align="center" prop="ywType" min-width="100" show-overflow-tooltip>
         <template slot-scope="scope">
           <dict-tag :options="dict.type.yw_type" :value="scope.row.ywType"/>
         </template>
       </el-table-column>
-      <el-table-column label="档案目录路径" align="center" prop="muPath" />
+      <el-table-column label="档案目录路径" align="center" prop="muPath" min-width="120" show-overflow-tooltip/>
       <el-table-column label="总数量" align="center" prop="num" />
 
-      <el-table-column label="任务状态" align="center" prop="status">
+      <el-table-column label="任务状态" align="center" prop="status" min-width="100" show-overflow-tooltip>
         <template slot-scope="scope">
           <dict-tag :options="dict.type.task_status" :value="scope.row.status"/>
         </template>
       </el-table-column>
-<!--      <el-table-column label="成功" align="center" prop="successNum" />
-      <el-table-column label="失败" align="center" prop="failNum" />
-      <el-table-column label="相关图片ids" align="center" prop="picIds" />
-      <el-table-column label="备注" align="center" prop="remark" />-->
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -127,43 +86,31 @@
     />
 
     <!-- 任务进度/任务详情 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body class="rwjd">
 
       <div class="rw_con">
-        <div class="num">总数量: {{ form.num }}</div>
+        <div class="num">
-        <div class="num" v-if="form.status==='1'">已识别: 10</div>
+          <span style="color:#409EFF;">总数量：{{ form.num }}</span>
-        <div class="num" v-if="form.status==='2'">成功: {{ form.successNum }}</div>
+        </div>
-        <div class="num" v-if="form.status==='2'">失败: {{ form.failNum }}</div>
+        <div class="num" v-if="form.status==='1'">
+          <span style="color:#67C23A;">已识别：10</span>
+        </div>
+        <div class="num" v-if="form.status==='2'">
+          <span style="color:#67C23A;">成功：{{ form.successNum }}</span>
+          <el-link :underline="false" type="primary" style="font-size:16px" v-if="form.successNum && form.successNum>0">成功图片</el-link>
+        </div>
+        <div class="num" v-if="form.status==='2'">
+          <span style="color:#F56C6C;">失败：{{ form.failNum }}</span>
+          <el-link :underline="false" type="primary" style="font-size:16px" v-if="form.failNum && form.failNum>0">失败图片</el-link>
         </div>
-
-      <div style="display:flex; justify-content: space-evenly;" v-if="form.status==='2'">
-        <el-link :underline="false" type="primary" style="font-size: 20px">成功图片</el-link>
-        <el-link :underline="false" type="primary" style="font-size: 20px">失败图片</el-link>
       </div>
 
-<!--      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
-        <el-form-item label="总数量" prop="num">
-          <el-input v-model="form.num" placeholder="请输入总数量" />
-        </el-form-item>
-        <el-form-item label="成功" prop="successNum">
-          <el-input v-model="form.successNum" placeholder="请输入成功" />
-        </el-form-item>
-        <el-form-item label="失败" prop="failNum">
-          <el-input v-model="form.failNum" placeholder="请输入失败" />
-        </el-form-item>
-        <el-form-item label="相关图片ids" prop="picIds">
-          <el-input v-model="form.picIds" type="textarea" placeholder="请输入内容" />
-        </el-form-item>
-        <el-form-item label="备注" prop="remark">
-          <el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
-        </el-form-item>
-      </el-form>-->
     </el-dialog>
   </div>
 </template>
 
 <script>
-  import { listTask, getTask, delTask, addTask, updateTask } from "@/api/dangan/task";
+  import { listTask } from "@/api/dangan/task";
 
   export default {
     name: "Task",
@@ -187,10 +134,7 @@
           pageNum: 1,
           pageSize: 10,
           num: null,
-          status: null,
+          status: null
-          successNum: null,
-          failNum: null,
-          picIds: null,
         },
         form: {}
       };
@@ -234,12 +178,23 @@
 </script>
 
 <style scoped lang="scss">
+.rwjd{
+
+  ::v-deep.el-dialog__body {
+    padding: 20px 20px;
+
     .rw_con{
-  padding: 0 20px;
+      padding-bottom: 40px;
-  font-size: 18px;
+      font-size: 16px;
 
       .num{
         height: 40px;
+        display: flex;
+        justify-content: space-between;
+        align-items: start;
       }
     }
+  }
+}
+
 </style>