From 090e9a1ea8e00a15ea663a6ecc5ad8d5dd62afe4 Mon Sep 17 00:00:00 2001
From: odjbin <1042039504@qq.com>
Date: Sat, 21 Sep 2024 18:19:17 +0800
Subject: [PATCH] =?UTF-8?q?feat=20:=20=E7=A0=94=E5=8F=91=E6=8A=95=E5=85=A5?=
 =?UTF-8?q?=E8=B5=84=E9=87=91crud=E5=8A=9F=E8=83=BD=E5=AE=8C=E6=88=90?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/research-fund/index.js     |  27 +++
 src/views/research-fund/add.vue    | 300 +++++++++++++++++++++++++++++
 src/views/research-fund/detail.vue |  13 ++
 src/views/research-fund/index.vue  | 106 +++++-----
 4 files changed, 394 insertions(+), 52 deletions(-)
 create mode 100644 src/api/research-fund/index.js
 create mode 100644 src/views/research-fund/add.vue
 create mode 100644 src/views/research-fund/detail.vue

diff --git a/src/api/research-fund/index.js b/src/api/research-fund/index.js
new file mode 100644
index 0000000..9470630
--- /dev/null
+++ b/src/api/research-fund/index.js
@@ -0,0 +1,27 @@
+import request from '@/utils/request.js'
+export const getResearchFundDetail = (rdFundId) => {
+  return request({
+    url: `/workflow/mosr/rd/${rdFundId}`,
+    method: "get"
+  });
+};
+export const addResearchFund= (data) => {
+  return request({
+    url: '/workflow/mosr/rd/add',
+    method: "post",
+    data
+  });
+};
+export const editResearchFund= (data) => {
+  return request({
+    url: '/workflow/mosr/rd/update',
+    method: "post",
+    data
+  });
+};
+export const deleteResearchFund = (rdFundIds) => {
+  return request({
+    url: `/workflow/mosr/rd/${rdFundIds}`,
+    method: "delete"
+  });
+};
diff --git a/src/views/research-fund/add.vue b/src/views/research-fund/add.vue
new file mode 100644
index 0000000..8e655c4
--- /dev/null
+++ b/src/views/research-fund/add.vue
@@ -0,0 +1,300 @@
+<template>
+  <div v-loading="loading" class="add-block">
+    <baseTitle title="研发资金信息录入"></baseTitle>
+    <el-form :model="formData" ref="fundForm" :rules="rules" label-width="130" style="margin-left: 5px;margin-bottom: -18px">
+      <el-row gutter="30">
+        <el-col :span="24" >
+          <el-form-item label="研发公司名称" :required="true" prop="" class="company-select">
+            <div style="width: 100%">
+              <el-button color="#DED0B2" @click="showCompany">{{ selectedCompanyList.length === 0 ? '请选择研发公司' : '更改' }}
+              </el-button>
+            </div>
+            <div :class="showExpendClass(showMoreCompany)">{{ getName(selectedCompanyList) }}</div>
+            <div style="color: #2a99ff;text-align: center;width: 100%;font-size: 15px;cursor: pointer"
+                 @click="handleExpend">
+              {{ showExpendText }}
+            </div>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="研发资金金额(元)" prop="rdAmount" >
+            <el-input
+                v-model="formData.rdAmount"
+                placeholder="请输入研发资金金额"
+                clearable
+                :formatter="(value) => value.replace(/\B(?=(\d{3})+(?!\d))/g, ',')"
+                :parser="(value) => value.replace(/\$\s?|(,*)+[^0-9.]/g, '')"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="研发资金日期" prop="rdDate">
+            <el-date-picker
+                v-model="formData.rdDate"
+                type="month"
+                format="YYYY-MM"
+                value-format="YYYY-MM"
+                placeholder="请选择研发资金日期"
+            >
+            </el-date-picker>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8" >
+          <el-form-item label="备注" prop="remarks">
+            <el-input v-model="formData.remarks" placeholder="请输入备注" clearable></el-input>
+          </el-form-item>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div class="oper-page-btn">
+      <el-button color="#DED0B2" v-if="routerName === 'Devfund/add'" @click="handleSubmit(fundForm)">提交</el-button>
+      <el-button color="#DED0B2" v-else @click="handleResubmit">重新提交</el-button>
+      <el-button @click="handleBack">返回</el-button>
+    </div>
+    <company-picker :multiple="false" ref="companyRef" title="请选择研发公司" @ok="sureSelectedCompany" @cancelOrClear="cancelSelectedCompany"
+                    v-model:value="selectedCompanyList"/>
+  </div>
+</template>
+
+<script setup lang="jsx">
+import {ElNotification} from "element-plus";
+import {addResearchFund, editResearchFund, getResearchFundDetail} from "@/api/research-fund";
+import {useTagsView} from '@/stores/tagsview.js'
+import {downloadFile, deleteFile} from "@/api/project-demand";
+
+const tagsViewStore = useTagsView()
+const router = useRouter()
+const route = useRoute()
+const loading = ref(false)
+const fundForm = ref()
+const companyRef = ref()
+const showMoreCompany = ref(false)
+const showExpendText = ref('')
+const selectedCompanyList = ref([])
+const formData = ref({})
+const routerName = ref(router.currentRoute.value.name)
+const rules = reactive({
+  rdAmount: [{required: true, message: '请输入研发资金金额', trigger: ['blur', 'change']}],
+  rdDate: [{required: true, message: '请选择研发资金日期', trigger: ['blur', 'change']}],
+})
+
+const getName = (list) => {
+  return list.map(item => item.label).join('，')
+}
+const showCompany = () => {
+  companyRef.value.show()
+}
+
+const sureSelectedCompany = (select) => {
+  if(select&&select.length>0){
+    formData.value.rdCompanyId = select[0].value
+    formData.value.rdCompany = select[0].label
+    selectedCompanyList.value = select
+  }
+}
+
+const cancelSelectedCompany=(select)=>{
+  console.info("🚀 ~ file:add method:cancelSelectedCompany line:287 -----", select)
+  formData.value.rdCompanyId =''
+  formData.value.rdCompany =''
+  selectedCompanyList.value = select
+}
+const handleExpend = () => {
+  showMoreCompany.value = !showMoreCompany.value;
+  showExpendClass(showMoreCompany.value)
+}
+
+const showExpendClass = (showMoreCompany) => {
+  if (!showMoreCompany) {
+    if (selectedCompanyList.value.length === 0) {
+      showExpendText.value = ''
+      return ''
+    } else if (selectedCompanyList.value.length > 14) {
+      showExpendText.value = '展开'
+      return 'company-style'
+    }
+  } else {
+    showExpendText.value = '收缩'
+    return ''
+  }
+}
+const handleDownload = (row) => {
+  downloadFile(row.fileId).then(res => {
+    const blob = new Blob([res])
+    let a = document.createElement('a')
+    a.href = URL.createObjectURL(blob)
+    a.download = row.originalFileName
+    a.click()
+  })
+}
+const handleDelete = (row) => {
+  deleteFile(row.fileId).then(res => {
+    ElNotification({
+      title: '提示',
+      message: res.msg,
+      type: res.code === 1000 ? 'success' : 'error'
+    })
+    if (res.code === 1000) {
+      formData.value.files.splice(formData.value.files.findIndex((item) => item.fileId === row.fileId), 1);
+    }
+  });
+}
+const handleBack = () => {
+  history.back()
+}
+
+const submitParam = (item) => {
+  return {
+    rdCompanyId: item.rdCompanyId,
+    rdCompany: item.rdCompany,
+    rdAmount: item.rdAmount,
+    rdDate: item.rdDate,
+    remarks: item.remarks,
+  }
+}
+const handleSubmit = async (instance) => {
+  if (!instance) return
+  instance.validate(async (valid) => {
+    if (!valid) {
+      ElNotification({
+        title: '提示',
+        message: '请完善数据,再提交!',
+        type: 'error'
+      })
+      return;
+    }
+    console.info("🚀 ~method:'formData.value.rdCompanyId -----", formData.value.rdCompanyId)
+    if (!formData.value.rdCompanyId) {
+      ElNotification({
+        title: '提示',
+        message: '请选择研发公司',
+        type: 'error'
+      })
+      return;
+    }
+    const {msg, code} = await addResearchFund(submitParam(formData.value))
+    ElNotification({
+      title: '提示',
+      message: msg,
+      type: code === 1000 ? 'success' : 'error'
+    })
+    if (code === 1000) {
+      tagsViewStore.delVisitedViews(router.currentRoute.value.path)
+      await router.push({
+        name: 'Dev'
+      })
+    }
+  })
+}
+const handleResubmit = () => {
+  if (!route.query.id) return
+  let params = {
+    rdFundId: route.query.id,
+    ...submitParam(formData.value)
+  }
+  editResearchFund(params).then(res => {
+    ElNotification({
+      title: '提示',
+      message: res.msg,
+      type: res.code === 1000 ? 'success' : 'error'
+    })
+    if (res.code === 1000) {
+      tagsViewStore.delVisitedViews(router.currentRoute.value.path)
+      router.push({
+        name: 'Dev'
+      })
+    }
+  })
+}
+const getDetailInfo = async () => {
+  getResearchFundDetail(route.query.id).then(res => {
+    if (res.code === 1000) {
+      console.info("🚀 ~method:res.data -----", res.data)
+      if (res.data.rdCompanyId == -1) {
+        selectedCompanyList.value = [
+          {
+            value: -1,
+            label: '所有公司'
+          }
+        ]
+      } else {
+        selectedCompanyList.value = [ {
+          value: res.data.rdCompanyId,
+          label: res.data.rdCompany
+        }]
+      }
+      formData.value = res.data
+    }else{
+      ElNotification({
+        title: '提示',
+        message: res.msg,
+        type: 'error'
+      })
+    }
+  })
+}
+onMounted(async () => {
+  loading.value = true
+  if (route.query.id) {
+    await getDetailInfo()
+  }
+  loading.value = false
+})
+</script>
+
+<style scoped lang="scss">
+.company-select {
+  :deep(.el-form-item__content .el-select__wrapper ) {
+    width: 750px;
+  }
+
+  .company-style {
+    //width: 98%;
+    min-height: 30px;
+    max-height: 60px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    -webkit-line-clamp: 2;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+  }
+
+  .company {
+    color: #fff;
+    height: auto;
+  }
+}
+:deep(.el-table--fit ) {
+  height: 300px !important;
+}
+
+.add-block {
+  padding: 0 30px;
+}
+
+:deep(.el-input-number) {
+  width: 88.5%;
+  .el-input__wrapper{
+    padding: 1px 11px!important;
+  }
+  .el-input__inner {
+    text-align: left;
+  }
+}
+
+:deep(.el-table__header) {
+  .is-leaf:first-child {
+    .cell {
+      margin-left: -20px !important;
+    }
+  }
+}
+
+:deep(.el-table__body) {
+  .el-table__cell:first-child {
+    .cell {
+      margin-left: -10px !important;
+    }
+  }
+}
+</style>
diff --git a/src/views/research-fund/detail.vue b/src/views/research-fund/detail.vue
new file mode 100644
index 0000000..d526321
--- /dev/null
+++ b/src/views/research-fund/detail.vue
@@ -0,0 +1,13 @@
+<template>
+
+</template>
+
+<script>
+export default {
+  name: "detail"
+}
+</script>
+
+<style scoped>
+
+</style>
diff --git a/src/views/research-fund/index.vue b/src/views/research-fund/index.vue
index 0f91849..d78c4e8 100644
--- a/src/views/research-fund/index.vue
+++ b/src/views/research-fund/index.vue
@@ -1,5 +1,6 @@
 <template>
