|
|
@@ -1,34 +1,34 @@
|
|
|
<template>
|
|
|
<div class="hc-layout-box">
|
|
|
- <HcNewCard :scrollbar="false" action-size="lg">
|
|
|
+ <hc-new-card :scrollbar="false" action-size="lg">
|
|
|
<template #header>
|
|
|
- <HcTooltip keys="tasks_flow_add">
|
|
|
+ <hc-tooltip keys="tasks_flow_add">
|
|
|
<el-button hc-btn type="primary" @click="addFlowData">
|
|
|
- <HcIcon name="add-circle" />
|
|
|
+ <hc-icon name="add-circle" />
|
|
|
<span>新建流程</span>
|
|
|
</el-button>
|
|
|
- </HcTooltip>
|
|
|
+ </hc-tooltip>
|
|
|
+ <hc-tooltip keys="tasks_flow_add">
|
|
|
+ <el-button hc-btn type="warning" @click="tableSortClick">排序</el-button>
|
|
|
+ </hc-tooltip>
|
|
|
</template>
|
|
|
<template #extra>
|
|
|
- <el-alert
|
|
|
- :closable="false"
|
|
|
- title="同一合同段内，只需要设置重复岗位的流程即可，其他任务岗位，系统将自动推送，无需创建更多任务流" type="error"
|
|
|
- />
|
|
|
+ <el-alert :closable="false" title="同一合同段内，只需要设置重复岗位的流程即可，其他任务岗位，系统将自动推送，无需创建更多任务流" type="error" />
|
|
|
</template>
|
|
|
- <HcTable :column="tableListColumn" :datas="tableListData" :loading="tableLoading" is-new :index-style="{ width: 60 }">
|
|
|
+ <hc-table :column="tableListColumn" :datas="tableListData" :loading="tableLoading" is-new :index-style="{ width: 60 }">
|
|
|
<template #action="{ row }">
|
|
|
- <HcTooltip keys="tasks_flow_edit">
|
|
|
+ <hc-tooltip keys="tasks_flow_edit">
|
|
|
<el-button plain size="small" type="primary" @click="handleTableEdit(row)">编辑</el-button>
|
|
|
- </HcTooltip>
|
|
|
- <HcTooltip keys="tasks_flow_del">
|
|
|
+ </hc-tooltip>
|
|
|
+ <hc-tooltip keys="tasks_flow_del">
|
|
|
<el-button v-del-com:[handleTableDel]="row" plain size="small" type="danger">删除</el-button>
|
|
|
- </HcTooltip>
|
|
|
+ </hc-tooltip>
|
|
|
</template>
|
|
|
- </HcTable>
|
|
|
+ </hc-table>
|
|
|
<template #action>
|
|
|
- <HcPages :pages="searchForm" @change="pageChange" />
|
|
|
+ <hc-pages :pages="searchForm" @change="pageChange" />
|
|
|
</template>
|
|
|
- </HcNewCard>
|
|
|
+ </hc-new-card>
|
|
|
<!-- 新增/编辑流程 弹框 -->
|
|
|
<hc-new-dialog v-model="showEditModal" :title="`${flowFormData.id ? '编辑' : '新增'}流程`" widths="47rem">
|
|
|
<el-form ref="formFlowRef" :model="flowFormData" :rules="formFlowRules" label-width="auto" size="large">
|
|
|
@@ -36,7 +36,7 @@
|
|
|
<el-input v-model="flowFormData.fixedFlowName" placeholder="请输入流程名称" />
|
|
|
</el-form-item>
|
|
|
<el-form-item label="任务人" prop="linkUserJoinString">
|
|
|
- <HcTasksUser
|
|
|
+ <hc-tasks-user
|
|
|
:contract-id="contractId" :project-id="projectId" :users="flowFormData.linkUserJoinString"
|
|
|
ui="w-full" @change="tasksUserChange"
|
|
|
/>
|
|
|
@@ -49,11 +49,44 @@
|
|
|
</div>
|
|
|
</template>
|
|
|
</hc-new-dialog>
|
|
|
+
|
|
|
+ <!-- 排序 -->
|
|
|
+ <hc-new-dialog v-model="sortModal" title="调整排序" widths="80vw" is-table is-footer-center @close="sortModalClose">
|
|
|
+ <el-alert title="可拖动排序，也可在后面点击图标，切换排序" type="error" :closable="false" />
|
|
|
+ <div class="hc-table-h">
|
|
|
+ <hc-table
|
|
|
+ ui="hc-table-row-drop" :column="sortTableColumn" :datas="sortTableData" :loading="sortTableLoading"
|
|
|
+ is-row-drop quick-sort is-new :index-style="{ width: 80 }" @row-drop="sortTableRowDrop" @row-sort="sortTableRowDrop"
|
|
|
+ >
|
|
|
+ <template #key2="{ row }">
|
|
|
+ <span class="text-link">{{ row?.key2 }}</span>
|
|
|
+ </template>
|
|
|
+ <template #action="{ index }">
|
|
|
+ <span class="text-link text-xl" @click="upSortClick(index)">
|
|
|
+ <hc-icon name="arrow-up" fill />
|
|
|
+ </span>
|
|
|
+ <span class="text-link text-xl ml-2" @click="downSortClick(index)">
|
|
|
+ <hc-icon name="arrow-down" fill />
|
|
|
+ </span>
|
|
|
+ </template>
|
|
|
+ </hc-table>
|
|
|
+ </div>
|
|
|
+ <template #footer>
|
|
|
+ <el-button hc-btn @click="sortModalClose">
|
|
|
+ <hc-icon name="close" />
|
|
|
+ <span>取消</span>
|
|
|
+ </el-button>
|
|
|
+ <el-button type="primary" hc-btn :loading="sortModalLoading" @click="sortModalSave">
|
|
|
+ <hc-icon name="check" />
|
|
|
+ <span>确认</span>
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </hc-new-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { onMounted, ref } from 'vue'
|
|
|
+import { nextTick, onMounted, ref } from 'vue'
|
|
|
import { useAppStore } from '~src/store'
|
|
|
import { getArrValue, getObjValue } from 'js-fast-way'
|
|
|
import tasksFlowApi from '~api/tasks/flow'
|
|
|
@@ -216,6 +249,84 @@ const removeFixedFlowData = async (row) => {
|
|
|
getTableData()
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+//表格排序
|
|
|
+const sortModal = ref(false)
|
|
|
+//显示
|
|
|
+const tableSortClick = () => {
|
|
|
+ sortModal.value = true
|
|
|
+ getSortTableData()
|
|
|
+}
|
|
|
+
|
|
|
+//表格数据
|
|
|
+const sortTableColumn = ref([
|
|
|
+ { key: 'fixedFlowName', name: '流程名称' },
|
|
|
+ { key: 'linkUserJoinString', name: '流程详情' },
|
|
|
+ { key:'action', name: '排序', width: 90 },
|
|
|
+])
|
|
|
+const sortTableData = ref([])
|
|
|
+
|
|
|
+//获取数据
|
|
|
+const sortTableLoading = ref(false)
|
|
|
+const getSortTableData = async () => {
|
|
|
+ sortTableLoading.value = true
|
|
|
+ const { error, code, data } = await tasksFlowApi.getPageData({
|
|
|
+ projectId: projectId.value,
|
|
|
+ contractId: contractId.value,
|
|
|
+ current: 1,
|
|
|
+ size: 9999,
|
|
|
+ })
|
|
|
+ //处理数据
|
|
|
+ sortTableLoading.value = false
|
|
|
+ if (!error && code === 200) {
|
|
|
+ sortTableData.value = getArrValue(data['records'])
|
|
|
+ } else {
|
|
|
+ sortTableData.value = []
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//拖动完成
|
|
|
+const sortTableRowDrop = (rows) => {
|
|
|
+ sortTableData.value = [] // 先清空，否则排序会异常
|
|
|
+ nextTick(() => {
|
|
|
+ sortTableData.value = rows
|
|
|
+ })
|
|
|
+}
|
|
|
+
|
|
|
+//向下
|
|
|
+const downSortClick = (index) => {
|
|
|
+ const indexs = index + 1
|
|
|
+ const data = sortTableData.value
|
|
|
+ if (indexs !== data.length) {
|
|
|
+ const tmp = data.splice(indexs, 1)
|
|
|
+ sortTableData.value.splice(index, 0, tmp[0])
|
|
|
+ } else {
|
|
|
+ window?.$message?.warning('已经处于置底，无法下移')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//向上
|
|
|
+const upSortClick = (index) => {
|
|
|
+ const data = sortTableData.value || []
|
|
|
+ if (index !== 0) {
|
|
|
+ const tmp = data.splice(index - 1, 1)
|
|
|
+ sortTableData.value.splice(index, 0, tmp[0])
|
|
|
+ } else {
|
|
|
+ window?.$message?.warning('已经处于置顶，无法上移')
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+//保存
|
|
|
+const sortModalLoading = ref(false)
|
|
|
+const sortModalSave = async () => {
|
|
|
+ console.log(sortTableData.value)
|
|
|
+ sortModal.value = false
|
|
|
+}
|
|
|
+
|
|
|
+//关闭
|
|
|
+const sortModalClose = () => {
|
|
|
+ sortModal.value = false
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
