From 00a6296aa98004b5ed78b82efd314d2e9476293d Mon Sep 17 00:00:00 2001
From: kaeery <3491123437@qq.com>
Date: Mon, 24 Feb 2025 19:58:50 +0800
Subject: [PATCH] =?UTF-8?q?=E3=80=90=E6=80=BB=E7=BB=93=E7=AE=A1=E7=90=86?=
 =?UTF-8?q?=E3=80=91=20=E6=96=B0=E5=A2=9E#=20=E6=80=BB=E7=BB=93=E6=A8=A1?=
 =?UTF-8?q?=E6=9D=BF=E5=92=8C=E6=80=BB=E7=BB=93=E8=AE=B0=E5=BD=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/summary/components/add-item.vue     |  55 +++++++++
 .../summary/components/template-drawer.vue    |  86 +++++++++++++
 src/views/summary/index.vue                   |  65 ++++++++++
 .../summary/modules/record-search-form.vue    |  36 ++++++
 src/views/summary/modules/summary-record.vue  |  38 ++++++
 .../summary/modules/summary-template.vue      | 114 ++++++++++++++++++
 .../summary/modules/template-search-form.vue  |  47 ++++++++
 7 files changed, 441 insertions(+)
 create mode 100644 src/views/summary/components/add-item.vue
 create mode 100644 src/views/summary/components/template-drawer.vue
 create mode 100644 src/views/summary/modules/record-search-form.vue
 create mode 100644 src/views/summary/modules/summary-record.vue
 create mode 100644 src/views/summary/modules/summary-template.vue
 create mode 100644 src/views/summary/modules/template-search-form.vue