-  <fvSearchForm :searchConfig="researchFundSearchConfig" @search="searchResearchFund" style="margin-left: 16px"></fvSearchForm>
+  <fvSearchForm :searchConfig="researchFundSearchConfig" @search="searchResearchFund"
+                style="margin-left: 16px"></fvSearchForm>
   <fvTable ref="tableIns" :tableConfig="researchFundTableConfig" @headBtnClick="headBtnClick">
     <template #empty>
       <el-empty description="暂无数据"/>
@@ -8,46 +9,49 @@
 </template>
 
 <script setup lang="jsx">
-import { ElNotification} from "element-plus";
-import {deleteAllocation} from "@/api/expense-manage";
+import {ElNotification} from "element-plus";
+import {deleteResearchFund} from "@/api/research-fund";
+import { getSubCompOpt } from '@/api/user/user.js';
 
 const router = useRouter();
-const researchFundSearchConfig = reactive([
+const researchFundSearchConfig = ref([
   {
-    label: '公司名称',
-    prop: 'afterTax',
+    label: '研发公司名称',
+    prop: 'rdCompanyId',
+    component: 'el-tree-select',
+    props: {
+      placeholder: '请输入研发公司名称查询',
+      clearable: true,
+      data: [],
+      filterable: true,
+      checkStrictly: true,
+      remote: true
+    }
+  },
+  {
+    label: '研发资金金额',
+    prop: 'rdAmount',
     component: 'el-input',
     props: {
-      placeholder: '请输入公司名称查询',
+      placeholder: '请输入研发资金金额查询',
       clearable: true,
       filterable: true,
       checkStrictly: true
     }
   },
   {
-    label: '时间',
-    prop: 'apportionmentMonth',
+    label: '研发资金日期',
+    prop: 'rdDate',
     component: 'el-date-picker',
     props: {
-      placeholder: '请选择时间',
+      placeholder: '请选择研发资金日期',
       clearable: true,
-      type:'month',
+      type: 'month',
       format: 'YYYY-MM',
-      valueFormat:"YYYY-MM"
+      valueFormat: "YYYY-MM"
     },
     colProps: {}
   },
-  {
-    label: '金额',
-    prop: 'afterTax',
-    component: 'el-input',
-    props: {
-      placeholder: '请输入金额查询',
-      clearable: true,
-      filterable: true,
-      checkStrictly: true
-    }
-  },
 ])
 const tableIns = ref()
 const researchFundTableConfig = reactive({
@@ -57,40 +61,40 @@ const researchFundTableConfig = reactive({
       type: 'index',
       label: '序号',
       align: 'center',
-      width:85,
+      width: 85,
       index: index => {
         return (tableIns.value.getQuery().pageNum - 1) * tableIns.value.getQuery().pageSize + index + 1
       }
     },
     {
-      prop: 'shareName',
-      label: '公司名称',
+      prop: 'rdCompany',
+      label: '研发公司名称',
       align: 'center'
     },
     {
-      prop: 'apportionmentMonth',
-      label: '时间',
+      prop: 'rdAmount',
+      label: '研发资金金额',
       align: 'center'
     },
     {
-      prop: 'generationTime',
-      label: '金额',
+      prop: 'rdDate',
+      label: '研发资金日期',
+      align: 'center'
+    },
+    {
+      prop: 'remarks',
+      label: '备注',
       align: 'center'
     },
     {
       prop: 'oper',
       label: '操作',
       align: 'center',
-      fixed:'right',
+      fixed: 'right',
       showOverflowTooltip: false,
       currentRender: ({row, index}) => {
         let btn = []
-        let buttons
-        if (row.buttons) {
-          buttons = new Set(Array.from(row.buttons))
-        }
-          btn.push({label: '详情', prem: ['mosr:requirement:info'], func: () => handleDetail(row), type: 'primary'})
-          btn.push({label: '编辑', prem: ['mosr:requirement:resubmit'], func: () => handleEdit(row), type: 'primary'})
+        btn.push({label: '编辑', func: () => handleEdit(row), type: 'primary'})
         return (
             <div style={{width: '100%'}}>
               {
@@ -106,8 +110,8 @@ const researchFundTableConfig = reactive({
                 ))
               }
               {
-                    <popover-delete name={row.shareName} type={'研发投入资金'} btnType={'danger'}
-                                    onDelete={() => handleDelete(row)}/>
+                <popover-delete name={row.rdCompany} type={'研发投入资金'} btnType={'danger'}
+                                onDelete={() => handleDelete(row)}/>
 
               }
             </div>
@@ -115,7 +119,7 @@ const researchFundTableConfig = reactive({
       }
     }
   ],
-  api: '',
+  api: '/workflow/mosr/rd/list',
   btns: [
     {name: '新增', key: 'add', color: '#DED0B2'}
   ],
@@ -140,28 +144,20 @@ const headBtnClick = (key) => {
 }
 const handleAdd = () => {
   router.push({
-    name: 'Share/add',
+    name: 'Devfund/add',
     query: {}
   })
 }
-const handleDetail = (row) => {
-  router.push({
-    name: 'Share/detail',
-    query: {
-      id: row.allocationId
-    }
-  })
-}
 const handleEdit = (row) => {
   router.push({
-    name: 'Share/edit',
+    name: 'Devfund/edit',
     query: {
-      id: row.allocationId
+      id: row.rdFundId
     }
   })
 }
 const handleDelete = (row) => {
-  deleteAllocation(row.allocationId).then(res => {
+  deleteResearchFund(row.rdFundId).then(res => {
     ElNotification({
       title: '提示',
       message: res.msg,
@@ -172,6 +168,12 @@ const handleDelete = (row) => {
     }
   });
 }
+const init = async () => {
+  const res = await getSubCompOpt()
+  researchFundSearchConfig.value.find(item=>item.prop == 'rdCompanyId').props.data = res.data
+}
+
+init()
 </script>
 
 <style scoped lang="scss">