diff --git a/src/api/coorBusiness/process.js b/src/api/coorBusiness/process.js
index 4cdabe2..44b5db5 100644
--- a/src/api/coorBusiness/process.js
+++ b/src/api/coorBusiness/process.js
@@ -28,3 +28,12 @@
     params
   })
 }
+
+export function cancelTask(params) {
+  console.log(params)
+  return request({
+    url: '/process/cancelTask',
+    method: 'get',
+    params
+  })
+}

diff --git a/src/api/coorBusiness/process.js b/src/api/coorBusiness/process.js
index 4cdabe2..44b5db5 100644
--- a/src/api/coorBusiness/process.js
+++ b/src/api/coorBusiness/process.js
@@ -28,3 +28,12 @@
     params
   })
 }
+
+export function cancelTask(params) {
+  console.log(params)
+  return request({
+    url: '/process/cancelTask',
+    method: 'get',
+    params
+  })
+}
diff --git a/src/components/CaseCommon/caseList.vue b/src/components/CaseCommon/caseList.vue
index c574dcd..6706961 100644
--- a/src/components/CaseCommon/caseList.vue
+++ b/src/components/CaseCommon/caseList.vue
@@ -6,6 +6,7 @@
     <template slot="columns">
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
+          <el-button v-if="showCancel && couldCancel(scope.row)" type="text" size="small" @click.stop="cancel(scope.row)">撤销申请</el-button>
           <el-button type="text" size="small" @click.stop="showDetail(scope.row)">详情</el-button>
         </template>
       </el-table-column>
@@ -74,6 +75,10 @@
     showExport: {
       type: Boolean,
       default: false
+    },
+    showCancel: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -81,7 +86,6 @@
     }
   },
   methods: {
-
     indexMethod(index) {
       return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
     },
@@ -120,6 +124,19 @@
     },
     exportTalbe() {
       this.$emit('exportTalbe', this.listQuery)
+    },
+    cancel(row) {
+      this.$emit('cancel', row)
+    },
+    couldCancel(row) {
+      const currUser = this.$store.getters.userId
+      if ((row.preState === 30) &&
+        (row.caseState === 302 || row.caseState === 303 || row.caseState === 304) &&
+        (row.preOperator === currUser)) {
+        return true
+      } else {
+        return false
+      }
     }
   }
 }

diff --git a/src/api/coorBusiness/process.js b/src/api/coorBusiness/process.js
index 4cdabe2..44b5db5 100644
--- a/src/api/coorBusiness/process.js
+++ b/src/api/coorBusiness/process.js
@@ -28,3 +28,12 @@
     params
   })
 }
+
+export function cancelTask(params) {
+  console.log(params)
+  return request({
+    url: '/process/cancelTask',
+    method: 'get',
+    params
+  })
+}
diff --git a/src/components/CaseCommon/caseList.vue b/src/components/CaseCommon/caseList.vue
index c574dcd..6706961 100644
--- a/src/components/CaseCommon/caseList.vue
+++ b/src/components/CaseCommon/caseList.vue
@@ -6,6 +6,7 @@
     <template slot="columns">
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
+          <el-button v-if="showCancel && couldCancel(scope.row)" type="text" size="small" @click.stop="cancel(scope.row)">撤销申请</el-button>
           <el-button type="text" size="small" @click.stop="showDetail(scope.row)">详情</el-button>
         </template>
       </el-table-column>
@@ -74,6 +75,10 @@
     showExport: {
       type: Boolean,
       default: false
+    },
+    showCancel: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -81,7 +86,6 @@
     }
   },
   methods: {
-
     indexMethod(index) {
       return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
     },
@@ -120,6 +124,19 @@
     },
     exportTalbe() {
       this.$emit('exportTalbe', this.listQuery)
+    },
+    cancel(row) {
+      this.$emit('cancel', row)
+    },
+    couldCancel(row) {
+      const currUser = this.$store.getters.userId
+      if ((row.preState === 30) &&
+        (row.caseState === 302 || row.caseState === 303 || row.caseState === 304) &&
+        (row.preOperator === currUser)) {
+        return true
+      } else {
+        return false
+      }
     }
   }
 }
