完成审核页面-新闻管理

src/api/portal/task/task.js

@@ -1,13 +1,13 @@
 import request from '@/utils/request'
 
 // 查询审批任务实例列表
-export function listINSTACTIONTASK(query) {
-  return request({
-    url: '/actionTask/list',
-    method: 'get',
-    params: query
-  })
-}
+// export function listINSTACTIONTASK(query) {
+//   return request({
+//     url: '/actionTask/list',
+//     method: 'get',
+//     params: query
+//   })
+// }
 
 // 查询审批任务实例所有列表
 export function listAllINSTACTIONTASK(query) {
@@ -26,3 +26,40 @@ export function getINSTACTIONTASK(id) {
   })
 }
 
+// 查询用户自己的审批任务实例
+export function listINSTACTIONTASK(data) {
+  return request({
+    url: '/actionTask/list_byUser',
+    method: 'get',
+    params: data
+  })
+}
+
+// 审核通过
+export function approve(data) {
+  return request({
+    url: '/actionTask/approve',
+    method: 'post',
+    data: data
+  })
+}
+
+// 审核驳回
+export function reject(data) {
+  return request({
+    url: '/actionTask/reject',
+    method: 'post',
+    data: data
+  })
+}
+
+// 审核退回
+export function goback(data) {
+  return request({
+    url: '/actionTask/goback',
+    method: 'post',
+    data: data
+  })
+}
+
+

src/views/news/index.vue

@@ -370,7 +370,7 @@
       </div>
     </el-dialog>
 
-    <el-dialog :visible.sync="dialogVisible">
+    <el-dialog :visible.sync="dialogVisible" fullscreen append-to-body  @close="dialogVisible = false">
       <img width="100%" :src="form.picture" alt="" />
     </el-dialog>
   </div>

src/views/news/task/index.vue

@@ -0,0 +1,146 @@
+<template>
+  <div>
+    <el-tabs v-model="activeName">
+      <el-tab-pane label="详细信息" name="详细信息">
+        <el-descriptions border>
+          <el-descriptions-item label="活动名称">{{
+            taskList.acname
+          }}</el-descriptions-item>
+          <el-descriptions-item label="任务启动时间">
+            {{
+              taskList.beginTime ? taskList.beginTime.substr(0, 10) : "无"
+            }}</el-descriptions-item
+          >
+          <el-descriptions-item label="审核状态">
+            <el-tag v-if="taskList.status == 1" type="success">同意</el-tag>
+            <el-tag v-if="taskList.status == 2" type="danger">驳回</el-tag>
+            <el-tag v-if="taskList.status == 3" type="info">退回</el-tag>
+            <el-tag v-else>审核中</el-tag>
+          </el-descriptions-item>
+          <el-descriptions-item label="审核意见">{{
+            taskList.comments ? taskList.comments : "无"
+          }}</el-descriptions-item>
+        </el-descriptions>
+        <el-form
+          ref="form"
+          :model="taskList"
+          label-width="80px"
+          style="margin-top: 20px"
+        >
+          <el-form-item label="标题" prop="title">
+            <el-input
+              v-model="taskList.formobj.title"
+              placeholder="请输入标题"
+              disabled
+            ></el-input>
+          </el-form-item>
+
+          <el-form-item label="类型" prop="type">
+            <el-select
+              v-model="taskList.formobj.type"
+              placeholder="请选择"
+              disabled
+            >
+              <el-option
+                v-for="item in typeList"
+                :key="item.value + 'typeList'"
+                :label="item.label"
+                :value="item.value"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+
+          <el-form-item label="封面图" prop="picture" disabled>
+            <el-upload
+              action="#"
+              list-type="picture-card"
+              :limit="1"
+              :auto-upload="true"
+              :file-list="fileList"
+              :disabled="true"
+            >
+              <i slot="default" class="el-icon-plus"></i>
+              <div slot="file" slot-scope="{ file }">
+                <img class="el-upload-list__item-thumbnail" :src="file.url" />
+
+                <!-- 放大预览 -->
+                <span class="el-upload-list__item-actions">
+                  <span
+                    class="el-upload-list__item-preview"
+                    @click="handlePictureCardPreview(file)"
+                  >
+                    <i class="el-icon-zoom-in"></i>
+                  </span>
+                </span>
+              </div>
+            </el-upload>
+          </el-form-item>
+
+          <el-form-item label="新闻内容" prop="content">
+            <editor
+              v-model="taskList.formobj.content"
+              :min-height="192"
+              :readOnly="true"
+            />
+          </el-form-item>
+        </el-form>
+
+        <el-dialog
+          :visible="BigImgVisible"
+          fullscreen
+          append-to-body
+          @close="BigImgVisible = false"
+        >
+          <img width="100%" :src="taskList.formobj.picture" alt="" />
+        </el-dialog>
+      </el-tab-pane>
+      <el-tab-pane label="审批记录" name="审批记录">
+        <el-timeline>
+
+          <el-timeline-item v-for="(item,index) in taskList.taskHisAction" :timestamp="item.createTime" placement="top" :key="index+'taskHisAction'">
+            <el-card>
+              <p>{{item.execId}} {{item.acname}} 于 {{ item.createTime}}</p>
+            </el-card>
+          </el-timeline-item>
+
+        </el-timeline>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      activeName: "详细信息",
+      typeList: [
+        { label: "要闻咨询", value: "1" },
+        { label: "政策法规", value: "2" },
+        { label: "通知公告", value: "3" },
+        { label: "政策解读", value: "4" },
+      ],
+      fileList: [],
+      BigImgVisible: false,
+    };
+  },
+  props: {
+    taskList: Object,
+  },
+  created() {
+    if (this.taskList.formobj.picture) {
+      this.fileList.push({ name: "xxx", url: this.taskList.formobj.picture });
+    }
+  },
+  methods: {
+    handlePictureCardPreview(file) {
+      this.taskList.formobj.picture = file.url;
+      this.BigImgVisible = true;
+    },
+  },
+};
+</script>
+
+<style>
+</style>

