Merge branch 'lhd'

src/api/list.js

@@ -85,3 +85,33 @@ export function PageQueryProjectResourceList(data) {
 export function PageQueryTemplateList_EditBookSelect(data) {
   return http.post(`${process.env.VUE_APP_EepServer}?MethodName=page_query-PageQueryTemplateList_EditBookSelect`, data);
 }
+
+/**
+ * @description 分页查询模板列表-个人模板
+ * @param {object} data
+ * @param {number} data.page_capacity - 每页容量
+ * @param {number} data.cur_page - 当前查询页码
+ */
+export function PageQueryTemplateListPersonal(data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=page_query-PageQueryTemplateList_Personal`, data);
+}
+
+/**
+ * @description 分页查询模板列表-机构模板
+ * @param {object} data
+ * @param {number} data.page_capacity - 每页容量
+ * @param {number} data.cur_page - 当前查询页码
+ */
+export function PageQueryTemplateListOrg(data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=page_query-PageQueryTemplateList_Org`, data);
+}
+
+/**
+ * @description 分页查询模板列表-机构管理员
+ * @param {object} data
+ * @param {number} data.page_capacity - 每页容量
+ * @param {number} data.cur_page - 当前查询页码
+ */
+export function PageQueryTemplateListOrgManager(data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=page_query-PageQueryTemplateList_OrgManager`, data);
+}

src/api/template.js

@@ -11,3 +11,33 @@ export function SaveCoursewareAsTemplatePersonal(data) {
     data,
   );
 }
+
+// 创建个人模板
+export function CreateTemplatePersonal (data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=template_manager-CreateTemplate_Personal`, data);
+}
+
+// 更改模板共享状态
+export function UpdateTemplateShareStatus (data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=template_manager-UpdateTemplateShareStatus`, data);
+}
+
+// 删除模板
+export function DeleteTemplate (data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=template_manager-DeleteTemplate`, data);
+}
+
+// 创建机构模板
+export function CreateTemplateOrg (data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=template_manager-CreateTemplate_Org`, data);
+}
+
+// 更改模板使用范围
+export function UpdateTemplateUseScope (data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=template_manager-UpdateTemplateUseScope`, data);
+}
+
+// 更改模板状态
+export function UpdateTemplateStatus (data) {
+  return http.post(`${process.env.VUE_APP_EepServer}?MethodName=template_manager-UpdateTemplateStatus`, data);
+}

src/layouts/default/header/index.vue

@@ -52,10 +52,12 @@ export default {
         { key: 'personal_workbench/project', name: '教材管理' },
         { key: 'personal_workbench/edit_task', name: '教材制作' },
         { key: 'personal_workbench/check_task', name: '教材审核' },
+        { key: 'personal_workbench/template_list_org', name: '模板制作' },
         { key: 'personal_center', name: '个人中心' },
       ],
       ORG_MANAGER: [
         { key: 'project_manage/org/project', name: '项目管理' },
+        { key: 'personal_workbench/template_list_manager', name: '模板管理' },
         { key: 'user_manage_org', name: '用户管理' },
         { key: 'personal_center', name: '个人中心' },
       ],

src/router/modules/project.js

@@ -90,6 +90,33 @@ const personalWorkPage = {
       },
       component: () => import('@/views/personal_workbench/project/ProductionResourceManage.vue'),
     },
+    // 我的模板库
+    {
+      path: '/personal_workbench/template_list',
+      name: 'PersonalWorkbenchTemplate',
+      meta: {
+        title: '我的模板库',
+      },
+      component: () => import('@/views/personal_workbench/template_list/index.vue'),
+    },
+    // 模板制作-机构模板
+    {
+      path: '/personal_workbench/template_list_org',
+      name: 'PersonalWorkbenchTemplateOrg',
+      meta: {
+        title: '模板制作',
+      },
+      component: () => import('@/views/personal_workbench/template_list_org/index.vue'),
+    },
+    // 模板制作-机构模板
+    {
+      path: 'personal_workbench/template_list_manager',
+      name: 'PersonalWorkbenchTemplateManager',
+      meta: {
+        title: '模板管理',
+      },
+      component: () => import('@/views/personal_workbench/template_list_manager/index.vue'),
+    },
   ],
 };
 

