Newer
Older
KaiFengPC / src / views / project / projectInformation / components / payCont.vue
@zhangdeliang zhangdeliang on 23 May 5 KB 初始化项目
  1. <template>
  2. <div class="water-analysis-page">
  3. <div class="top">
  4. <div class="LeftBox1">
  5. <el-progress
  6. type="circle"
  7. :percentage="DetailData.paymentRatio"
  8. :width="150"
  9. style="margin: 10px 10px 20px 100px"
  10. :stroke-width="20"
  11. striped
  12. striped-flow
  13. />
  14. <!-- <p class="HTNo">{{ DetailData.projectTypeName }}</p> -->
  15. <div style="width: 380px; display: flex">
  16. <div class="HTMoney1">
  17. <div class="JENum">{{ DetailData.contractAmount }}<span style="font-size: 14px">(万元)</span></div>
  18. <div class="JEName">合同金额</div>
  19. </div>
  20. <div class="HTMoney1">
  21. <div class="JENum">
  22. {{ DetailData.paymentMoney ? DetailData.paymentMoney : '--' }}<span style="font-size: 14px">(万元)</span>
  23. </div>
  24. <div class="JEName">已支付金额</div>
  25. </div>
  26. </div>
  27. </div>
  28. <el-table :data="postList" @selection-change="handleSelectionChange">
  29. <el-table-column style="folat: right" label="序号" type="index" width="80" />
  30. <el-table-column :label="i.label" :prop="i.props" show-overflow-tooltip v-for="i in payContCloum">
  31. <template #default="{ row }" v-if="i.props == 'contractType'">
  32. <dict-tag :options="contract_type" :value="row.contractType" />
  33. </template>
  34. <template #default="{ row }" v-if="i.props == 'signTime'">
  35. {{ row.signTime?.substring(0, 10) }}
  36. </template>
  37. <template #default="{ row }" v-if="i.props == 'paidMoney'"> {{ row.paidMoney || 0 }}(万元) </template>
  38. <template #default="{ row }" v-if="i.props == 'notPaidMoney'"> {{ row.notPaidMoney || 0 }}(万元) </template>
  39. <template #default="{ row }" v-if="i.props == 'money'"> {{ row.money || 0 }}(万元) </template>
  40. <template #default="{ row }" v-if="i.props == 'ratio'"> {{ row.ratio || 0 }}% </template>
  41. <template #default="{ row }" v-if="i.props == 'contractType'">
  42. <dict-tag :options="contract_type" :value="row.contractType" />
  43. </template>
  44. </el-table-column>
  45. </el-table>
  46. </div>
  47. </div>
  48. </template>
  49. <script setup>
  50. import { getProjectStatistics, projectContractPage } from '@/api/project/tenderReview';
  51. import { projectInfoAdd, projectTypeList, projectCompany, getUserProfile, userList } from '@/api/project/projectInformation';
  52. import { payContCloum } from '@/utils/cloums';
  53. const { proxy } = getCurrentInstance();
  54. const { contract_type } = proxy.useDict('contract_type');
  55. const emits = defineEmits();
  56. const typeList = inject('typeList1');
  57. const postList = ref([]);
  58. const project_TypeId = ref([]);
  59. const unit_list = ref([]);
  60. const personList = ref([]);
  61. const FormList = ref({
  62. pageNum: 1,
  63. pageSize: 10,
  64. });
  65. const DetailData = ref({});
  66. const submit = () => {
  67. proxy.$refs.ruleForm.validate(valid => {
  68. if (valid) {
  69. // let { dealUsers, pushUsers } = FormList.value;
  70. // if (dealUsers?.length > 0 && Array.isArray(dealUsers)) {
  71. // FormList.value.dealUsers = dealUsers?.join(",");
  72. // }
  73. // if (pushUsers?.length > 0 && Array.isArray(pushUsers)) {
  74. // FormList.value.pushUsers = pushUsers.join(",");
  75. // }
  76. FormList.value.content = JSON.stringify([FormList.value.content[0], { type: 'new', projectInfo: { ...FormList.value } }]);
  77. console.log(JSON.stringify(FormList.value.content));
  78. console.log(FormList.value, 'typeListtypeList');
  79. if (typeList.type == 3) {
  80. FormList.value.operation = 'add';
  81. projectInfoAdd(FormList.value).then(({ code }) => {
  82. if (code == 200) {
  83. emits('onModalClose');
  84. proxy.$refs.ruleForm.resetFields();
  85. }
  86. });
  87. } else if (typeList.type == 5) {
  88. FormList.value.operation = 'update';
  89. projectInfoAdd(FormList.value).then(({ code }) => {
  90. if (code == 200) {
  91. emits('onModalClose');
  92. proxy.$refs.ruleForm.resetFields();
  93. }
  94. });
  95. }
  96. }
  97. });
  98. };
  99. function closeds() {
  100. proxy.$refs.ruleForm.resetFields();
  101. }
  102. defineExpose({ submit, closeds });
  103. const projectTypeListM = async () => {
  104. let { data } = await projectTypeList();
  105. project_TypeId.value = data;
  106. };
  107. const projectCompanyM = async () => {
  108. let { data } = await projectCompany();
  109. unit_list.value = data;
  110. };
  111. const getUserProfileM = async () => {
  112. let { data } = await getUserProfile();
  113. // unit_list.value = data
  114. };
  115. const userListM = async () => {
  116. let { data } = await userList();
  117. personList.value = data;
  118. FormList.value = typeList.value;
  119. };
  120. //获取合同
  121. const getProjectStatisticsM = async id => {
  122. let { data } = await getProjectStatistics(id);
  123. DetailData.value = data;
  124. };
  125. const projectContractPageM = async p => {
  126. let { data } = await projectContractPage(p);
  127. postList.value = data;
  128. };
  129. onMounted(() => {
  130. projectTypeListM();
  131. projectCompanyM();
  132. userListM();
  133. getProjectStatisticsM(typeList.value.projectNo);
  134. projectContractPageM({ projectNo: typeList.value.projectNo, pageSize: 99999, pageNum: 1 });
  135. });
  136. </script>
  137. <style lang="scss" scoped>
  138. .water-analysis-page {
  139. padding: 20px;
  140. .top {
  141. display: flex;
  142. }
  143. }
  144. .LeftBox1 {
  145. width: 280px;
  146. margin-right: 30px;
  147. height: 100%;
  148. float: left;
  149.  
  150. .HTNo {
  151. width: 340px;
  152. // text-align: center;
  153. font-size: 16px;
  154. }
  155.  
  156. .HTMoney1 {
  157. width: 170px;
  158. height: 60px;
  159. float: left;
  160. display: inline-block;
  161. text-align: center;
  162.  
  163. .JENum {
  164. width: 100%;
  165. height: 40px;
  166. font-size: 18px;
  167. font-weight: 400;
  168. color: #409eff;
  169. }
  170.  
  171. .JEName {
  172. width: 100%;
  173. height: 40px;
  174. font-size: 16px;
  175. color: black;
  176. }
  177. }
  178. }
  179. </style>