ent-edit.vue 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545
  1. <template>
  2. <div class="app-container" v-loading="loading">
  3. <el-form ref="form" :model="form" :rules="rules" label-width="180px">
  4. <table class="table_register" style="width: 100%;">
  5. <tr>
  6. <th colspan="4" class="th_title">项目基本信息</th>
  7. </tr>
  8. <tr>
  9. <th><span style="color: red;">*</span>加计扣除年度</th>
  10. <td>
  11. <el-form-item prop="projectYear" label-width="0">
  12. <el-select v-model="form.projectYear" filterable :disabled="disabledVisible">
  13. <el-option v-for="(item, index) in yearsOptions" :key="index" :value="item.dictValue" :label="item.dictLabel"></el-option>
  14. </el-select>
  15. </el-form-item>
  16. </td>
  17. <th><span style="color: red;">*</span>研发成果</th>
  18. <td>
  19. <el-form-item prop="developFlag" label-width="0">
  20. <el-select v-model="form.developFlag" filterable :disabled="disabledVisible">
  21. <el-option v-for="(item, index) in successOptions" :key="index" :value="item.dictValue" :label="item.dictLabel"></el-option>
  22. </el-select>
  23. </el-form-item>
  24. </td>
  25. </tr>
  26. <tr>
  27. <th><span style="color: red;">*</span>项目名称</th>
  28. <td>
  29. <el-form-item prop="projectName" label-width="0">
  30. <el-input v-model="form.projectName" placeholder="请输入项目名称" :disabled="disabledVisible"></el-input>
  31. </el-form-item>
  32. </td>
  33. <th><span style="color: red;">*</span>立项时间</th>
  34. <td>
  35. <el-form-item prop="projectDate" label-width="0">
  36. <el-date-picker :disabled="disabledVisible"
  37. v-model="form.projectDate"
  38. type="date"
  39. value-format="yyyy-MM-dd"
  40. placeholder="选择日期">
  41. </el-date-picker>
  42. </el-form-item>
  43. </td>
  44. </tr>
  45. <tr>
  46. <th><span style="color: red;">*</span>起止时间</th>
  47. <td>
  48. <el-form-item prop="projectTime" label-width="0">
  49. <!-- <el-input id="inputUI" v-model="form.projectTime" style="width: 220px"></el-input> -->
  50. <el-input @focus="getLayDate" id="projectTime" v-model="form.projectTime" clearable :disabled="disabledVisible"></el-input>
  51. </el-form-item>
  52. </td>
  53. <th><span style="color: red;">*</span>项目类型</th>
  54. <td>
  55. <el-form-item prop="projectType" label-width="0">
  56. <el-select v-model="form.projectType" filterable :disabled="disabledVisible">
  57. <el-option v-for="(item, index) in projectTypeOptions" :key="index" :value="item.dictValue" :label="item.dictLabel"></el-option>
  58. </el-select>
  59. </el-form-item>
  60. </td>
  61. </tr>
  62. </table>
  63. <table class="table_register mt20" style="width: 100%;">
  64. <tr>
  65. <th colspan="4" class="th_title">项目负责人及研发人员
  66. <!-- <div class="tool"> -->
  67. <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="addFunc" style="margin-left: 10px" v-if="!disabledVisible">新增</el-button>
  68. <!-- </div> -->
  69. </th>
  70. </tr>
  71. <tr v-if="!disabledVisible">
  72. <td colspan="4">
  73. <el-table :data="form.headAddVOList" border>
  74. <el-table-column label="姓名" prop="name" align="center" width="120">
  75. <template slot-scope="scope">
  76. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.name'">
  77. <el-input v-model="scope.row.name"></el-input>
  78. </el-form-item>
  79. </template>
  80. </el-table-column>
  81. <el-table-column label="性别" prop="sex" align="center" width="120">
  82. <template slot-scope="scope">
  83. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.sex'">
  84. <!-- <el-input v-model="scope.row.sex"></el-input> -->
  85. <el-select v-model="scope.row.sex">
  86. <el-option value="男">男</el-option>
  87. <el-option value="女">女</el-option>
  88. </el-select>
  89. </el-form-item>
  90. </template>
  91. </el-table-column>
  92. <el-table-column label="身份证号" prop="idNumber" align="center" width="180">
  93. <template slot-scope="scope">
  94. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.idNumber'">
  95. <el-input v-model="scope.row.idNumber"></el-input>
  96. </el-form-item>
  97. </template>
  98. </el-table-column>
  99. <el-table-column label="年龄" prop="age" align="center" width="80">
  100. <template slot-scope="scope">
  101. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.age'">
  102. <el-input v-model="scope.row.age"></el-input>
  103. </el-form-item>
  104. </template>
  105. </el-table-column>
  106. <el-table-column label="学历" prop="education" align="center" width="150">
  107. <template slot-scope="scope">
  108. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.education'">
  109. <!-- <el-input v-model="scope.row.education"></el-input> -->
  110. <el-select v-model="scope.row.education">
  111. <el-option value="小学">小学</el-option>
  112. <el-option value="初中">初中</el-option>
  113. <el-option value="高中">高中</el-option>
  114. <el-option value="专科">专科</el-option>
  115. <el-option value="本科">本科</el-option>
  116. <el-option value="硕士研究生">硕士</el-option>
  117. <el-option value="博士">博士</el-option>
  118. </el-select>
  119. </el-form-item>
  120. </template>
  121. </el-table-column>
  122. <el-table-column label="所学专业" prop="major" align="center" width="150">
  123. <template slot-scope="scope">
  124. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.major'">
  125. <el-input v-model="scope.row.major"></el-input>
  126. </el-form-item>
  127. </template>
  128. </el-table-column>
  129. <el-table-column label="现从事专业" prop="currentMajor" align="center" width="150">
  130. <template slot-scope="scope">
  131. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.currentMajor'">
  132. <el-input v-model="scope.row.currentMajor"></el-input>
  133. </el-form-item>
  134. </template>
  135. </el-table-column>
  136. <el-table-column label="职称" prop="jobTitle" align="center" width="150">
  137. <template slot-scope="scope">
  138. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.jobTitle'">
  139. <el-input v-model="scope.row.jobTitle"></el-input>
  140. </el-form-item>
  141. </template>
  142. </el-table-column>
  143. <el-table-column label="部门" prop="dept" align="center" width="150">
  144. <template slot-scope="scope">
  145. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.dept'">
  146. <el-input v-model="scope.row.dept"></el-input>
  147. </el-form-item>
  148. </template>
  149. </el-table-column>
  150. <el-table-column label="在本项目中承担工作" prop="responsibilities" align="center" width="150">
  151. <template slot-scope="scope">
  152. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.responsibilities'">
  153. <el-input v-model="scope.row.responsibilities"></el-input>
  154. </el-form-item>
  155. </template>
  156. </el-table-column>
  157. <el-table-column label="联系电话" prop="contactNumber" align="center" width="150">
  158. <template slot-scope="scope">
  159. <el-form-item label-width="0" :prop="'headAddVOList.'+scope.$index+'.contactNumber'">
  160. <el-input v-model="scope.row.contactNumber"></el-input>
  161. </el-form-item>
  162. </template>
  163. </el-table-column>
  164. <el-table-column label="操作" align="center" width="150">
  165. <template slot-scope="scope">
  166. <el-button v-if="!scope.row.disabled" type="text" class="danger" @click="delProcess(scope.$index)">移除
  167. </el-button>
  168. </template>
  169. </el-table-column>
  170. </el-table>
  171. </td>
  172. </tr>
  173. <tr v-if="disabledVisible">
  174. <td colspan="4">
  175. <el-table :data="form.headAddVOList" border>
  176. <el-table-column label="姓名" prop="name" align="center" width="120">
  177. </el-table-column>
  178. <el-table-column label="性别" prop="sex" align="center" width="80">
  179. </el-table-column>
  180. <el-table-column label="身份证号" prop="idNumber" align="center" width="180">
  181. </el-table-column>
  182. <el-table-column label="年龄" prop="age" align="center" width="80">
  183. </el-table-column>
  184. <el-table-column label="学历" prop="education" align="center" width="80">
  185. </el-table-column>
  186. <el-table-column label="所学专业" prop="major" align="center" width="150">
  187. </el-table-column>
  188. <el-table-column label="现从事专业" prop="currentMajor" align="center" width="150">
  189. </el-table-column>
  190. <el-table-column label="职称" prop="jobTitle" align="center" width="150">
  191. </el-table-column>
  192. <el-table-column label="部门" prop="dept" align="center" width="150">
  193. </el-table-column>
  194. <el-table-column label="在本项目中承担工作" prop="responsibilities" align="center" width="150">
  195. </el-table-column>
  196. <el-table-column label="联系电话" prop="contactNumber" align="center" width="150">
  197. </el-table-column>
  198. </el-table>
  199. </td>
  200. </tr>
  201. </table>
  202. <table class="table_register mt20" style="width: 100%;">
  203. <tr>
  204. <th colspan="4" class="th_title">项目所属技术领域</th>
  205. </tr>
  206. <tr>
  207. <td colspan="4">
  208. <el-form-item prop="technicalFieldArray" label-width="0">
  209. <el-checkbox-group v-model="form.technicalFieldArray" :disabled="disabledVisible">
  210. <el-checkbox v-for="(item, index) in techScopeOptions" :label="item.dictLabel" :key="item.dictValue" :name="item.dictLabel">{{item.dictLabel}}</el-checkbox>
  211. </el-checkbox-group>
  212. </el-form-item>
  213. </td>
  214. </tr>
  215. </table>
  216. <table class="table_register mt20" style="width: 100%;">
  217. <tr>
  218. <th colspan="4" class="th_title">技术来源</th>
  219. </tr>
  220. <tr>
  221. <td colspan="4">
  222. <el-form-item prop="technicalSourceArray" label-width="0">
  223. <el-checkbox-group v-model="form.technicalSourceArray" :disabled="disabledVisible">
  224. <el-checkbox v-for="(item, index) in techSourceOptions" :label="item.dictLabel" :key="item.dictValue" :name="item.dictLabel">{{item.dictLabel}}</el-checkbox>
  225. </el-checkbox-group>
  226. </el-form-item>
  227. </td>
  228. </tr>
  229. </table>
  230. <table class="table_register mt20" style="width: 100%;">
  231. <tr>
  232. <th colspan="4" class="th_title">项目开发形式</th>
  233. </tr>
  234. <tr>
  235. <td colspan="4">
  236. <el-form-item prop="technicalFormArray" label-width="0">
  237. <el-checkbox-group v-model="form.technicalFormArray" :disabled="disabledVisible">
  238. <el-checkbox v-for="(item, index) in devOptions" :label="item.dictLabel" :key="item.dictValue" :name="item.dictLabel">{{item.dictLabel}}</el-checkbox>
  239. </el-checkbox-group>
  240. </el-form-item>
  241. </td>
  242. </tr>
  243. </table>
  244. <table class="table_register mt20" style="width: 100%;">
  245. <tr>
  246. <th colspan="4" class="th_title">新兴产业信息</th>
  247. </tr>
  248. <tr>
  249. <th><span style="color: red;">*</span>战略新兴产业</th>
  250. <td>
  251. <el-form-item prop="industry" label-width="0">
  252. <el-radio-group v-model="form.industry" :disabled="disabledVisible">
  253. <el-radio v-for="(item, index) in booleanOptions" :key="index" :label="item.dictValue">{{item.dictLabel}}</el-radio>
  254. </el-radio-group>
  255. </el-form-item>
  256. </td>
  257. <template v-if="form.industry">
  258. <th><span style="color: red;">*</span>所属新兴产业领域</th>
  259. <td>
  260. <el-form-item prop="industryType" label-width="0">
  261. <el-select v-model="form.industryType" filterable :disabled="disabledVisible">
  262. <el-option v-for="(item, index) in industryTypeOptions" :key="index" :value="item.dictValue" :label="item.dictLabel"></el-option>
  263. </el-select>
  264. </el-form-item>
  265. </td>
  266. </template>
  267. </tr>
  268. </table>
  269. <template v-if="type == 'update'">
  270. <el-row :gutter="40" v-if="!disabledVisible">
  271. <el-col :span="24">
  272. <el-form-item style="width:100%;text-align: center;" label-width="0px" class="mt20">
  273. <el-button :loading="loading" size="medium" type="primary" @click.native.prevent="submitForm" style="width: 100px;">保存</el-button>
  274. <el-button size="medium" type="primary" style="width: 100px;" @click="cancel">取消</el-button>
  275. </el-form-item>
  276. </el-col>
  277. </el-row>
  278. </template>
  279. </el-form>
  280. </div>
  281. </template>
  282. <script>
  283. import { editProjectApi,getProjectInfoApi,synTechApi,draftApi,yearApi,declareUpdateApi,devProjectApi } from "@/api/enterprise/project/project"
  284. import { techScopeOptions,yesOrNoOptions,businessIndustryOptions,techSourceOptions,devOptions,successOptions,projectTypeOptions,booleanOptions,industryTypeOptions } from "@/utils/dataFormat"
  285. import FileUpload from '@/components/FileUpload'
  286. import { listEntUserApi } from "@/api/ent/ent"
  287. import { validAmount,validNumber,validPercentage} from '@/utils/validate'
  288. export default {
  289. name: "First",
  290. components: {
  291. FileUpload
  292. },
  293. props: {
  294. type: {
  295. type: String
  296. },
  297. info: {
  298. type: Object,
  299. default: function () {
  300. return {}
  301. }
  302. },
  303. },
  304. computed: {
  305. userType() {
  306. return this.$store.state.user.userType
  307. },
  308. tempVariable() {
  309. let invest = this.form.techInvest
  310. let sales = this.form.sales
  311. return {invest, sales}
  312. },
  313. roleTypeFlag() {
  314. let roleType = this.$store.state.user.userType
  315. return ['ENT_ADMIN_TECH', 'ENT_ADMIN_FIN', 'ENT_FIN'].includes(roleType) //判断是否为技术负责人,财务负责人
  316. }
  317. },
  318. mounted() {
  319. let laydate = window.laydate;
  320. laydate.render({
  321. elem: '#inputUI', // 输入框的id属性,用来绑定到dom
  322. type: 'date',
  323. range: true,
  324. done: (value) => {
  325. this.form.projectTime = value; // 将选中的值赋给组件中的变量
  326. }
  327. });
  328. },
  329. data() {
  330. return {
  331. options: businessIndustryOptions,
  332. disabledVisible: false,
  333. adminId: undefined,
  334. techId: undefined,
  335. finId: undefined,
  336. serviceDate: [],
  337. provinceName: '',
  338. cityName: '',
  339. districtName: '',
  340. codeUrl: "",
  341. industryTypeOptions: industryTypeOptions,
  342. techScopeOptions: techScopeOptions,
  343. techSourceOptions: techSourceOptions,
  344. devOptions: devOptions,
  345. yesOrNoOptions: yesOrNoOptions,
  346. successOptions: successOptions,
  347. projectTypeOptions: projectTypeOptions,
  348. booleanOptions: booleanOptions,
  349. yearsOptions: [],
  350. provinceDataList: [],
  351. cityDataList: [],
  352. districtDataList: [],
  353. form: {
  354. industryType: 1,
  355. industry: false,
  356. technicalFieldArray: [],
  357. technicalSourceArray: [],
  358. technicalFormArray: [],
  359. projectTime: "",
  360. id: undefined,
  361. entId: undefined,
  362. projectOwner: 2,
  363. projectStartDate: '',
  364. projectEndDate: '',
  365. headAddVOList: [],
  366. projectYear: '',
  367. projectDate: '',
  368. projectName: '',
  369. projectType: '',
  370. projectTime: '',
  371. developFlag: true
  372. },
  373. rules: {
  374. projectYear: [
  375. { required: true, trigger: "change", message: "请选择加计扣除年度" }
  376. ],
  377. developFlag: [
  378. { required: true, trigger: "change", message: "请选择研发成果" }
  379. ],
  380. projectName: [
  381. { required: true, trigger: "blur", message: "请填写项目名称" }
  382. ],
  383. projectDate: [
  384. { required: true, trigger: "[blur,change]", message: "请选择立项时间" }
  385. ],
  386. projectTime: [
  387. { required: true, trigger: "[blur,change]", message: "请选择起止时间" }
  388. ],
  389. projectType: [
  390. { required: true, trigger: "change", message: "请选择项目类型" }
  391. ],
  392. industry: [
  393. { required: true, trigger: "change", message: "请选择战略新兴产业" }
  394. ],
  395. industryType: [
  396. { required: true, trigger: "change", message: "请选择所属新兴产业领域" }
  397. ],
  398. },
  399. loading: false,
  400. captchaOnOff: true
  401. };
  402. },
  403. created() {
  404. this.$nextTick(() => {
  405. this.$refs.form.clearValidate()
  406. })
  407. this.form.id = this.$route.query.id || undefined;
  408. this.form.entId = this.$route.query.entId || undefined;
  409. this.getYears()
  410. //如果是财务、科技
  411. if(this.roleTypeFlag) {
  412. this.disabledVisible = true
  413. }else {
  414. this.disabledVisible = false
  415. }
  416. if(this.type == 'view') {
  417. this.disabledVisible = true
  418. }
  419. },
  420. methods: {
  421. delProcess(index) {
  422. this.form.headAddVOList.splice(index, 1)
  423. },
  424. getYears(){
  425. let optionsArray = new Array();
  426. let years= new Date().getFullYear();
  427. for(var i=years;i>=years-9;i--){
  428. let anOption = {};
  429. anOption.dictValue=i;
  430. anOption.dictLabel=i;
  431. optionsArray.push(anOption);
  432. }
  433. this.yearsOptions = optionsArray;
  434. },
  435. addFunc() {
  436. this.form.headAddVOList.push({
  437. name: "",
  438. sex: "",
  439. idNumber: "",
  440. age: "",
  441. education: "",
  442. major: "",
  443. currentMajor: "",
  444. jobTitle: "",
  445. dept: "",
  446. responsibilities: "",
  447. contactNumber: ""
  448. })
  449. },
  450. getLayDate(){
  451. let _self = this
  452. laydate.render({
  453. elem: '#projectTime', // 输入框的id属性,用来绑定到dom
  454. type: 'date',
  455. range: true,
  456. done: (value) => {
  457. _self.form.projectTime = value; // 将选中的值赋给组件中的变量
  458. }
  459. })
  460. },
  461. handleSuccess(file) {
  462. this.$refs.techLicenseUpload.clearValidate()
  463. this.form.techLicense = file.url;
  464. this.form.fileName = file.name;
  465. },
  466. cancel() {
  467. this.$store.dispatch("tagsView/delView", this.$route); // 关闭当前tab
  468. this.$router.go(-1);
  469. },
  470. //保存年度信息
  471. submitForm() {
  472. this.$refs.form.validate(valid => {
  473. if(valid) {
  474. this.loading = true
  475. this.form.technicalField = this.form.technicalFieldArray.join(',')
  476. this.form.technicalSource = this.form.technicalSourceArray.join(',')
  477. this.form.technicalForm = this.form.technicalFormArray.join(',')
  478. if(this.form.projectTime) {
  479. this.form.projectStartDate = this.form.projectTime.split('至')[0].trim()
  480. this.form.projectEndDate = this.form.projectTime.split('至')[1].trim()
  481. }else {
  482. this.form.projectStartDate = ''
  483. this.form.projectEndDate = ''
  484. }
  485. declareUpdateApi(this.form).then(res => {
  486. this.$alert('企业研发项目情况保存成功', '提示', {
  487. confirmButtonText: '确定',
  488. callback: action => {
  489. this.loading = false
  490. this.$store.dispatch("tagsView/delView", this.$route);
  491. this.$router.go(-1);
  492. }
  493. })
  494. })
  495. }
  496. })
  497. }
  498. },
  499. watch: {
  500. 'tempVariable'(val) {
  501. if(val.invest && val.sales) {
  502. this.form.techRate = ((val.invest / val.sales)*100).toFixed(2)
  503. }
  504. },
  505. info: {
  506. immediate: true,
  507. handler (obj) {
  508. if(obj) {
  509. this.form = Object.assign({}, this.form, obj)
  510. // this.form.projectDate = infoObj.projectDate
  511. // this.form.projectType = infoObj.projectType + ''
  512. // this.form.projectYear = infoObj.projectYear
  513. // this.form.projectName = infoObj.projectName
  514. // this.form.developFlag = infoObj.developFlag
  515. // this.form.headAddVOList = infoObj.headAddVOList || []
  516. // this.form.industry = infoObj.industry
  517. this.form.fileName = '高新证书'
  518. // let arr = ['电子信息']
  519. // this.$set(this.form, 'techScopeArray', arr)
  520. if(obj.technicalField) {
  521. this.form.technicalFieldArray = obj.technicalField.split(',') || []
  522. }
  523. if(obj.technicalSource) {
  524. this.form.technicalSourceArray = obj.technicalSource.split(',') || []
  525. }
  526. if(obj.technicalForm) {
  527. this.form.technicalFormArray = obj.technicalForm.split(',') || []
  528. }
  529. if(obj.projectStartDate && obj.projectEndDate) {
  530. this.form.projectTime = obj.projectStartDate + ' 至 ' + obj.projectEndDate
  531. }
  532. }
  533. }
  534. },
  535. }
  536. };
  537. </script>