新增模板

src/views/performanceIndicator/templateContent/addTemplate.vue

@@ -0,0 +1,121 @@
+<template>
+  <a-modal v-model:open="visible" :title="title" @ok="handleOk" @cancel="closeModal" width="50%">
+    <div style="margin: 20px">
+      <a-form :model="form" layout="vertical" ref="formRef" :rules="rules">
+        <a-row :gutter="[16, 16]">
+          <a-col :span="24">
+            <a-form-item label="考核名称" name="name">
+              <a-input v-model:value="form.name" placeholder="请输入" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="[16, 16]">
+          <a-col :span="24">
+            <a-form-item label="上级指导处" name="superLeader">
+              <a-input v-model:value="form.superLeader" placeholder="请输入" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="[16, 16]">
+          <a-col :span="24">
+            <a-form-item label="责任单位" name="dutyWorkplace">
+              <a-input v-model:value="form.dutyWorkplace" placeholder="请输入" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="[16, 16]">
+          <a-col :span="24">
+            <a-form-item label="模板" name="file">
+              <a-upload v-model:file-list="fileLists" :before-upload="beforeUpload" :multiple="false" :maxCount="1">
+                <a-button type="primary"> 上传 </a-button>
+              </a-upload>
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+    </div>
+  </a-modal>
+</template>
+
+<script>
+  import { reactive, ref } from 'vue';
+  import { message } from 'ant-design-vue';
+  import { addPerformance } from './templateContent.api';
+  import { useGlobSetting } from '@/hooks/setting';
+  import { getToken } from '@/utils/auth';
+  export default {
+    setup(props, { emit }) {
+      const title = ref('新增');
+      const formRef = ref();
+      const visible = ref(false);
+      const form = reactive({
+        file: '',
+        name: '',
+        superLeader: '',
+        dutyWorkplace: '',
+      });
+      const fileLists = ref([]);
+      const showModal = () => {
+        visible.value = true;
+      };
+      const rules = {
+        name: [{ required: true, message: '请输入' }],
+        superLeader: [{ required: true, message: '请输入' }],
+        dutyWorkplace: [{ required: true, message: '请输入' }],
+      };
+      const beforeUpload = async (file) => {
+        console.log(file);
+        form.file = file;
+        return false;
+      };
+      const handleOk = () => {
+        formRef.value.validate().then((valid) => {
+          if (valid) {
+            if(fileLists.value.length>0){
+            let params = {};
+            params.file = form.file;
+            params.performance = {
+              name: form.name,
+              superLeader: form.superLeader,
+              dutyWorkplace: form.dutyWorkplace,
+            };
+            params.name = params.name
+            addPerformance(params).then((_) => {
+              message.success('新增成功');
+              emit('success');
+              closeModal();
+            });
+            }else{
+              message.warning('请上传模板')
+            }
+          }
+        });
+      };
+      const closeModal = () => {
+        formRef.value.resetFields();
+        fileLists.value = [];
+        visible.value = false;
+      };
+      return {
+        visible,
+        title,
+        form,
+        showModal,
+        handleOk,
+        formRef,
+        closeModal,
+        rules,
+        fileLists,
+        beforeUpload,
+      };
+    },
+  };
+</script>
+
+<style scoped>
+  /* 可选样式调整 */
+  .ant-modal-body {
+    max-width: 600px;
+    margin: 0 auto;
+  }
+</style>

src/views/performanceIndicator/templateContent/index.vue

@@ -1,57 +1,59 @@
 <template>
-  
   <PageWrapper dense>
     <!--引用表格-->
     <BasicTable @register="registerTable">
+      <template #tableTitle>
+        <el-button type="primary" @click="handleAdd" v-if="isShowByRoles('projectContact')">
+          新增模板</el-button
+        >
+      </template>
       <template #action="{ record }">
-              <TableAction :actions="getTableAction(record)" />
+        <TableAction :actions="getTableAction(record)" />
-          </template>
+      </template>
     </BasicTable>
     <detailTemplateContent @register="registerDetail" />
-    <modify @register="registerModify" @close="closeModel"/>
+    <modify @register="registerModify" @close="closeModel" />
+    <addTemplate ref="addTemplateRef" @success="reload()" />
   </PageWrapper>
-
 </template>
 
 <script lang="ts" name="planSummary" setup>