src/views/task/index.vue

@@ -8,6 +8,12 @@
       v-show="showSearch"
       label-width="68px"
     >
+      <el-form-item label="活动名称" prop="acname">
+        <el-input
+          v-model="queryParams.acname"
+          placeholder="请输入活动名称"
+        ></el-input>
+      </el-form-item>
       <el-form-item label="审核状态" prop="status">
         <el-select
           v-model="queryParams.status"
@@ -36,141 +42,36 @@
         >
       </el-form-item>
     </el-form>
-    <!-- 
-    <el-row :gutter="10" class="mb8">
-      <el-col :span="1.5">
-        <el-button
-          type="warning"
-          plain
-          icon="el-icon-download"
-          size="mini"
-          @click="handleExport"
-          v-hasPermi="['business:INSTACTIONTASK:export']"
-        >导出</el-button>
-      </el-col>
-      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
-    </el-row> -->
 
-    <!-- <el-table
+    <el-table
       v-loading="loading"
       :data="INSTACTIONTASKList"
       @selection-change="handleSelectionChange"
     >
-      <el-table-column type="selection" width="55" align="center" />
-      <el-table-column label="${comment}" align="center" prop="id">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.id"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="创建时间" align="center" prop="createTime">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.createTime"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="创建人" align="center" prop="createBy">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.createBy"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="修改时间" align="center" prop="updateTime">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.updateTime"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="修改人" align="center" prop="updateBy">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.updateBy"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="删除标识" align="center" prop="delFlag">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.delFlag"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="活动实例任务ID" align="center" prop="instAcId">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.instAcId"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="活动实例id" align="center" prop="instProId">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.instProId"
-          />
-        </template>
-      </el-table-column>
+      <!-- <el-table-column type="selection" width="55" align="center" /> -->
       <el-table-column label="活动名称" align="center" prop="acname">
         <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.acname"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="审核人" align="center" prop="execId">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.execId"
-          />
+          {{ scope.row.acname }}
         </template>
       </el-table-column>
       <el-table-column label="任务启动时间" align="center" prop="beginTime">
         <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.beginTime"
-          />
-        </template>
-      </el-table-column>
-      <el-table-column label="任务结束时间" align="center" prop="endTime">
-        <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.endTime"
-          />
+          {{ scope.row.beginTime ? scope.row.beginTime.substr(0, 10) : "无" }}
         </template>
       </el-table-column>
-      <el-table-column
-        label="审核状态(1=同意,2=驳回）"
-        align="center"
-        prop="status"
-      >
+      <el-table-column label="审核状态" align="center" prop="status">
         <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.status"
-          />
+          <el-tag v-if="scope.row.status == '1'" type="success">同意</el-tag>
+          <el-tag v-else-if="scope.row.status == '2'" type="danger"
+            >驳回</el-tag
+          >
+          <el-tag v-else-if="scope.row.status == '3'" type="info">退回</el-tag>
+          <el-tag v-else>审核中</el-tag>
         </template>
       </el-table-column>
       <el-table-column label="审核意见" align="center" prop="comments">
         <template slot-scope="scope">
-          <dict-tag
-            :options="dict.type.${column.dictType}"
-            :value="scope.row.comments"
-          />
+          {{ scope.row.comments }}
         </template>
       </el-table-column>
       <el-table-column
@@ -180,24 +81,62 @@
       >
         <template slot-scope="scope">
           <el-button
+            v-if="scope.row.status == null"
             size="mini"
             type="text"
