移动端
Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.
 
 

431 řádky
15 KiB

  1. <template>
  2. <div class="app-container">
  3. <van-nav-bar
  4. left-arrow
  5. fixed
  6. placeholder
  7. @click-left="$router.back(-1)"
  8. >
  9. <template #title>
  10. <p style="font-weight: bold;">查看母子转账申请</p>
  11. </template>
  12. <template #right>
  13. <van-icon name="../../../static/images/icon/icon_flow.png" size="20" @click="goFlow"/>
  14. </template>
  15. </van-nav-bar>
  16. <p class="main_title">基础信息</p>
  17. <div class="main_box">
  18. <van-field readonly label="申请时间" v-model="form.applyDate" input-align="right" />
  19. <van-field readonly label="资金支出类别" v-model="capitalExpenditureType" input-align="right" label-width="auto" />
  20. <van-field readonly label="支出总金额" v-model="form.expenditureAmount" input-align="right" label-width="auto"/>
  21. </div>
  22. <div class="main_box" style="margin-top: 10px;">
  23. <van-field readonly label="付款事由" v-model="form.remark" type="textarea" input-align="right" rows="3" label-width="auto"/>
  24. </div>
  25. <div class="main_box" style="margin-top: 10px;">
  26. <van-field readonly label="说明情况" v-model="form.explainSituation" type="textarea" input-align="right" rows="3" label-width="auto"/>
  27. </div>
  28. <p class="main_title">付款方信息</p>
  29. <div class="main_box">
  30. <van-field readonly label="付款方" v-model="form.payer" input-align="right" label-width="auto"/>
  31. <van-field readonly label="付款方账户" v-model="form.payerAccount" input-align="right" label-width="auto"/>
  32. </div>
  33. <div class="main_box" v-if="capitalExpenditureOpen" style="margin-bottom: 10px;margin-top: 10px;position:relative;">
  34. <van-field readonly label="项目名称" v-model="projectForm.projectName" input-align="right" />
  35. <van-field readonly label="承建单位" v-model="projectForm.projectContractor" input-align="right" label-width="auto"/>
  36. <van-field readonly label="合同价款(元)" v-model="projectForm.projectAmount" input-align="right" label-width="auto"/>
  37. <van-field readonly label="工程款类型" v-model="projectFundType" input-align="right" />
  38. <van-field readonly label="工程发票号" v-model="projectForm.projectBillNum" input-align="right" label-width="auto"/>
  39. </div>
  40. <p class="main_title">列表信息</p>
  41. <div class="main_box" style="margin-bottom: 15px;">
  42. <van-field readonly label="收款账户类型" v-model="form.accountType == 1 ? '公户':'私户'" input-align="right" label-width="auto" />
  43. </div>
  44. <div :style="{position:'relative',padding: index == 0 ? '':'10px 0 0 0'}" v-for="(item, index) in chargeItme" :key="index">
  45. <div class="main_box" style="margin-bottom: 10px;position:relative;">
  46. <van-field readonly label="收款方" v-model="item.payee" input-align="right" />
  47. <van-field readonly label="收款账户" v-model="item.payeeAccount" input-align="right" label-width="auto"/>
  48. <van-field readonly label="开户银行" v-model="item.bankDeposit" input-align="right" label-width="auto"/>
  49. <van-field readonly label="收入金额" v-model="item.incomeAmount" input-align="right" label-width="auto"/>
  50. <van-field readonly label="所属银行" v-model="item.bankTypeText" input-align="right" />
  51. </div>
  52. </div>
  53. <p class="main_title">上传附件</p>
  54. <div class="main_box" style="padding: 5px 0 0 8px;">
  55. <van-uploader v-model="fileList" :after-read="beforeRead" :deletable="false" disabled :upload-text="'未上传附件'"></van-uploader>
  56. </div>
  57. </div>
  58. </template>
  59. <script>
  60. import { getTransfer , queryTransferDetail , listPayee , updateTransfer , getProjectto , listProject , addProjectto , customSubmit} from "@/api/onlineHome/bankAgriculture/paymentApproval";
  61. import request from '@/utils/request'
  62. import {attachmentList, commonAttach} from "../../../../api/onlineHome/bankAgriculture/paymentApproval";
  63. export default {
  64. name: "approvalDetail",
  65. data() {
  66. return {
  67. showcapital:false,
  68. showpayee:false,
  69. showlasj:false,
  70. showbankType:false,
  71. showproject:false,
  72. showFundType:false,
  73. minDate: new Date(),
  74. maxDate: new Date(2025, 10, 1),
  75. currentDate: new Date(),
  76. form:{},
  77. fileList:[],
  78. capitalExpenditureType:'',
  79. payee:'',
  80. bankType:'',
  81. wfydlxDictionaries:[],
  82. jglxDictionaries:[],
  83. sysDictionaries:[],
  84. capitalExpenditureTypeOptions:[],
  85. bankTypeDictionaries:[],
  86. projectList:[],
  87. projectFundTypeOptions:[],
  88. projectFundTypeDictionaries:[],
  89. projectListShow:[],
  90. chargeItme:[],
  91. chargeItmeShow:[],
  92. payeeList:[],
  93. // 查询参数
  94. queryParams: {
  95. transferType:"",
  96. orderByColumn: "id",
  97. isAsc: "desc",
  98. },
  99. capitalExpenditureOpen:false,
  100. projectForm:{
  101. projectId:null,
  102. projectName:null,
  103. projectContractor:null,
  104. projectAmount:null,
  105. projectBillNum:null,
  106. projectFundType:'1',
  107. outId:null,
  108. ynType:'1'
  109. },
  110. projectFundType:''
  111. };
  112. },
  113. created() {
  114. let queryParams={
  115. pageNum: 1,
  116. pageSize: 100,
  117. }
  118. listProject(queryParams).then(response => {
  119. console.log(response)
  120. this.projectList = response.rows;
  121. for (var i = 0; i < response.rows.length; i++) {
  122. this.projectListShow.push({text: response.rows[i].projectName, value: response.rows[i].id});
  123. }
  124. });
  125. this.getDicts("project_fund_type").then((response) => {
  126. for (var i = 0; i < response.data.length; i++) {
  127. this.projectFundTypeOptions.push({text: response.data[i].dictLabel, value: response.data[i].dictValue});
  128. }
  129. this.projectFundTypeDictionaries = response.data;
  130. });
  131. this.getDictionaries();
  132. this.getFileList();
  133. },
  134. methods: {
  135. goFlow(){
  136. window.location='approvalProcess?id='+this.$route.query.id;
  137. },
  138. getDictionaries(){
  139. getTransfer(this.$route.query.id).then((response) => {
  140. this.getDicts("capital_expenditure_type").then((res) => {
  141. for (var i = 0; i < res.data.length; i++) {
  142. this.capitalExpenditureTypeOptions.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
  143. }
  144. this.capitalExpenditureType = this.selectDictLabel(res.data, response.data.capitalExpenditureType);
  145. });
  146. if(response.data.capitalExpenditureType==2){
  147. this.capitalExpenditureOpen = true
  148. let param={
  149. 'outId' : response.data.id,
  150. 'ynType' : '1'
  151. }
  152. getProjectto(param).then(res => {
  153. this.projectFundType = this.selectDictLabel(this.projectFundTypeDictionaries, res.data.projectFundType);
  154. this.projectForm = res.data
  155. })
  156. }else{
  157. this.showproject = false
  158. }
  159. this.form = response.data;
  160. });
  161. queryTransferDetail(this.$route.query.id).then((response) => {
  162. this.getDicts("bank_type").then(res => {
  163. for (var i = 0; i < res.data.length; i++) {
  164. this.bankTypeDictionaries.push({text: res.data[i].dictLabel, value: res.data[i].dictValue});
  165. }
  166. for (var j = 0 ; j < response.rows.length ; j++){
  167. response.rows[j].bankTypeText = this.selectDictLabel(res.data, response.rows[j].bankType);
  168. }
  169. this.chargeItme = response.rows;
  170. });
  171. this.getPayeeList();
  172. });
  173. },
  174. addChargeItme(index){
  175. this.chargeItme.splice(index + 1, 0, {
  176. payeeId: "", //收款方ID
  177. payee: "", //收款方
  178. payeeAccount: "", //收款账户
  179. bankDeposit: "", //开户银行
  180. incomeAmount: "", //收入金额
  181. bankType: "", //所属银行
  182. });
  183. },
  184. getPayeeList() {
  185. //普通转账
  186. this.queryParams.accountType = this.form.accountType
  187. this.queryParams.status = "0"
  188. listPayee(this.queryParams).then((response) => {
  189. for (var i = 0; i < response.rows.length; i++) {
  190. this.payeeList.push({text: response.rows[i].payee, value: response.rows[i].id});
  191. }
  192. });
  193. },
  194. payeeDictLabel(datas, value) {
  195. var actions = [];
  196. Object.keys(datas).some((key) => {
  197. if (datas[key].payeeId == ('' + value)) {
  198. actions.push(datas[key].payee);
  199. return true;
  200. }
  201. })
  202. return actions.join('');
  203. },
  204. onConfirmCapital(data){
  205. console.log(data)
  206. if (data.value != 2){
  207. this.capitalExpenditureOpen = false;
  208. this.projectForm = [];
  209. }else{
  210. this.capitalExpenditureOpen = true;
  211. }
  212. this.capitalExpenditureType = data.text;
  213. this.form.capitalExpenditureType = data.value;
  214. this.showcapital = false;
  215. },
  216. onConfirmFundType(data){
  217. console.log(data)
  218. this.projectForm.projectFundType = data.value;
  219. this.projectFundType = data.text;
  220. this.showFundType = false;
  221. },
  222. onConfirmProject(data){
  223. console.log(data)
  224. this.projectList.map(res => {
  225. console.log(res)
  226. if(res.projectName==data.text){
  227. this.projectForm.projectId = res.id
  228. this.projectForm.projectName = res.projectName
  229. this.projectForm.projectContractor = res.projectContractor
  230. this.projectForm.projectAmount = res.projectAmount
  231. console.log(this.projectForm)
  232. }
  233. })
  234. this.showproject = false;
  235. },
  236. onConfirmPayee(data){
  237. // this.chargeItme[this.chargeItme.length-1].payeeText = data.text;
  238. this.chargeItme[this.chargeItme.length-1].payee = data.text;
  239. this.chargeItme[this.chargeItme.length-1].payeeId = data.value;
  240. console.log(this.chargeItme)
  241. this.showpayee = false;
  242. },
  243. onConfirmBankType(data){
  244. console.log(this.chargeItme)
  245. this.chargeItme[this.chargeItme.length-1].bankTypeText = data.text;
  246. this.chargeItme[this.chargeItme.length-1].bankType = data.value;
  247. this.showbankType = false;
  248. },
  249. onConfirmLasj(data){
  250. this.form.applyDate = this.getNowFormatDate(data).substr(0,10);
  251. this.showlasj = false;
  252. },
  253. accountTypeChange(e){
  254. console.log(e)
  255. this.payeeList = [];
  256. this.queryParams.accountType = this.form.accountType
  257. this.queryParams.status = "0"
  258. listPayee(this.queryParams).then((response) => {
  259. for (var i = 0; i < response.rows.length; i++) {
  260. this.payeeList.push({text: response.rows[i].payee, value: response.rows[i].id});
  261. }
  262. });
  263. },
  264. goAdd(){
  265. if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
  266. this.$toast.error("付款事由禁止包含|。");
  267. return;
  268. }
  269. if(this.form.capitalExpenditureType==2){
  270. if(this.projectForm.projectName==""||this.projectForm.projectName==null){
  271. this.$toast.error('请选择项目名称!');
  272. return;
  273. }
  274. if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
  275. this.$toast.error('请输入工程发票号!');
  276. return;
  277. }
  278. }
  279. this.$set(this.form, "payeeList", this.chargeItme);
  280. this.$set(this.form, "bankTypeList", this.chargeItme);
  281. this.$set(this.form, "accountTypeList", this.chargeItme);
  282. this.$set(this.form, "transferStatusList", this.chargeItme);
  283. updateTransfer(this.form).then(response => {
  284. this.projectForm.outId = this.form.id
  285. this.$set(this.projectForm, "ynType", '1');
  286. if(this.form.capitalExpenditureType==2){
  287. addProjectto(this.projectForm).then(res => {
  288. customSubmit(this.form.id).then(res => {
  289. this.$toast.success('提交成功');
  290. setTimeout(function(){
  291. history.go(-1)
  292. },2000)
  293. })
  294. })
  295. }else{
  296. customSubmit(this.form.id).then(res => {
  297. this.$toast.success('提交成功');
  298. setTimeout(function(){
  299. history.go(-1)
  300. },2000)
  301. })
  302. }
  303. });
  304. },
  305. goUpdate(){
  306. if(this.form.remark != null && this.form.remark.indexOf("|")!=-1){
  307. this.$toast.error("付款事由禁止包含|。");
  308. return;
  309. }
  310. if(this.form.capitalExpenditureType==2){
  311. if(this.projectForm.projectName==""||this.projectForm.projectName==null){
  312. this.$toast.error('请选择项目名称!');
  313. return;
  314. }
  315. if(this.projectForm.projectBillNum==""||this.projectForm.projectBillNum==null){
  316. this.$toast.error('请输入工程发票号!');
  317. return;
  318. }
  319. }
  320. this.$set(this.form, "payeeList", this.chargeItme);
  321. this.$set(this.form, "bankTypeList", this.chargeItme);
  322. this.$set(this.form, "accountTypeList", this.chargeItme);
  323. this.$set(this.form, "transferStatusList", this.chargeItme);
  324. this.projectForm.outId = this.form.id
  325. updateTransfer(this.form).then((response) => {
  326. this.projectForm.outId = this.form.id
  327. this.$set(this.projectForm, "ynType", '1');
  328. if(this.form.capitalExpenditureType==2){
  329. addProjectto(this.projectForm).then(res => {
  330. this.$toast.success('修改成功');
  331. setTimeout(function(){
  332. history.go(-1)
  333. },2000)
  334. })
  335. }else{
  336. this.$toast.success('修改成功');
  337. setTimeout(function(){
  338. history.go(-1)
  339. },2000)
  340. }
  341. });
  342. },
  343. beforeRead(file) {
  344. this.uploadFiles.push(file.file);
  345. },
  346. deleteFile(file){
  347. this.uploadFiles.map((response,index) => {
  348. if(file.file == response){
  349. this.uploadFiles.splice(index,1)
  350. }
  351. })
  352. },
  353. getFileList(){
  354. let oData= {
  355. tableId: this.$route.query.id,
  356. tableName: "t_yinnong_transfer",
  357. bizPath: "upload",
  358. fileType: "0",
  359. }
  360. attachmentList(oData).then(res => {
  361. console.log(res)
  362. console.log(location.protocol+"//"+location.host+request.defaults.baseURL)
  363. res.rows.map(r => {
  364. let baseUrl = location.protocol+"//"+location.host+request.defaults.baseURL
  365. this.fileList.push({"url":baseUrl + r.fileUrl,"file":new File([],r.fileName,{})})
  366. console.log(r)
  367. })
  368. })
  369. },
  370. goBack(){
  371. window.history.go(-1)
  372. },
  373. //删除家庭成员
  374. deleteChargeItme(index){
  375. this.chargeItme.splice(index,1)
  376. },
  377. },
  378. }
  379. </script>
  380. <style scoped lang="scss">
  381. .app-container {
  382. padding: 2% 0;
  383. }
  384. .main_title{
  385. font-size: 0.4rem;
  386. color: #1D6FE9;
  387. margin: 0.2rem 6%;
  388. position: relative;
  389. }
  390. .main_box{
  391. width: 96%;
  392. margin: 0 auto;
  393. border-radius: 6px;
  394. box-shadow: 0px 3px 6px 0px rgba(0,0,0,0.16);
  395. overflow: hidden;
  396. background-color: #FFF;
  397. }
  398. .submitButton{
  399. width: 80%;
  400. margin: 0 auto;
  401. background-color: #1D6FE9;
  402. }
  403. .addFamily{
  404. position: absolute;
  405. top: -2px;
  406. right: 0;
  407. border-radius: 50%;
  408. }
  409. .deleteFamily{
  410. position: absolute;
  411. top: 0rem;
  412. right: 6%;
  413. z-index: 9;
  414. border-radius: 50%;
  415. }
  416. </style>