diff --git a/src/store/getters.js b/src/store/getters.js
index d4657bb..57e8aac 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -10,6 +10,7 @@
   changeFlag: state => state.app.changeFlag, // 切换子系统标志
   token: state => state.user.token, // token
   name: state => state.user.name, // 姓名
+  userId: state => state.user.id, // id
   roleList: state => state.user.roleList, // 角色列表
   roleNames: state => state.user.roleNames, // 角色名称列表
   roleTips: state => state.user.roleTips, // 角色名称列表

diff --git a/src/api/coorBusiness/process.js b/src/api/coorBusiness/process.js
index 4cdabe2..44b5db5 100644
--- a/src/api/coorBusiness/process.js
+++ b/src/api/coorBusiness/process.js
@@ -28,3 +28,12 @@
     params
   })
 }
+
+export function cancelTask(params) {
+  console.log(params)
+  return request({
+    url: '/process/cancelTask',
+    method: 'get',
+    params
+  })
+}
diff --git a/src/components/CaseCommon/caseList.vue b/src/components/CaseCommon/caseList.vue
index c574dcd..6706961 100644
--- a/src/components/CaseCommon/caseList.vue
+++ b/src/components/CaseCommon/caseList.vue
@@ -6,6 +6,7 @@
     <template slot="columns">
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
+          <el-button v-if="showCancel && couldCancel(scope.row)" type="text" size="small" @click.stop="cancel(scope.row)">撤销申请</el-button>
           <el-button type="text" size="small" @click.stop="showDetail(scope.row)">详情</el-button>
         </template>
       </el-table-column>
@@ -74,6 +75,10 @@
     showExport: {
       type: Boolean,
       default: false
+    },
+    showCancel: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -81,7 +86,6 @@
     }
   },
   methods: {
-
     indexMethod(index) {
       return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
     },
@@ -120,6 +124,19 @@
     },
     exportTalbe() {
       this.$emit('exportTalbe', this.listQuery)
+    },
+    cancel(row) {
+      this.$emit('cancel', row)
+    },
+    couldCancel(row) {
+      const currUser = this.$store.getters.userId
+      if ((row.preState === 30) &&
+        (row.caseState === 302 || row.caseState === 303 || row.caseState === 304) &&
+        (row.preOperator === currUser)) {
+        return true
+      } else {
+        return false
+      }
     }
   }
 }
diff --git a/src/store/getters.js b/src/store/getters.js
index d4657bb..57e8aac 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -10,6 +10,7 @@
   changeFlag: state => state.app.changeFlag, // 切换子系统标志
   token: state => state.user.token, // token
   name: state => state.user.name, // 姓名
+  userId: state => state.user.id, // id
   roleList: state => state.user.roleList, // 角色列表
   roleNames: state => state.user.roleNames, // 角色名称列表
   roleTips: state => state.user.roleTips, // 角色名称列表
diff --git a/src/store/modules/user.js b/src/store/modules/user.js
index c0583db..40aea91 100644
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -4,6 +4,7 @@
 const user = {
   state: {
     token: getToken(),
+    id: '', // userId
     name: '', // 姓名
     deptId: '', // 部门编号
     deptName: '', // 部门名称
@@ -19,6 +20,9 @@
     SET_TOKEN: (state, token) => {
       state.token = token
     },
+    SET_ID: (state, id) => {
+      state.id = id
+    },
     SET_NAME: (state, name) => {
       state.name = name
     },
@@ -101,6 +105,7 @@
             reject('该用户无组织机构')
           }
           commit('SET_NAME', data.name)
+          commit('SET_ID', data.id)
           resolve(response)
         }).catch(error => {
           reject(error)

diff --git a/src/api/coorBusiness/process.js b/src/api/coorBusiness/process.js
index 4cdabe2..44b5db5 100644
--- a/src/api/coorBusiness/process.js
+++ b/src/api/coorBusiness/process.js
@@ -28,3 +28,12 @@
     params
   })
 }
+
+export function cancelTask(params) {
+  console.log(params)
+  return request({
+    url: '/process/cancelTask',
+    method: 'get',
+    params
+  })
+}
diff --git a/src/components/CaseCommon/caseList.vue b/src/components/CaseCommon/caseList.vue
index c574dcd..6706961 100644
--- a/src/components/CaseCommon/caseList.vue
+++ b/src/components/CaseCommon/caseList.vue
@@ -6,6 +6,7 @@
     <template slot="columns">
       <el-table-column label="操作" align="center">
         <template slot-scope="scope">
