|
@@ -3,15 +3,15 @@
|
|
<div class="search-box">
|
|
<div class="search-box">
|
|
<a-form :model="formSearch" layout="inline" :label-col="labelCol">
|
|
<a-form :model="formSearch" layout="inline" :label-col="labelCol">
|
|
<a-form-item label="流程名称:">
|
|
<a-form-item label="流程名称:">
|
|
- <a-input style="width:240px" placeholder="请输入..." v-model:value="formSearch.name" />
|
|
|
|
|
|
+ <a-input style="width:240px" placeholder="请输入..." allowClear v-model:value="formSearch.name" />
|
|
</a-form-item>
|
|
</a-form-item>
|
|
<a-form-item label="标识Key:">
|
|
<a-form-item label="标识Key:">
|
|
- <a-input style="width:240px" placeholder="请输入..." v-model:value="formSearch.key" />
|
|
|
|
|
|
+ <a-input style="width:240px" placeholder="请输入..." allowClear v-model:value="formSearch.key" />
|
|
</a-form-item>
|
|
</a-form-item>
|
|
<a-form-item label="">
|
|
<a-form-item label="">
|
|
- <a-button style="margin-right:10px" type="primary"
|
|
|
|
- preIcon="ant-design:search-outlined">查询</a-button>
|
|
|
|
- <a-button type="primary">重置</a-button>
|
|
|
|
|
|
+ <a-button style="margin-right:10px" type="primary" preIcon="ant-design:search-outlined"
|
|
|
|
+ @click="getSearch">查询</a-button>
|
|
|
|
+ <a-button type="plain" @click="reset">重置</a-button>
|
|
</a-form-item>
|
|
</a-form-item>
|
|
</a-form>
|
|
</a-form>
|
|
</div>
|
|
</div>
|
|
@@ -26,18 +26,29 @@
|
|
<a-button type="link" style="color:#3DF6FF" @click="getClick({ event: 'sp', row: record })">
|
|
<a-button type="link" style="color:#3DF6FF" @click="getClick({ event: 'sp', row: record })">
|
|
审批详情
|
|
审批详情
|
|
</a-button>
|
|
</a-button>
|
|
- <a-button type="link" style="color:#3DF6FF">
|
|
|
|
|
|
+ <a-button type="link" style="color:#3DF6FF" @click="getClick({ event: 'bd', row: record })">
|
|
表单数据
|
|
表单数据
|
|
</a-button>
|
|
</a-button>
|
|
- <a-button type="link" style="color:#3DF6FF">
|
|
|
|
- 删除
|
|
|
|
- </a-button>
|
|
|
|
|
|
+ <a-popconfirm title="是否确认删除!" ok-text="确定" cancel-text="取消"
|
|
|
|
+ @confirm="getClick({ event: 'del', row: record })">
|
|
|
|
+ <a-button type="link" style="color:#3DF6FF">
|
|
|
|
+ 删除
|
|
|
|
+ </a-button>
|
|
|
|
+ </a-popconfirm>
|
|
</template>
|
|
</template>
|
|
</a-table>
|
|
</a-table>
|
|
</div>
|
|
</div>
|
|
<!-- 审批详情弹窗 -->
|
|
<!-- 审批详情弹窗 -->
|
|
- <a-modal v-model:visible="visibleSp" width="1000px" :title="titleSp" centered destroyOnClose>
|
|
|
|
- <HistorySp :historySpList="historySpList"></HistorySp>
|
|
|
|
|
|
+ <a-modal v-model:visible="visibleSp" width="1000px" :footer="null" :title="titleSp" centered destroyOnClose>
|
|
|
|
+ <HistorySp :historySpList="historySpList"></HistorySp>
|
|
|
|
+ </a-modal>
|
|
|
|
+ <!-- 表单数据弹窗 -->
|
|
|
|
+ <a-modal v-model:visible="visibleForm" width="1000px" :footer="null" :title="titleForm" centered destroyOnClose>
|
|
|
|
+ <formSp :formSpData="formSpData"></formSp>
|
|
|
|
+ </a-modal>
|
|
|
|
+ <!-- 删除弹窗 -->
|
|
|
|
+ <a-modal v-model:visible="visibleDel" :footer="null" width="600px" :title="titleDel" centered destroyOnClose>
|
|
|
|
+ <formDel @confirmClick="confirmClick" @cancelClick="cancelClick"></formDel>
|
|
</a-modal>
|
|
</a-modal>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
@@ -45,10 +56,12 @@
|
|
<script setup lang="ts">
|
|
<script setup lang="ts">
|
|
import { ref, reactive, onMounted, createVNode } from 'vue'
|
|
import { ref, reactive, onMounted, createVNode } from 'vue'
|
|
import HistorySp from './common/HistorySp.vue'
|
|
import HistorySp from './common/HistorySp.vue'
|
|
|
|
+import formSp from './common/formSp.vue'
|
|
|
|
+import formDel from './common/formDel.vue'
|
|
import { Modal } from 'ant-design-vue';
|
|
import { Modal } from 'ant-design-vue';
|
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
|
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
|
|
import { columns } from './progressLc.data'
|
|
import { columns } from './progressLc.data'
|
|
-import { getRunningProcess,getHistoricFlow } from './progressLc.api'
|
|
|
|
|
|
+import { getRunningProcess, getHistoricFlow, getForm, getdelInsByIds } from './progressLc.api'
|
|
|
|
|
|
const labelCol = { style: { width: '80px' } };
|
|
const labelCol = { style: { width: '80px' } };
|
|
//查询参数
|
|
//查询参数
|
|
@@ -73,21 +86,37 @@ let pagination = reactive({
|
|
let visibleSp = ref(false)
|
|
let visibleSp = ref(false)
|
|
let titleSp = ref('审批历史')
|
|
let titleSp = ref('审批历史')
|
|
//审批详情历史数据
|
|
//审批详情历史数据
|
|
-let historySpList=reactive<any[]>([])
|
|
|
|
|
|
+let historySpList = reactive<any[]>([])
|
|
|
|
+
|
|
|
|
+//表单数据
|
|
|
|
+let visibleForm = ref(false)
|
|
|
|
+let titleForm = ref('')
|
|
|
|
+let formSpData = ref({})
|
|
|
|
+
|
|
|
|
+//删除流程数据
|
|
|
|
+let visibleDel = ref(false)
|
|
|
|
+let titleDel = ref('')
|
|
|
|
|
|
|
|
|
|
//审批详情-审批历史列表
|
|
//审批详情-审批历史列表
|
|
-async function getHistoricFlowList(){
|
|
|
|
- let res=await getHistoricFlow()
|
|
|
|
- console.log(res,'审批历史---------------------')
|
|
|
|
- if(res.length!=0){
|
|
|
|
- historySpList.length=0
|
|
|
|
- res.forEach(el=>{
|
|
|
|
- historySpList.push({name:el.name})
|
|
|
|
|
|
+async function getHistoricFlowList() {
|
|
|
|
+ let res = await getHistoricFlow()
|
|
|
|
+ console.log(res, '审批历史---------------------')
|
|
|
|
+ if (res.length != 0) {
|
|
|
|
+ historySpList.length = 0
|
|
|
|
+ res.forEach(el => {
|
|
|
|
+ historySpList.push({ name: el.name, username: el.assignees[0].username, deleteReason: el.deleteReason, comment: el.comment, startTime: el.startTime, endTime: el.endTime })
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+//获取审批-表单数据
|
|
|
|
+async function getFormList(param) {
|
|
|
|
+ let res = await getForm(param)
|
|
|
|
+ console.log(res, '表单数据------------')
|
|
|
|
+ formSpData.value = res
|
|
|
|
+}
|
|
|
|
+
|
|
//获取列表
|
|
//获取列表
|
|
async function getRunningProcessList() {
|
|
async function getRunningProcessList() {
|
|
let res = await getRunningProcess({ name: formSearch.name, key: formSearch.key, pageNumber: pagination.current, pageSize: pagination.pageSize })
|
|
let res = await getRunningProcess({ name: formSearch.name, key: formSearch.key, pageNumber: pagination.current, pageSize: pagination.pageSize })
|
|
@@ -101,6 +130,19 @@ async function getRunningProcessList() {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+//确认删除
|
|
|
|
+async function confirmClick(data) {
|
|
|
|
+ let res = await getdelInsByIds({ reason: data })
|
|
|
|
+ if (res.success) {
|
|
|
|
+ getRunningProcessList()
|
|
|
|
+ visibleDel.value = false
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+//取消删除
|
|
|
|
+function cancelClick() {
|
|
|
|
+ visibleDel.value = false
|
|
|
|
+}
|
|
|
|
+
|
|
//table操作
|
|
//table操作
|
|
function getClick(data) {
|
|
function getClick(data) {
|
|
console.log(data, 'data------------------')
|
|
console.log(data, 'data------------------')
|
|
@@ -114,21 +156,41 @@ function getClick(data) {
|
|
okText: '确认',
|
|
okText: '确认',
|
|
cancelText: '取消',
|
|
cancelText: '取消',
|
|
onOk: () => {
|
|
onOk: () => {
|
|
-
|
|
|
|
-
|
|
|
|
Modal.destroyAll();
|
|
Modal.destroyAll();
|
|
},
|
|
},
|
|
});
|
|
});
|
|
break;
|
|
break;
|
|
case 'sp':
|
|
case 'sp':
|
|
visibleSp.value = true
|
|
visibleSp.value = true
|
|
|
|
+ getHistoricFlowList()
|
|
|
|
+ break;
|
|
|
|
+ case 'bd':
|
|
|
|
+ visibleForm.value = true
|
|
|
|
+ titleForm.value = `查看流程业务信息${data.row.name}`
|
|
|
|
+ getFormList({ tableId: data.row.tableId, tableName: data.row.tableName })
|
|
|
|
+ break;
|
|
|
|
+ case 'del':
|
|
|
|
+ visibleDel.value = true
|
|
|
|
+ titleDel.value = `确认删除流程${data.row.name}`
|
|
break;
|
|
break;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+//查询
|
|
|
|
+function getSearch() {
|
|
|
|
+ pagination.current = 1
|
|
|
|
+ getRunningProcessList()
|
|
|
|
+}
|
|
|
|
+//重置
|
|
|
|
+function reset() {
|
|
|
|
+ formSearch.key = ''
|
|
|
|
+ formSearch.name = ''
|
|
|
|
+ pagination.current = 1
|
|
|
|
+ getRunningProcessList()
|
|
|
|
+}
|
|
|
|
+
|
|
onMounted(() => {
|
|
onMounted(() => {
|
|
getRunningProcessList()
|
|
getRunningProcessList()
|
|
- getHistoricFlowList()
|
|
|
|
})
|
|
})
|
|
</script>
|
|
</script>
|
|
|
|
|
|
@@ -153,9 +215,16 @@ onMounted(() => {
|
|
color: #fff;
|
|
color: #fff;
|
|
}
|
|
}
|
|
|
|
|
|
-:deep(.zxm-input) {
|
|
|
|
|
|
+:deep(.zxm-input-affix-wrapper) {
|
|
color: #fff;
|
|
color: #fff;
|
|
background-color: #ffffff00;
|
|
background-color: #ffffff00;
|
|
border: 1px solid #3ad8ff77 !important;
|
|
border: 1px solid #3ad8ff77 !important;
|
|
}
|
|
}
|
|
|
|
+:deep(.zxm-input){
|
|
|
|
+ color: #fff !important;
|
|
|
|
+ background-color: #ffffff00 !important;
|
|
|
|
+}
|
|
|
|
+:deep(.anticon.zxm-input-clear-icon){
|
|
|
|
+ color:#fff;
|
|
|
|
+}
|
|
</style>
|
|
</style>
|