-//ts语法
+  //ts语法
-import {  BasicTable,  useTable ,ActionItem,TableAction} from '@/components/Table';
+  import { BasicTable, useTable, ActionItem, TableAction } from '@/components/Table';
-import { PageWrapper } from '@/components/Page';
+  import { PageWrapper } from '@/components/Page';
-import {  useModal } from '@/components/Modal';
+  import { useModal } from '@/components/Modal';
-
+  import { ref } from 'vue';
-import { isShowByRoles } from '@/views/projectLib/projectInfo/projectInfo.api';
+  import { isShowByRoles } from '@/views/projectLib/projectInfo/projectInfo.api';
-import detailTemplateContent from './detailTemplateContent.vue'
+  import detailTemplateContent from './detailTemplateContent.vue';
-import modify from './modify.vue'
+  import modify from './modify.vue';
-import { PerformanColumns } from './templateContent.data';
+  import { PerformanColumns } from './templateContent.data';
-import { getPerforman } from './templateContent.api'
+  import { getPerforman } from './templateContent.api';
-const [registerDetail, { openModal: openModalDetail }] = useModal();
+  import addTemplate from './addTemplate.vue';
-const [registerModify, { openModal: openModalModify, closeModal: closeModalModify }] = useModal();
+  const [registerDetail, { openModal: openModalDetail }] = useModal();
-
+  const [registerModify, { openModal: openModalModify, closeModal: closeModalModify }] = useModal();
 
-const [registerTable,{reload}] = useTable({
+  const [registerTable, { reload }] = useTable({
-  api: getPerforman,
+    api: getPerforman,
-  columns: PerformanColumns,
+    columns: PerformanColumns,
-  useSearchForm: false,
+    useSearchForm: false,
-  pagination:false,
+    pagination: false,
-  actionColumn: {
+    actionColumn: {
-    width: 140,
+      width: 140,
-    title: '操作',
+      title: '操作',
-    dataIndex: 'action',
+      dataIndex: 'action',
-    slots: { customRender: 'action' },
+      slots: { customRender: 'action' },
-  },
+    },
-  afterFetch: (data) => {
+    afterFetch: (data) => {},
-  },
+    //表单查询项设置
-  //表单查询项设置
+    // formConfig: {
-  // formConfig: {
+    //   schemas: searchFormSchema,
-  //   schemas: searchFormSchema,
+    // }
-  // }
+  });
-
+  function getTableAction(record): ActionItem[] {
-});
+    return [
-function getTableAction(record): ActionItem[] {
-  return [
       {
-          label: '详情',
+        label: '详情',
-          onClick: handledetail.bind(null, record),
+        onClick: handledetail.bind(null, record),
       },
       // {
       //     label: '修改',
@@ -60,22 +62,25 @@ function getTableAction(record): ActionItem[] {
       //     },
       //     onClick: handleModify.bind(null, record),
       // },
-  ];
+    ];
-}
+  }
-function handledetail(record) {
+  function handledetail(record) {
-  openModalDetail(true,{type:record.type})
+    openModalDetail(true, { type: record.type });
-  console.log(record)
+    console.log(record);
-}
+  }
-// function handleModify(record) {
+  // function handleModify(record) {
-//   openModalModify(true,{type:record.type})
+  //   openModalModify(true,{type:record.type})
-//   console.log(record)
+  //   console.log(record)
-// }
+  // }
-function closeModel() {
+  function closeModel() {
-  closeModalModify()
+    closeModalModify();
-  reload()
+    reload();
-}
+  }
+  //新增模板
+  const addTemplateRef = ref();
+  function handleAdd() {
+    addTemplateRef.value.showModal()
+  }
 </script>
 
-<style scoped>
+<style scoped></style>
-
-</style>

src/views/performanceIndicator/templateContent/templateContent.api.ts

@@ -5,6 +5,7 @@ export enum Api {
   importPerformancescore = '/huzhouPerformancescore/importPerformancescore',
   getPerformancescore = '/huzhouPerformancescore/getPerformancescore',
   getPerforman="/huzhouPerformancescore/getPerforman",
+  addPerformance="/huzhouPerformancescore/addPerformance",
 
 }
 
@@ -15,5 +16,5 @@ export const importPerformancescore =  (params?) =>defHttp.post({ url: Api.impor
 
 export const getPerformancescore = (params?) => defHttp.get({ url: Api.getPerformancescore, params });
 export const getPerforman = (params?) => defHttp.get({ url: Api.getPerforman, params });
-
+export const addPerformance = (params?) => defHttp.post({ url: Api.addPerformance, headers: { 'Content-Type': 'multipart/form-data' },params });
 

src/views/projectLib/projectPlan/addProjectDate.vue

@@ -1,5 +1,4 @@
 <template>
-
   <a-modal v-model:open="visible" :title="title" @ok="handleOk" @cancel="closeModal" width="50%">
       <div style="margin:20px">
     <a-form :model="form" layout="vertical" ref="formRef" :rules="rules">