-            icon="el-icon-edit"
-            @click="handleUpdate(scope.row)"
-            v-hasPermi="['business:INSTACTIONTASK:edit']"
-            >修改</el-button
+            @click="handleExamine(scope.row)"
+            v-hasPermi="['business:INSTACTIONTASK:task']"
+            >审核</el-button
           >
+
           <el-button
             size="mini"
             type="text"
-            icon="el-icon-delete"
-            @click="handleDelete(scope.row)"
-            v-hasPermi="['business:INSTACTIONTASK:remove']"
-            >删除</el-button
+            @click="handleDetail(scope.row)"
+            v-hasPermi="['business:INSTACTIONTASK:detail']"
+            >详情</el-button
           >
         </template>
       </el-table-column>
-    </el-table> -->
+    </el-table>
+
+    <el-dialog :visible.sync="dialogVisible" width="80%" center>
+      <component :is="componentUrl" :taskList="taskList"></component>
+
+      <el-dialog
+        width="60%"
+        :title="subTitle + '审核'"
+        :visible.sync="innerVisible"
+        append-to-body
+        center
+        @close="qx()"
+      >
+        <el-form
+          :model="subForm"
+          :rules="subFormRules"
+          label-width="100px"
+          ref="extaskform"
+        >
+          <el-form-item label="审核意见" prop="comments">
+            <el-input
+              type="textarea"
+              v-model="subForm.comments"
+              placeholder="请输入审核意见"
+            ></el-input>
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="qx">取 消</el-button>
+          <el-button type="primary" @click="extask">确 定</el-button>
+        </div>
+      </el-dialog>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitBtn('同意')">同意</el-button>
+        <el-button type="warning" @click="submitBtn('驳回')">驳回</el-button>
+        <el-button type="danger" @click="submitBtn('退回')">退回</el-button>
+      </span>
+    </el-dialog>
 
     <pagination
       v-show="total > 0"
@@ -206,23 +145,40 @@
       :limit.sync="queryParams.pageSize"
       @pagination="getList"
     />
-
   </div>
 </template>
 
 <script>
+//导入审核页面的组件
+import newsTask from "@/views/news/task/index.vue";
+
 import {
   listINSTACTIONTASK,
   getINSTACTIONTASK,
   delINSTACTIONTASK,
   addINSTACTIONTASK,
   updateINSTACTIONTASK,
+  approve, //通过
+  reject, //驳回
+  goback, //退回
 } from "@/api/portal/task/task";
 
 export default {
   name: "INSTACTIONTASK",
   data() {
     return {
+      //审核意见对话框的form
+      subForm: {},
+      //控制显示审核意见对话框
+      innerVisible: false,
+      //点击审核那三个按钮会触发submitBtn函数然后设置这个title
+      subTitle: "",
+      //审核页面的
+      taskList: [],
+      //动态组件
+      componentUrl: newsTask,
+      //审核的dialog
+      dialogVisible: false,
       // 根路径
       baseURL: process.env.VUE_APP_BASE_API,
       // 遮罩层
@@ -264,6 +220,11 @@ export default {
       },
       // 表单参数
       form: {},
+      subFormRules: {
+        comments: [
+          { required: true, message: "意见不能为空", trigger: "blur" },
+        ],
+      },
       // 表单校验
       rules: {
         id: [{ required: true, message: "$comment不能为空", trigger: "blur" }],
@@ -314,6 +275,59 @@ export default {
     this.getList();
   },
   methods: {
+    extask() {
+      this.$refs["extaskform"].validate((valid) => {
+        if (valid) {
+          let data = {
+            comments: this.subForm.comments,
+            taskId: this.taskList.id,
+          };
+          if (this.subTitle == "同意") {
+            approve(data).then((res) => {
+              this.dialogVisible = false;
+              this.qx();
+              this.getList();
+            });
+          } else if (this.subTitle == "驳回") {
+            reject(data).then((res) => {
+              this.dialogVisible = false;
+              this.qx();
+              this.getList();
+            });
+          } else if (this.subTitle == "退回") {
+            goback(data).then((res) => {
+              this.dialogVisible = false;
+              this.qx();
+              this.getList();
+            });
+          }
+        }
+      });
+    },
+    qx() {
+      //审批意见的取消
+      this.subForm = {};
+      this.innerVisible = false;
+      // this.dialogFormVisible = false;
+    },
+    submitBtn(type) {
+      this.subTitle = type;
+      this.innerVisible = true;
+    },
+    //点击审核
+    handleExamine(row) {
+      getINSTACTIONTASK(row.id).then((res) => {
+        this.taskList = res.data;
+        this.dialogVisible = true;
+      });
+    },
+    //点击查看详细
+    handleDetail(row) {
+      getINSTACTIONTASK(row.id).then((res) => {
+        this.dialogVisible = true;
+        console.log(res);
+      });
+    },
     /** 查询审批任务实例列表 */
     getList() {
       this.loading = true;