diff --git a/src/views/summary/components/add-item.vue b/src/views/summary/components/add-item.vue
new file mode 100644
index 0000000..c97e51c
--- /dev/null
+++ b/src/views/summary/components/add-item.vue
@@ -0,0 +1,55 @@
+<template>
+    <div class="flex items-center gap-[6px] mb-[10px]">
+        <span>{{ index + 1 }}.</span>
+        <div class="bg-primary-light-10 p-[16px] rounded-[6px] flex-1">
+            <el-form-item label="表单类型">
+                <el-radio-group v-model="item.formType">
+                    <el-radio v-for="type in formTypes" :key="type.value" :label="type.value">{{ type.label }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item label="表单标题">
+                <template v-if="item.formType === 1">
+                    <el-input v-model="item.formTitle" placeholder="请输入表单标题" maxlength="50" show-word-limit />
+                </template>
+                <template v-if="item.formType === 2">
+                    <el-input v-model="item.formTitle" type="textarea" placeholder="请输入表单标题" maxlength="250" show-word-limit />
+                </template>
+            </el-form-item>
+        </div>
+        <div class="flex flex-col items-end">
+            <el-button type="primary" link @click="handleCopyItem">复制</el-button>
+            <el-button type="primary" link @click="handleDeleteItem">删除</el-button>
+        </div>
+    </div>
+</template>
+
+<script setup lang="ts">
+import type { PropType } from 'vue'
+import type { Item } from './template-drawer.vue'
+
+const props = defineProps({
+    item: {
+        type: Object as PropType<Item>,
+        default: () => ({
+            formType: 1,
+            formTitle: ''
+        })
+    },
+    index: {
+        type: Number,
+        default: 0
+    }
+})
+const emit = defineEmits(['handleCopyItem', 'handleDeleteItem'])
+const formTypes = ref([
+    { label: '单行文本', value: 1 },
+    { label: '多行文本', value: 2 }
+])
+const handleCopyItem = () => {
+    emit('handleCopyItem', props.index)
+}
+const handleDeleteItem = () => {
+    emit('handleDeleteItem', props.index)
+}
+</script>
+<style scoped></style>
diff --git a/src/views/summary/components/template-drawer.vue b/src/views/summary/components/template-drawer.vue
new file mode 100644
index 0000000..1a205c2
--- /dev/null
+++ b/src/views/summary/components/template-drawer.vue
@@ -0,0 +1,86 @@
+<template>
+    <ProDrawer ref="proDrawerRef" @handle-cancel="handleCancel" @handle-confirm="handleConfirm">
+        <el-form v-model="form">
+            <el-form-item label="设置为默认模板">
+                <el-switch v-model="form.isDefault" :active-value="1" :inactive-value="0" />
+            </el-form-item>
+            <el-form-item label="模板名称">
+                <el-input v-model="form.templateName" placeholder="请输入" maxlength="20" show-word-limit />
+            </el-form-item>
+            <el-form-item label="模板类型">
+                <el-radio-group v-model="form.templateType">
+                    <el-radio v-for="type in types" :key="type.value" :label="type.value">{{ type.label }}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item label="模板内容">
+                <el-button type="primary" plain @click="handleAddItem">新增模板项</el-button>
+            </el-form-item>
+            <add-item
+                v-for="(item, index) in form.templateItems"
+                :key="index"
+                :item="item"
+                :index="index"
+                @handle-copy-item="handleCopyItem"
+                @handle-delete-item="handleDeleteItem"
+            />
+        </el-form>
+    </ProDrawer>
+</template>
+
+<script setup lang="ts">
+import ProDrawer, { type IParams } from '@/components/ProDrawer/index.vue'
+import addItem from './add-item.vue'
+
+export interface Item {
+    formType: number
+    formTitle: string
+}
+interface IForm {
+    templateName: string
+    templateType: number
+    isDefault: number
+    templateItems: Item[]
+}
+const emit = defineEmits(['refreshList'])
+const proDrawerRef = ref<InstanceType<typeof ProDrawer>>()
+
+const types = ref([
+    { label: '电销', value: 1 },
+    { label: '招生', value: 2 }
+])
+const form = ref<IForm>({
+    templateName: '',
+    templateType: 1,
+    isDefault: 1,
+    templateItems: []
+})
+const handleAddItem = () => {
+    form.value.templateItems.push({
+        formType: 1,
+        formTitle: ''
+    })
+}
+const handleCopyItem = (index: number) => {
+    form.value.templateItems.splice(index, 0, {
+        formType: 1,
+        formTitle: ''
+    })
+}
+const handleDeleteItem = (index: number) => {
+    form.value.templateItems.splice(index, 1)
+}
+const openDrawer = (params: IParams) => {
+    proDrawerRef.value?.openDrawer(params)
+}
+const handleCancel = (callback: () => void) => {
+    callback()
+}
+const handleConfirm = (callback: () => void) => {
+    callback()
+    emit('refreshList')
+}
+defineExpose({
+    openDrawer
+})
+</script>
+<style scoped></style>
diff --git a/src/views/summary/index.vue b/src/views/summary/index.vue
index e69de29..00c2851 100644
--- a/src/views/summary/index.vue
+++ b/src/views/summary/index.vue
@@ -0,0 +1,65 @@
+<template>
+    <component :is="componentName" v-model="queryParams[activeTab]" @reset-page="resetPage" @reset-params="resetParams" />
+    <el-card shadow="never" class="!border-none mt-4 summary">
+        <el-tabs v-model="activeTab">
+            <el-tab-pane label="总结模板" name="template">
+                <summary-template v-if="activeTab === 'template'" ref="summaryTemplateRef" :queryParams="queryParams[activeTab]" />
+            </el-tab-pane>
+            <el-tab-pane label="总结记录" name="record">
+                <summary-record v-if="activeTab === 'record'" ref="summaryRecordRef" :queryParams="queryParams[activeTab]" />
+            </el-tab-pane>
+        </el-tabs>
+    </el-card>
+</template>
+
+<script setup lang="ts">
+import templateSearchForm from './modules/template-search-form.vue'
+import recordSearchForm from './modules/record-search-form.vue'
+import summaryTemplate from './modules/summary-template.vue'
+import summaryRecord from './modules/summary-record.vue'
+
+const queryParams = ref<Record<string, any>>({
+    template: {
+        name: '',
+        type: '',
+        status: null
+    },
+    record: {
+        submitName: '',
+        submitDate: ''
+    }
+})
+const componentName = computed(() => (activeTab.value == 'template' ? templateSearchForm : recordSearchForm))
+const activeTab = ref('template')
+
+const summaryTemplateRef = ref<InstanceType<typeof summaryTemplate>>()
+const summaryRecordRef = ref<InstanceType<typeof summaryRecord>>()
+const resetPage = () => {
+    switch (activeTab.value) {
+        case 'template':
+            summaryTemplateRef.value?.resetPage()
+            break
+        case 'record':
+            summaryRecordRef.value?.resetPage()
+            break
+    }
+}
+const resetParams = () => {
+    switch (activeTab.value) {
+        case 'template':
+            summaryTemplateRef.value?.resetParams()
+            break
+        case 'record':
+            summaryRecordRef.value?.resetParams()
+            break
+    }
+}
+</script>
+
+<style scoped lang="scss">
+.summary {
+    :deep(.el-card__body) {
+        padding-top: 0;
+    }
+}
+</style>
diff --git a/src/views/summary/modules/record-search-form.vue b/src/views/summary/modules/record-search-form.vue
new file mode 100644
index 0000000..57aa199
--- /dev/null
+++ b/src/views/summary/modules/record-search-form.vue
@@ -0,0 +1,36 @@
+<template>
+    <el-card shadow="never" class="!border-none">
+        <el-form ref="formRef" class="mb-[-16px]" :model="modelValue" :inline="true">
+            <el-form-item label="提交人">
+                <el-input class="w-[280px]" placeholder="请输入" v-model="modelValue.submitName" clearable @keyup.enter="$emit('resetPage')" />
+            </el-form-item>
+            <el-form-item label="提交时间">
+                <el-date-picker
+                    v-model="modelValue.submitDate"
+                    type="datetimerange"
+                    range-separator="至"
+                    start-placeholder="开始时间"
+                    end-placeholder="结束时间"
+                />
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="$emit('resetPage')">查询</el-button>
+                <el-button @click="$emit('resetParams')">重置</el-button>
+            </el-form-item>
+        </el-form>
+    </el-card>
+</template>
+
+<script setup lang="ts">
+defineProps({
+    modelValue: {
+        type: Object,
+        default: () => ({
+            submitName: '',
+            submitDate: ''
+        })
+    }
+})
+defineEmits(['resetPage', 'resetParams'])
+</script>
+<style scoped></style>
diff --git a/src/views/summary/modules/summary-record.vue b/src/views/summary/modules/summary-record.vue
new file mode 100644
index 0000000..1952966
--- /dev/null
+++ b/src/views/summary/modules/summary-record.vue
@@ -0,0 +1,38 @@
+<template>
+    <ProTable ref="proTableRef" :columns="columns" :tableData="pager.lists" :loading="pager.loading" :maxHeight="530" />
+</template>
+
+<script setup lang="ts">
+import { postLists } from '@/api/org/post'
+import { usePaging } from '@/hooks/usePaging'
+
+const props = defineProps({
+    queryParams: {
+        type: Object,
+        default: () => ({
+            submitName: '',
+            submitDate: ''
+        })
+    }
+})
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: postLists,
+    params: props.queryParams
+})
+getLists()
+
+const proTableRef = ref()
+const columns = reactive([
+    { prop: 'name', label: '提交人', width: 180 },
+    { prop: 'type', label: '岗位', width: 180 },
+    { prop: 'type', label: '提交时间', width: 180 },
+    { prop: 'type', label: '总结情况', width: 180 }
+])
+defineExpose({
+    resetPage,
+    resetParams,
+    getLists
+})
+</script>
+<style scoped></style>
diff --git a/src/views/summary/modules/summary-template.vue b/src/views/summary/modules/summary-template.vue
new file mode 100644
index 0000000..3930a40
--- /dev/null
+++ b/src/views/summary/modules/summary-template.vue
@@ -0,0 +1,114 @@
+<template>
+    <el-space direction="vertical" alignment="normal" :size="16">
+        <div>
+            <el-button type="primary" @click="handleAdd">新增模板</el-button>
+            <el-button type="danger" @click="handleBatchDelete" plain :disabled="isDisabled">批量删除</el-button>
+        </div>
+        <ProTable ref="proTableRef" :columns="columns" :tableData="pager.lists" :loading="pager.loading" :maxHeight="530">
+            <template #name="{ row }">
+                <el-space>
+                    <span>{{ row.name }}</span>
+                    <span>{{ tagName(row) }}</span>
+                </el-space>
+            </template>
+            <template #status="{ row }">
+                <el-switch v-model="row.status" :active-value="1" :inactive-value="0" :before-change="() => handleBeforeChange(row)" />
+            </template>
+            <template #operation="{ row }">
+                <el-button type="primary" link @click="handleEdit(row)">编辑</el-button>
+                <el-button type="primary" link @click="handleDelete(row)">删除</el-button>
+            </template>
+        </ProTable>
+    </el-space>
+    <template-drawer ref="templateDrawerRef" @refreshList="getLists" />
+</template>
+
+<script setup lang="ts">
+import useHandleData from '@/hooks/useHandleData'
+import templateDrawer from '../components/template-drawer.vue'
+import { usePaging } from '@/hooks/usePaging'
+import { postLists } from '@/api/org/post'
+import feedback from '@/utils/feedback'
+
+const props = defineProps({
+    queryParams: {
+        type: Object,
+        default: () => ({
+            name: '',
+            type: '',
+            status: null
+        })
+    }
+})
+const emit = defineEmits(['handleEdit', 'handleDelete'])
+
+const { pager, getLists, resetPage, resetParams } = usePaging({
+    fetchFun: postLists,
+    params: props.queryParams
+})
+getLists()
+const proTableRef = ref()
+const columns = reactive([
+    { type: 'selection', width: 70 },
+    { prop: 'name', label: '模板名称', width: 180 },
+    { prop: 'type', label: '模板类型', width: 180 },
+    { prop: 'status', label: '模板状态', width: 180 },
+    { prop: 'createTime', label: '创建时间', width: 180 },
+    { prop: 'updateTime', label: '更新时间', width: 180 },
+    { prop: 'operation', label: '操作', fixed: 'right', width: 250 }
+])
+const enumType: Record<number, string> = {
+    1: '电销',
+    2: '招生'
+}
+const typeName = computed(() => row => enumType[row.type])
+const tagName = computed(() => row => row.isDefault == 1 ? `默认${typeName.value(row)}模板` : '')
+const templateDrawerRef = ref<InstanceType<typeof templateDrawer>>()
+const handleAdd = () => {
+    templateDrawerRef.value?.openDrawer({
+        title: '新增模板',
+        width: 500,
+        data: {}
+    })
+}
+const handleEdit = row => {
+    templateDrawerRef.value?.openDrawer({
+        title: '新增模板',
+        width: 500,
+        data: { ...row }
+    })
+}
+const isDisabled = computed(() => proTableRef?.value?.selectedListIds?.length == 0)
+const handleDelete = row => {
+    deleteCommon(row)
+}
+const handleBatchDelete = () => {
+    deleteCommon()
+}
+const deleteCommon = async (row?: any) => {
+    if (row) proTableRef.value.tableRef.toggleRowSelection(row, true)
+    const ids = proTableRef.value.selectedListIds
+    const message = '是否要删除选中的?'
+    const flag = await useHandleData(message)
+    if (flag) {
+        console.log(ids)
+    }
+    proTableRef.value.tableRef.clearSelection()
+}
+const handleBeforeChange = row => {
+    const { id, status } = row
+    return new Promise(async resolve => {
+        try {
+            const text = '确定' + `${status === 1 ? '停用' : '启用'}该模板?`
+            await feedback.confirm(text)
+            return resolve(true)
+        } catch (error) {}
+    })
+}
+defineExpose({
+    resetPage,
+    resetParams,
+    getLists
+})
+</script>
+<style scoped></style>
diff --git a/src/views/summary/modules/template-search-form.vue b/src/views/summary/modules/template-search-form.vue
new file mode 100644
index 0000000..83fca30
--- /dev/null
+++ b/src/views/summary/modules/template-search-form.vue
@@ -0,0 +1,47 @@
+<template>
+    <el-card shadow="never" class="!border-none">
+        <el-form ref="formRef" class="mb-[-16px]" :model="modelValue" :inline="true">
+            <el-form-item label="模板名称">
+                <el-input class="w-[280px]" placeholder="请输入" v-model="modelValue.name" clearable @keyup.enter="$emit('resetPage')" />
+            </el-form-item>
+            <el-form-item label="模板类型">
+                <el-select class="w-[280px]" v-model="modelValue.type">
+                    <el-option v-for="option in typeOptions" :key="option.value" :label="option.label" :value="option.value" />
+                </el-select>
+            </el-form-item>
+            <el-form-item label="模板状态">
+                <el-select class="w-[280px]" v-model="modelValue.status">
+                    <el-option v-for="option in statusOptions" :key="option.value" :label="option.label" :value="option.value" />
+                </el-select>
+            </el-form-item>
+            <el-form-item>
+                <el-button type="primary" @click="$emit('resetPage')">查询</el-button>
+                <el-button @click="$emit('resetParams')">重置</el-button>
+            </el-form-item>
+        </el-form>
+    </el-card>
+</template>
+
+<script setup lang="ts">
+defineProps({
+    modelValue: {
+        type: Object,
+        default: () => ({
+            name: '',
+            type: '',
+            status: null
+        })
+    }
+})
+defineEmits(['resetPage', 'resetParams'])
+const typeOptions = ref([
+    { label: '电销', value: 1 },
+    { label: '招生', value: 2 }
+])
+const statusOptions = ref([
+    { label: '启用', value: 1 },
+    { label: '停用', value: 2 }
+])
+</script>
+
+<style scoped lang="scss"></style>