+          <el-button v-if="showCancel && couldCancel(scope.row)" type="text" size="small" @click.stop="cancel(scope.row)">撤销申请</el-button>
           <el-button type="text" size="small" @click.stop="showDetail(scope.row)">详情</el-button>
         </template>
       </el-table-column>
@@ -74,6 +75,10 @@
     showExport: {
       type: Boolean,
       default: false
+    },
+    showCancel: {
+      type: Boolean,
+      default: false
     }
   },
   data() {
@@ -81,7 +86,6 @@
     }
   },
   methods: {
-
     indexMethod(index) {
       return this.listQuery.limit * (this.listQuery.offset - 1) + index + 1
     },
@@ -120,6 +124,19 @@
     },
     exportTalbe() {
       this.$emit('exportTalbe', this.listQuery)
+    },
+    cancel(row) {
+      this.$emit('cancel', row)
+    },
+    couldCancel(row) {
+      const currUser = this.$store.getters.userId
+      if ((row.preState === 30) &&
+        (row.caseState === 302 || row.caseState === 303 || row.caseState === 304) &&
+        (row.preOperator === currUser)) {
+        return true
+      } else {
+        return false
+      }
     }
   }
 }
diff --git a/src/store/getters.js b/src/store/getters.js
index d4657bb..57e8aac 100644
--- a/src/store/getters.js
+++ b/src/store/getters.js
@@ -10,6 +10,7 @@
   changeFlag: state => state.app.changeFlag, // 切换子系统标志
   token: state => state.user.token, // token
   name: state => state.user.name, // 姓名
+  userId: state => state.user.id, // id
   roleList: state => state.user.roleList, // 角色列表
   roleNames: state => state.user.roleNames, // 角色名称列表
   roleTips: state => state.user.roleTips, // 角色名称列表
diff --git a/src/store/modules/user.js b/src/store/modules/user.js
index c0583db..40aea91 100644
--- a/src/store/modules/user.js
+++ b/src/store/modules/user.js
@@ -4,6 +4,7 @@
 const user = {
   state: {
     token: getToken(),
+    id: '', // userId
     name: '', // 姓名
     deptId: '', // 部门编号
     deptName: '', // 部门名称
@@ -19,6 +20,9 @@
     SET_TOKEN: (state, token) => {
       state.token = token
     },
+    SET_ID: (state, id) => {
+      state.id = id
+    },
     SET_NAME: (state, name) => {
       state.name = name
     },
@@ -101,6 +105,7 @@
             reject('该用户无组织机构')
           }
           commit('SET_NAME', data.name)
+          commit('SET_ID', data.id)
           resolve(response)
         }).catch(error => {
           reject(error)
diff --git a/src/views/coorBusiness/completed/index.vue b/src/views/coorBusiness/completed/index.vue
index 87cd9a1..cd3198c 100644
--- a/src/views/coorBusiness/completed/index.vue
+++ b/src/views/coorBusiness/completed/index.vue
@@ -7,8 +7,10 @@
       :total="total"
       :list-query="listQuery"
       :table-columns="tableColumns"
+      show-cancel
       @changeQuery="changeQuery"
-      @addDetail="addDetail"/>
+      @addDetail="addDetail"
+      @cancel="cancel"/>
   </app-container>
 </template>
 
@@ -16,6 +18,7 @@
 import CaseList from '@/components/CaseCommon/caseList'
 import SearchForm from '@/components/CaseCommon/searchForm'
 import { completedListPage } from '@/api/coorBusiness/case'
+import { cancelTask } from '@/api/coorBusiness/process'
 
 export default {
   name: 'Index',
@@ -92,8 +95,25 @@
           showNeedVisit: true
         }
       })
+    },
+    cancel(row) {
+      this.$confirm('确定撤销申请吗?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        // 确定
+        const cancelForm = {
+          'bizId': row.id,
+          'processId': row.processId,
+          'caseState': row.caseState
+        }
+        cancelTask(cancelForm).then(res => {
+          this.$message.success('请求成功')
+          this.fetchData()
+        })
+      })
     }
   }
-
 }
 </script>