|
@@ -1,64 +1,50 @@
|
|
<template>
|
|
<template>
|
|
- <hc-new-dialog v-model="isShow" :footer="false" is-table widths="95%" title="任务审核" @save="modalSave">
|
|
|
|
|
|
+ <hc-new-dialog v-model="isShow" :footer="false" is-table widths="96%" title="任务审核" @close="cancelClick">
|
|
<template #header="{ titleId, titleClass }">
|
|
<template #header="{ titleId, titleClass }">
|
|
<div class="hc-card-header flex items-center">
|
|
<div class="hc-card-header flex items-center">
|
|
<div :id="titleId" :class="titleClass">任务审核 【已开启电签】</div>
|
|
<div :id="titleId" :class="titleClass">任务审核 【已开启电签】</div>
|
|
- <!-- div v-if="taskReviewType === '1'" class="ml-6 font-bold text-main">
|
|
|
|
- 任务名称:{{ taskReviewInfo.taskName }}
|
|
|
|
- </div -->
|
|
|
|
</div>
|
|
</div>
|
|
</template>
|
|
</template>
|
|
- <div class="relative h-full flex">
|
|
|
|
- <div :id="`hc_pdf_card_${uuid}`">
|
|
|
|
- <hc-new-card>
|
|
|
|
- <hc-pdf :src="batchPdfUrl" />
|
|
|
|
- </hc-new-card>
|
|
|
|
- </div>
|
|
|
|
- <div :id="`hc_table_card_${uuid}`" class="flex-1">
|
|
|
|
- <hc-new-card>
|
|
|
|
- <div class="content-box">
|
|
|
|
- <div class="table-box">
|
|
|
|
- <div class="table-view">
|
|
|
|
- <hc-table :column="tableColumn" :datas="tableData" is-new :index-style="{ width: 60 }" is-current-row @row-click="tableRowClick" />
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
- <div class="radio-box">
|
|
|
|
- <span class="label">审批操作:</span>
|
|
|
|
- <el-radio-group v-model="taskReviewForm.flag">
|
|
|
|
- <el-radio label="OK">同意</el-radio>
|
|
|
|
- <el-radio label="NO">废除任务</el-radio>
|
|
|
|
- </el-radio-group>
|
|
|
|
- </div>
|
|
|
|
- <div class="input-box">
|
|
|
|
- <el-input v-model="taskReviewForm.comment" :autosize="{ minRows: 3, maxRows: 5 }" placeholder="请输入审核意见" type="textarea" />
|
|
|
|
- </div>
|
|
|
|
- <div class="footer">
|
|
|
|
- <el-button type="info" hc-btn @click="cancelClick">取消</el-button>
|
|
|
|
- <el-button :loading="confirmLoading" hc-btn type="primary" @click="confirmClick">确认审批</el-button>
|
|
|
|
- </div>
|
|
|
|
- </div>
|
|
|
|
- </hc-new-card>
|
|
|
|
|
|
+ <div class="relative h-full">
|
|
|
|
+ <div class="hc-task-name relative">【{{ taskInfo.taskName }}】2019-10-17 中间计量申请 【第1期】 审批信息</div>
|
|
|
|
+ <div class="hc-task-body relative flex">
|
|
|
|
+ <div class="hc-task-time">
|
|
|
|
+ <hc-body padding="10px" scrollbar style="background: #f7f7f7;">
|
|
|
|
+ 111
|
|
|
|
+ </hc-body>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="hc-task-table">
|
|
|
|
+ <hc-body padding="10px" scrollbar style="background: #f7f7f7;">
|
|
|
|
+ 222
|
|
|
|
+ </hc-body>
|
|
|
|
+ </div>
|
|
|
|
+ <div class="hc-task-form">
|
|
|
|
+ <hc-body padding="10px" scrollbar style="background: #f7f7f7;">
|
|
|
|
+ 222
|
|
|
|
+ </hc-body>
|
|
|
|
+ </div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</hc-new-dialog>
|
|
</hc-new-dialog>
|
|
</template>
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
-import { nextTick, ref, watch } from 'vue'
|
|
|
|
-import { getRandom } from 'js-fast-way'
|
|
|
|
|
|
+import { ref, watch } from 'vue'
|
|
|
|
|
|
const props = defineProps({
|
|
const props = defineProps({
|
|
- ids: {
|
|
|
|
|
|
+ tabs: {
|
|
type: [String, Number],
|
|
type: [String, Number],
|
|
default: '',
|
|
default: '',
|
|
},
|
|
},
|
|
|
|
+ row: {
|
|
|
|
+ type: Object,
|
|
|
|
+ default: () => ({}),
|
|
|
|
+ },
|
|
})
|
|
})
|
|
|
|
|
|
//事件
|
|
//事件
|
|
const emit = defineEmits(['finish', 'close'])
|
|
const emit = defineEmits(['finish', 'close'])
|
|
|
|
|
|
-const uuid = getRandom(4)
|
|
|
|
-
|
|
|
|
//双向绑定
|
|
//双向绑定
|
|
// eslint-disable-next-line no-undef
|
|
// eslint-disable-next-line no-undef
|
|
const isShow = defineModel('modelValue', {
|
|
const isShow = defineModel('modelValue', {
|
|
@@ -66,120 +52,75 @@ const isShow = defineModel('modelValue', {
|
|
})
|
|
})
|
|
|
|
|
|
//监听
|
|
//监听
|
|
|
|
+const tabsKey = ref(props.tabs)
|
|
|
|
+const rowInfo = ref(props.row)
|
|
|
|
+const taskInfo = ref({})
|
|
|
|
+
|
|
watch(() => [
|
|
watch(() => [
|
|
- props.ids,
|
|
|
|
-], ([ids]) => {
|
|
|
|
- console.log('ids', ids)
|
|
|
|
-}, { immediate: true })
|
|
|
|
|
|
+ props.tabs,
|
|
|
|
+ props.row,
|
|
|
|
+], ([key, row]) => {
|
|
|
|
+ tabsKey.value = key
|
|
|
|
+ rowInfo.value = row
|
|
|
|
+}, {
|
|
|
|
+ immediate: true,
|
|
|
|
+ deep: true,
|
|
|
|
+})
|
|
|
|
|
|
//监听
|
|
//监听
|
|
watch(isShow, (val) => {
|
|
watch(isShow, (val) => {
|
|
if (val) {
|
|
if (val) {
|
|
- setSplitRef()
|
|
|
|
|
|
+
|
|
}
|
|
}
|
|
})
|
|
})
|
|
|
|
|
|
-//初始化设置拖动分割线
|
|
|
|
-const setSplitRef = () => {
|
|
|
|
- //配置参考: https://split.js.org/#/?direction=vertical&snapOffset=0
|
|
|
|
- nextTick(() => {
|
|
|
|
- window.$split(['#hc_pdf_card_' + uuid, '#hc_table_card_' + uuid], {
|
|
|
|
- sizes: [65, 35],
|
|
|
|
- snapOffset: 0,
|
|
|
|
- minSize: [50, 50],
|
|
|
|
- })
|
|
|
|
- })
|
|
|
|
-}
|
|
|
|
-
|
|
|
|
-const batchPdfUrl = ref('https://bladex-chongqing-info.oss-cn-hangzhou.aliyuncs.com//upload/20230920/0a4a7e36a1fcc05e9ff83f43fcfb12a9.pdf')
|
|
|
|
-
|
|
|
|
//表格数据
|
|
//表格数据
|
|
const tableColumn = ref([
|
|
const tableColumn = ref([
|
|
{ key: 'key1', name: '名称' },
|
|
{ key: 'key1', name: '名称' },
|
|
])
|
|
])
|
|
-const tableData = ref([
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
- { key1: 'xxxadasd' },
|
|
|
|
-])
|
|
|
|
|
|
+const tableData = ref([])
|
|
|
|
|
|
const tableRowClick = () => {
|
|
const tableRowClick = () => {
|
|
|
|
|
|
}
|
|
}
|
|
|
|
|
|
-
|
|
|
|
-const taskReviewForm = ref({
|
|
|
|
- flag: 'OK', comment: '',
|
|
|
|
-})
|
|
|
|
-
|
|
|
|
//确认审批
|
|
//确认审批
|
|
const confirmLoading = ref(false)
|
|
const confirmLoading = ref(false)
|
|
const confirmClick = () => {
|
|
const confirmClick = () => {
|
|
-
|
|
|
|
|
|
+ //emit('finish')
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+//取消审批
|
|
const cancelClick = () => {
|
|
const cancelClick = () => {
|
|
isShow.value = false
|
|
isShow.value = false
|
|
emit('close')
|
|
emit('close')
|
|
}
|
|
}
|
|
-
|
|
|
|
-
|
|
|
|
-const modalSave = () => {
|
|
|
|
- emit('finish')
|
|
|
|
-}
|
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
<style lang="scss" scoped>
|
|
-.content-box {
|
|
|
|
- position: relative;
|
|
|
|
- display: flex;
|
|
|
|
- flex-direction: column;
|
|
|
|
- height: 100%;
|
|
|
|
- .table-box {
|
|
|
|
- position: relative;
|
|
|
|
- flex: 1;
|
|
|
|
- flex-basis: auto;
|
|
|
|
- .table-view {
|
|
|
|
- position: absolute;
|
|
|
|
- inset: 0;
|
|
|
|
- }
|
|
|
|
- }
|
|
|
|
- .radio-box {
|
|
|
|
|
|
+.hc-task-name {
|
|
|
|
+ font-weight: bold;
|
|
|
|
+ color: #1A1a1a;
|
|
|
|
+ padding-bottom: 10px;
|
|
|
|
+ border-bottom: 1px solid #f5f5f5;
|
|
|
|
+}
|
|
|
|
+.hc-task-body {
|
|
|
|
+ height: calc(100% - 27px);
|
|
|
|
+ .hc-task-time {
|
|
position: relative;
|
|
position: relative;
|
|
|
|
+ height: 100%;
|
|
flex-shrink: 0;
|
|
flex-shrink: 0;
|
|
- margin-top: 14px;
|
|
|
|
|
|
+ width: 200px;
|
|
}
|
|
}
|
|
- .input-box {
|
|
|
|
|
|
+ .hc-task-table, .hc-task-form {
|
|
position: relative;
|
|
position: relative;
|
|
- flex-shrink: 0;
|
|
|
|
- margin-top: 10px;
|
|
|
|
|
|
+ height: 100%;
|
|
|
|
+ flex: 1;
|
|
|
|
+ flex-basis: auto;
|
|
}
|
|
}
|
|
- .footer {
|
|
|
|
- position: relative;
|
|
|
|
- flex-shrink: 0;
|
|
|
|
- text-align: center;
|
|
|
|
- margin-top: 14px;
|
|
|
|
- .el-button + .el-button {
|
|
|
|
- margin-left: 40px;
|
|
|
|
- }
|
|
|
|
|
|
+ .hc-task-table {
|
|
|
|
+ border-left: 1px solid #e5e5e5;
|
|
|
|
+ border-right: 1px solid #e5e5e5;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|