src/views/book/courseware/preview/components/new_word/components/writeTableZoom.vue

@@ -245,6 +245,7 @@ export default {
       showLeft: true,
       curTime: 0,
       stopAudioS: false,
+      ed: null,
     };
   },
   // 计算属性 类似于data概念
@@ -285,6 +286,10 @@ export default {
       this.showLeft = !this.showLeft;
       this.isFlipped = !this.isFlipped;
     },
+    changeRota() {
+      this.showLeft = true;
+      this.isFlipped = false;
+    },
     // 点击播放某个句子
     handleChangeTime(time, edTime) {
       this.curTime = time;

src/views/personal_workbench/common/menu.vue

@@ -33,13 +33,20 @@ export default {
       { key: '/project_manage/book', name: '已上架教材' },
     ];
 
-    const onlyMenuList = [
+    const onlyMenuList = [{ key: '/personal_workbench/check_task', name: '我的审校任务' }];
+
+    // 教材制作增加模板库标签
+    const subMenuLists = [
       { key: '/personal_workbench/edit_task', name: '我的编辑任务' },
-      { key: '/personal_workbench/check_task', name: '我的审校任务' },
+      { key: '/personal_workbench/template_list', name: '我的模板库' },
     ];
 
     if (this.onlyKey) {
-      subMenuList = [onlyMenuList.find((item) => item.key === this.onlyKey)];
+      if (this.onlyKey === '/personal_workbench/check_task') {
+        subMenuList = onlyMenuList;
+      } else {
+        subMenuList = subMenuLists;
+      }
     }
     return {
       activeKey: this.onlyKey ? this.onlyKey : this.curKey,

src/views/personal_workbench/template_list/index.vue

@@ -0,0 +1,246 @@
+<template>
+  <div class="template">
+    <MenuPage only-key="/personal_workbench/template_list" />
+
+    <div class="template-list">
+      <div id="query-form">
+        <el-form inline>
+          <el-form-item prop="name" label="名称">
+            <el-input v-model="form.name" />
+          </el-form-item>
+
+          <el-form-item prop="status" label="状态">
+            <el-select v-model="form.status">
+              <el-option v-for="item in status_list" :key="item.value" :value="item.value" :label="item.label" />
+            </el-select>
+          </el-form-item>
+          <el-form-item class="search-box">
+            <el-button class="search-btn" type="primary" @click="queryList">查询</el-button>
+          </el-form-item>
+        </el-form>
+        <el-button type="primary" size="small" @click="visible = true"> 创建模板 </el-button>
+      </div>
+      <el-table v-if="tableHeight" :data="list" :max-height="tableHeight + 'px'">
+        <el-table-column
+          type="index"
+          label="序号"
+          width="60"
+          align="center"
+          :index="(form.cur_page - 1) * form.page_capacity + 1"
+          header-align="center"
+          class-name="index-column"
+        />
+        <el-table-column min-width="250" prop="id" label="编号" align="center" header-align="center" />
+        <el-table-column prop="name" label="名称" align="center" header-align="center" />
+        <el-table-column min-width="150" prop="share_status" label="共享状态" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            {{ row.share_status === 0 ? '未共享' : '已共享' }}
+          </template>
+        </el-table-column>
+
+        <el-table-column min-width="150" prop="status" label="发布状态" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            {{ status_list.find((item) => item.value === row.status).label }}
+          </template>
+        </el-table-column>
+
+        <el-table-column prop="create_time" label="创建时间" align="center" width="180" header-align="center" />
+
+        <el-table-column prop="operation" label="操作" fixed="right" width="200" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            <span class="link" @click="previewTemplate(row)">预览</span>
+            <span class="link" @click="shareTemplate(row)">{{
+              row.share_status === 0 ? '共享到机构模板' : '取消共享'
+            }}</span>
+            <span class="link danger" @click="deleteTemplate(row)">删除</span>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <PaginationPage ref="pagination" :total="total" @getList="queryTemplateList" />
+    </div>
+    <el-dialog
+      title="创建模板"
+      :visible="visible"
+      width="460px"
+      :close-on-click-modal="false"
+      class="add-chapter"
+      @close="dialogClose"
+    >
+      <el-form ref="form" :model="data" :rules="rules" label-width="80px">
+        <el-form-item label="模板名称" prop="name">
+          <el-input ref="name" v-model="data.name" placeholder="请输入模板名称" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button @click="dialogClose">取消</el-button>
+        <el-button type="primary" @click="addTemplate" :loading="loading">确定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import MenuPage from '../common/menu.vue';
+import PaginationPage from '@/components/PaginationPage.vue';
+
+import { PageQueryTemplateListPersonal } from '@/api/list.js';
+import { CreateTemplatePersonal, UpdateTemplateShareStatus, DeleteTemplate } from '@/api/template';
+
+export default {
+  name: 'PersonalWorkbenchTemplate',
+  components: {
+    MenuPage,
+    PaginationPage,
+  },
+  data() {
+    return {
+      list: [],
+      total: 0,
+      cur_page_begin_index: 0,
+      status_list: [
+        {
+          value: -1,
+          label: '全部',
+        },
+        {
+          value: 0,
+          label: '草稿',
+        },
+        {
+          value: 1,
+          label: '申请发布',
+        },
+        {
+          value: 2,
+          label: '已发布',
+        },
+        {
+          value: 3,
+          label: '未发布',
+        },
+        {
+          value: 4,
+          label: '驳回发布申请',
+        },
+      ],
+      form: {
+        name: '',
+        status: -1,
+        page_capacity: 10,
+        cur_page: 1,
+      },
+      tableHeight: 0,
+      rules: {
+        name: [{ required: true, message: '请输入模板名称', trigger: 'blur' }],
+      },
+      data: {
+        name: '',
+      },
+      visible: false,
+      loading: false,
+    };
+  },
+  mounted() {
+    this.tableHeight =
+      document.getElementsByClassName('app-container')[0].clientHeight -
+      document.getElementById('query-form').clientHeight -
+      document.getElementsByClassName('el-pagination')[0].clientHeight -
+      10;
+  },
+  methods: {
+    queryTemplateList(data) {
+      this.form.page_capacity = data.page_capacity;
+      this.form.cur_page = data.cur_page;
+      PageQueryTemplateListPersonal(this.form).then(({ total_count, template_list }) => {
+        this.total = total_count;
+        this.list = template_list;
+      });
+    },
+    queryList() {
+      this.queryTemplateList({ cur_page: 1, page_capacity: this.form.page_capacity });
+    },
+    // 关闭弹窗
+    dialogClose() {
+      this.visible = false;
+    },
+    // 确定创建模板
+    addTemplate() {
+      this.loading = true;
+      CreateTemplatePersonal(this.data)
+        .then((res) => {
+          this.loading = false;
+          this.visible = false;
+          if (res.status === 1) {
+            this.$message({
+              type: 'success',
+              message: '创建成功!',
+            });
+            this.data = {
+              name: '',
+            };
+
+            this.queryList();
+          }
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+    // 预览模板
+    previewTemplate(row) {},
+    //共享/取消共享模板
+    shareTemplate(row) {
+      UpdateTemplateShareStatus({ share_status: row.share_status === 0 ? 1 : 0, id: row.id }).then((res) => {
+        if (res.status === 1) {
+          this.$message({
+            type: 'success',
+            message: '设置成功!',
+          });
+          this.queryTemplateList({ cur_page: this.form.cur_page, page_capacity: this.form.page_capacity });
+        }
+      });
+    },
+    // 删除模板
+    deleteTemplate(row) {
+      this.$confirm('是否删除此模板？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          DeleteTemplate({ id: row.id }).then((res) => {
+            if (res.status === 1) {
+              this.$message({
+                type: 'success',
+                message: '删除成功!',
+              });
+              this.queryTemplateList({ cur_page: this.form.cur_page, page_capacity: this.form.page_capacity });
+            }
+          });
+        })
+        .catch(() => {});
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@use '@/styles/mixin.scss' as *;
+
+.template {
+  @include page-base;
+  @include table-list;
+
+  #query-form {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+    justify-content: space-between;
+
+    :deep .el-form-item--small.el-form-item {
+      margin-bottom: 5px;
+    }
+  }
+}
+</style>

src/views/personal_workbench/template_list_manager/index.vue

@@ -0,0 +1,192 @@
+<template>
+  <div class="template">
+    <div class="template-list">
+      <div id="query-form">
+        <el-form inline>
+          <el-form-item prop="name" label="名称">
+            <el-input v-model="form.name" />
+          </el-form-item>
+
+          <el-form-item prop="status" label="状态">
+            <el-select v-model="form.status">
+              <el-option v-for="item in status_list" :key="item.value" :value="item.value" :label="item.label" />
+            </el-select>
+          </el-form-item>
+          <el-form-item class="search-box">
+            <el-button class="search-btn" type="primary" @click="queryList">查询</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+      <el-table v-if="tableHeight" :data="list" :max-height="tableHeight + 'px'">
+        <el-table-column
+          type="index"
+          label="序号"
+          width="60"
+          align="center"
+          :index="(form.cur_page - 1) * form.page_capacity + 1"
+          header-align="center"
+          class-name="index-column"
+        />
+        <el-table-column width="250" prop="id" label="编号" align="center" header-align="center" />
+        <el-table-column prop="name" label="名称" align="center" header-align="center" />
+
+        <el-table-column width="120" prop="storage_type" label="来源" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            {{ row.storage_type === 0 ? '个人' : '机构' }}
+          </template>
+        </el-table-column>
+        <el-table-column width="120" prop="status" label="状态" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            {{ status_list.find((item) => item.value === row.status).label }}
+          </template>
+        </el-table-column>
+        <el-table-column width="120" prop="use_scope" label="使用范围" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            {{ row.use_scope === 0 ? '本机构' : '全域' }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="create_time" label="创建时间" align="center" width="180" header-align="center" />
+
+        <el-table-column prop="operation" label="操作" fixed="right" width="300" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            <span class="link" @click="previewTemplate(row)">预览</span>
+            <span class="link" @click="changeStatusTemplate(row, 1)" v-if="row.status === 0 || row.status === 3">{{
+              '申请发布'
+            }}</span>
+            <span class="link" @click="changeStatusTemplate(row, 2)" v-if="row.status === 1 || row.status === 3">{{
+              '发布'
+            }}</span>
+            <span class="link" @click="changeStatusTemplate(row, 4)" v-if="row.status === 1">{{ '驳回' }}</span>
+            <span class="link" @click="changeStatusTemplate(row, 3)" v-if="row.status === 2">{{ '取消发布' }}</span>
+            <span class="link" @click="changeStatusTemplate(row, 1)" v-if="row.status === 4">{{ '撤销驳回' }}</span>
+            <span class="link" @click="changeUseScope(row)">{{
+              row.use_scope === 0 ? '设置全域范围' : '取消全域范围'
+            }}</span>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <PaginationPage ref="pagination" :total="total" @getList="queryTemplateList" />
+    </div>
+  </div>
+</template>
+
+<script>
+import PaginationPage from '@/components/PaginationPage.vue';
+
+import { PageQueryTemplateListOrgManager } from '@/api/list.js';
+import { UpdateTemplateStatus, UpdateTemplateUseScope } from '@/api/template';
+
+export default {
+  name: 'PersonalWorkbenchTemplateManager',
+  components: {
+    PaginationPage,
+  },
+  data() {
+    return {
+      list: [],
+      total: 0,
+      cur_page_begin_index: 0,
+      status_list: [
+        {
+          value: -1,
+          label: '全部',
+        },
+        {
+          value: 0,
+          label: '草稿',
+        },
+        {
+          value: 1,
+          label: '申请发布',
+        },
+        {
+          value: 2,
+          label: '已发布',
+        },
+        {
+          value: 3,
+          label: '未发布',
+        },
+        {
+          value: 4,
+          label: '驳回发布申请',
+        },
+      ],
+      form: {
+        name: '',
+        status: -1,
+        page_capacity: 10,
+        cur_page: 1,
+      },
+      tableHeight: 0,
+    };
+  },
+  mounted() {
+    this.tableHeight =
+      document.getElementsByClassName('app-container')[0].clientHeight -
+      document.getElementById('query-form').clientHeight -
+      document.getElementsByClassName('el-pagination')[0].clientHeight -
+      10;
+  },
+  methods: {
+    queryTemplateList(data) {
+      this.form.page_capacity = data.page_capacity;
+      this.form.cur_page = data.cur_page;
+      PageQueryTemplateListOrgManager(this.form).then(({ total_count, template_list }) => {
+        this.total = total_count;
+        this.list = template_list;
+      });
+    },
+    queryList() {
+      this.queryTemplateList({ cur_page: 1, page_capacity: this.form.page_capacity });
+    },
+    // 预览模板
+    previewTemplate(row) {},
+    // 更改模板状态
+    changeStatusTemplate(row, status) {
+      UpdateTemplateStatus({ status: status, id: row.id }).then((res) => {
+        if (res.status === 1) {
+          this.$message({
+            type: 'success',
+            message: '操作成功!',
+          });
+          this.queryTemplateList({ cur_page: this.form.cur_page, page_capacity: this.form.page_capacity });
+        }
+      });
+    },
+    // 更改使用范围
+    changeUseScope(row) {
+      UpdateTemplateUseScope({ use_scope: row.use_scope === 0 ? 1 : 0, id: row.id }).then((res) => {
+        if (res.status === 1) {
+          this.$message({
+            type: 'success',
+            message: '设置成功!',
+          });
+          this.queryTemplateList({ cur_page: this.form.cur_page, page_capacity: this.form.page_capacity });
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@use '@/styles/mixin.scss' as *;
+
+.template {
+  @include page-base;
+  @include table-list;
+
+  #query-form {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+    justify-content: space-between;
+
+    :deep .el-form-item--small.el-form-item {
+      margin-bottom: 5px;
+    }
+  }
+}
+</style>

src/views/personal_workbench/template_list_org/index.vue

@@ -0,0 +1,243 @@
+<template>
+  <div class="template">
+    <div class="template-list">
+      <div id="query-form">
+        <el-form inline>
+          <el-form-item prop="name" label="名称">
+            <el-input v-model="form.name" />
+          </el-form-item>
+
+          <el-form-item prop="status" label="状态">
+            <el-select v-model="form.status">
+              <el-option v-for="item in status_list" :key="item.value" :value="item.value" :label="item.label" />
+            </el-select>
+          </el-form-item>
+          <el-form-item class="search-box">
+            <el-button class="search-btn" type="primary" @click="queryList">查询</el-button>
+          </el-form-item>
+        </el-form>
+        <el-button type="primary" size="small" @click="visible = true"> 创建模板 </el-button>
+      </div>
+      <el-table v-if="tableHeight" :data="list" :max-height="tableHeight + 'px'">
+        <el-table-column
+          type="index"
+          label="序号"
+          width="60"
+          align="center"
+          :index="(form.cur_page - 1) * form.page_capacity + 1"
+          header-align="center"
+          class-name="index-column"
+        />
+        <el-table-column min-width="250" prop="id" label="编号" align="center" header-align="center" />
+        <el-table-column prop="name" label="名称" align="center" header-align="center" />
+
+        <el-table-column min-width="150" prop="status" label="状态" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            {{ status_list.find((item) => item.value === row.status).label }}
+          </template>
+        </el-table-column>
+
+        <el-table-column prop="create_time" label="创建时间" align="center" width="180" header-align="center" />
+
+        <el-table-column prop="operation" label="操作" fixed="right" width="200" align="center" header-align="center">
+          <template slot-scope="{ row }">
+            <span class="link" @click="previewTemplate(row)">预览</span>
+            <span class="link" @click="changeStatusTemplate(row)">{{
+              row.status === 0 || row.status === 3 || row.status === 4 ? '申请发布' : row.status === 1 ? '撤销申请' : ''
+            }}</span>
+            <span class="link danger" @click="deleteTemplate(row)">删除</span>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <PaginationPage ref="pagination" :total="total" @getList="queryTemplateList" />
+    </div>
+    <el-dialog
+      title="创建模板"
+      :visible="visible"
+      width="460px"
+      :close-on-click-modal="false"
+      class="add-chapter"
+      @close="dialogClose"
+    >
+      <el-form ref="form" :model="data" :rules="rules" label-width="80px">
+        <el-form-item label="模板名称" prop="name">
+          <el-input ref="name" v-model="data.name" placeholder="请输入模板名称" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button @click="dialogClose">取消</el-button>
+        <el-button type="primary" @click="addTemplate" :loading="loading">确定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import PaginationPage from '@/components/PaginationPage.vue';
+
+import { PageQueryTemplateListOrg } from '@/api/list.js';
+import { CreateTemplateOrg, UpdateTemplateStatus, DeleteTemplate } from '@/api/template';
+
+export default {
+  name: 'PersonalWorkbenchTemplateOrg',
+  components: {
+    PaginationPage,
+  },
+  data() {
+    return {
+      list: [],
+      total: 0,
+      cur_page_begin_index: 0,
+      status_list: [
+        {
+          value: -1,
+          label: '全部',
+        },
+        {
+          value: 0,
+          label: '草稿',
+        },
+        {
+          value: 1,
+          label: '申请发布',
+        },
+        {
+          value: 2,
+          label: '已发布',
+        },
+        {
+          value: 3,
+          label: '未发布',
+        },
+        {
+          value: 4,
+          label: '驳回发布申请',
+        },
+      ],
+      form: {
+        name: '',
+        status: -1,
+        page_capacity: 10,
+        cur_page: 1,
+      },
+      tableHeight: 0,
+      rules: {
+        name: [{ required: true, message: '请输入模板名称', trigger: 'blur' }],
+      },
+      data: {
+        name: '',
+      },
+      visible: false,
+      loading: false,
+    };
+  },
+  mounted() {
+    this.tableHeight =
+      document.getElementsByClassName('app-container')[0].clientHeight -
+      document.getElementById('query-form').clientHeight -
+      document.getElementsByClassName('el-pagination')[0].clientHeight -
+      10;
+  },
+  methods: {
+    queryTemplateList(data) {
+      this.form.page_capacity = data.page_capacity;
+      this.form.cur_page = data.cur_page;
+      PageQueryTemplateListOrg(this.form).then(({ total_count, template_list }) => {
+        this.total = total_count;
+        this.list = template_list;
+      });
+    },
+    queryList() {
+      this.queryTemplateList({ cur_page: 1, page_capacity: this.form.page_capacity });
+    },
+    // 关闭弹窗
+    dialogClose() {
+      this.visible = false;
+    },
+    // 确定创建模板
+    addTemplate() {
+      this.loading = true;
+      CreateTemplateOrg(this.data)
+        .then((res) => {
+          this.loading = false;
+          this.visible = false;
+          if (res.status === 1) {
+            this.$message({
+              type: 'success',
+              message: '创建成功!',
+            });
+            this.data = {
+              name: '',
+            };
+
+            this.queryList();
+          }
+        })
+        .catch(() => {
+          this.loading = false;
+        });
+    },
+    // 预览模板
+    previewTemplate(row) {},
+    //更改模板状态
+    changeStatusTemplate(row) {
+      let status = null;
+      if (row.status === 0 || row.status === 3 || row.status === 4) {
+        status = 1;
+      } else if (row.status === 1) {
+        status = 0;
+      }
+      UpdateTemplateStatus({ status: status, id: row.id }).then((res) => {
+        if (res.status === 1) {
+          this.$message({
+            type: 'success',
+            message: '设置成功!',
+          });
+          this.queryTemplateList({ cur_page: this.form.cur_page, page_capacity: this.form.page_capacity });
+        }
+      });
+    },
+    // 删除模板
+    deleteTemplate(row) {
+      this.$confirm('是否删除此模板？', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(() => {
+          DeleteTemplate({ id: row.id }).then((res) => {
+            if (res.status === 1) {
+              this.$message({
+                type: 'success',
+                message: '删除成功!',
+              });
+              this.queryTemplateList({ cur_page: this.form.cur_page, page_capacity: this.form.page_capacity });
+            }
+          });
+        })
+        .catch(() => {});
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@use '@/styles/mixin.scss' as *;
+
+.template {
+  @include page-base;
+  @include table-list;
+
+  #query-form {
+    display: flex;
+    gap: 10px;
+    align-items: center;
+    justify-content: space-between;
+
+    :deep .el-form-item--small.el-form-item {
+      margin-bottom: 5px;
+    }
+  }
+}
+</style>