wuye / webui

Commit 1a2232b932677e0c8f316b6df15d1d518320dd20

Authored by wuxw
1 parent d68ff4b5

v1.9 优化缺少合同申请详情页面

Inline Side-by-side
Showing 5 changed files with 845 additions and 1 deletions
src/i18n/contractI18n.js
  View file @1a2232b
@@ -15,6 +15,7 @@ import { messages as contractChangeAuditOrdersMessages } from '../views/contract @@ -15,6 +15,7 @@ import { messages as contractChangeAuditOrdersMessages } from '../views/contract
15 import { messages as contractApplyAuditHistoryOrdersMessages } from '../views/contract/contractApplyAuditHistoryOrdersLang' 15 import { messages as contractApplyAuditHistoryOrdersMessages } from '../views/contract/contractApplyAuditHistoryOrdersLang'
16 import { messages as contractChangeAuditHistoryOrdersMessages } from '../views/contract/contractChangeAuditHistoryOrdersLang' 16 import { messages as contractChangeAuditHistoryOrdersMessages } from '../views/contract/contractChangeAuditHistoryOrdersLang'
17 import { messages as contractDetailChangeMessages } from '../views/contract/contractDetailChangeLang' 17 import { messages as contractDetailChangeMessages } from '../views/contract/contractDetailChangeLang'
  18 +import { messages as contractApplyDetailMessages } from '../views/contract/contractApplyDetailLang'
18 19
19 export const messages ={ 20 export const messages ={
20 en:{ 21 en:{
@@ -35,6 +36,7 @@ export const messages ={ @@ -35,6 +36,7 @@ export const messages ={
35 ...contractApplyAuditHistoryOrdersMessages.en, 36 ...contractApplyAuditHistoryOrdersMessages.en,
36 ...contractChangeAuditHistoryOrdersMessages.en, 37 ...contractChangeAuditHistoryOrdersMessages.en,
37 ...contractDetailChangeMessages.en, 38 ...contractDetailChangeMessages.en,
  39 + ...contractApplyDetailMessages.en,
38 }, 40 },
39 zh:{ 41 zh:{
40 ...contractTypeManageMessages.zh, 42 ...contractTypeManageMessages.zh,
@@ -54,5 +56,6 @@ export const messages ={ @@ -54,5 +56,6 @@ export const messages ={
54 ...contractApplyAuditHistoryOrdersMessages.zh, 56 ...contractApplyAuditHistoryOrdersMessages.zh,
55 ...contractChangeAuditHistoryOrdersMessages.zh, 57 ...contractChangeAuditHistoryOrdersMessages.zh,
56 ...contractDetailChangeMessages.zh, 58 ...contractDetailChangeMessages.zh,
  59 + ...contractApplyDetailMessages.zh,
57 } 60 }
58 } 61 }
59 \ No newline at end of file 62 \ No newline at end of file
src/router/contractRouter.js
  View file @1a2232b
@@ -73,5 +73,10 @@ export default [ @@ -73,5 +73,10 @@ export default [
73 path:'/pages/admin/contractChangeAuditHistoryOrders', 73 path:'/pages/admin/contractChangeAuditHistoryOrders',
74 name:'/pages/admin/contractChangeAuditHistoryOrders', 74 name:'/pages/admin/contractChangeAuditHistoryOrders',
75 component: () => import('@/views/contract/contractChangeAuditHistoryOrdersList.vue') 75 component: () => import('@/views/contract/contractChangeAuditHistoryOrdersList.vue')
76 - }, 76 + },
  77 + {
  78 + path: '/views/contract/contractApplyDetail',
  79 + name: '/views/contract/contractApplyDetail',
  80 + component: () => import('@/views/contract/contractApplyDetail.vue')
  81 + },
77 ] 82 ]
78 \ No newline at end of file 83 \ No newline at end of file
src/views/contract/contractApplyDetail.md 0 → 100644
  View file @1a2232b
  1 +```html
  2 +<div>
  3 + <div class="row">
  4 + <div class="col-lg-12">
  5 + <div class="ibox ">
  6 + <div class="ibox-title">
  7 + <h5>
  8 + <span><vc:i18n name="合同信息" namespace="contractApplyDetail"></vc:i18n></span>
  9 + </h5>
  10 + <div class="ibox-tools" style="top:10px;">
  11 + <button type="button" class="btn btn-primary btn-sm" v-on:click="_printContract()">
  12 + <i class="fa fa-print"></i>
  13 + <vc:i18n name="打印"></vc:i18n>
  14 + </button>
  15 + <button type="button" class="btn btn-primary btn-sm" v-on:click="_goback()">
  16 + <i class="fa fa-close"></i>
  17 + <vc:i18n name="返回"></vc:i18n>
  18 + </button>
  19 + </div>
  20 + </div>
  21 + <div class="ibox-content">
  22 + <div class="row">
  23 + <div class="col-sm-4">
  24 + <div class="form-group">
  25 + <label class="col-form-label">
  26 + <span><vc:i18n name="合同名称" namespace="contractApplyDetail"></vc:i18n></span>：
  27 + </label>
  28 + <label class="">{{contractDetailInfo.contractName}}</label>
  29 + </div>
  30 + </div>
  31 + <div class="col-sm-4">
  32 + <div class="form-group">
  33 + <label class="col-form-label">
  34 + <span><vc:i18n name="合同编号" namespace="contractApplyDetail"></vc:i18n></span>：
  35 + </label>
  36 + <label class="">{{contractDetailInfo.contractCode}}</label>
  37 + </div>
  38 + </div>
  39 + <div class="col-sm-4">
  40 + <div class="form-group">
  41 + <label class="col-form-label">
  42 + <span><vc:i18n name="合同类型" namespace="contractApplyDetail"></vc:i18n></span>：
  43 + </label>
  44 + <label class="">{{contractDetailInfo.contractTypeName}}</label>
  45 + </div>
  46 + </div>
  47 + </div>
  48 + <div class="row">
  49 + <div class="col-sm-4">
  50 + <div class="form-group">
  51 + <label class="col-form-label">
  52 + <span><vc:i18n name="甲方" namespace="contractApplyDetail"></vc:i18n></span>：
  53 + </label>
  54 + <label class="">{{contractDetailInfo.partyA}}</label>
  55 + </div>
  56 + </div>
  57 + <div class="col-sm-4">
  58 + <div class="form-group">
  59 + <label class="col-form-label">
  60 + <span><vc:i18n name="甲方联系人" namespace="contractApplyDetail"></vc:i18n></span>：
  61 + </label>
  62 + <label class="">{{contractDetailInfo.aContacts}}</label>
  63 + </div>
  64 + </div>
  65 + <div class="col-sm-4">
  66 + <div class="form-group">
  67 + <label class="col-form-label">
  68 + <span><vc:i18n name="甲方联系电话" namespace="contractApplyDetail"></vc:i18n></span>：
  69 + </label>
  70 + <label class="">{{contractDetailInfo.aLink}}</label>
  71 + </div>
  72 + </div>
  73 + </div>
  74 + <div class="row">
  75 + <div class="col-sm-4">
  76 + <div class="form-group">
  77 + <label class="col-form-label">
  78 + <span><vc:i18n name="乙方" namespace="contractApplyDetail"></vc:i18n></span>：
  79 + </label>
  80 + <label class="">{{contractDetailInfo.partyB}}</label>
  81 + </div>
  82 + </div>
  83 + <div class="col-sm-4">
  84 + <div class="form-group">
  85 + <label class="col-form-label">
  86 + <span><vc:i18n name="乙方联系人" namespace="contractApplyDetail"></vc:i18n></span>：
  87 + </label>
  88 + <label class="">{{contractDetailInfo.bContacts}}</label>
  89 + </div>
  90 + </div>
  91 + <div class="col-sm-4">
  92 + <div class="form-group">
  93 + <label class="col-form-label">
  94 + <span><vc:i18n name="乙方联系电话" namespace="contractApplyDetail"></vc:i18n></span>：
  95 + </label>
  96 + <label class="">{{contractDetailInfo.bLink}}</label>
  97 + </div>
  98 + </div>
  99 + </div>
  100 + <div class="row">
  101 + <div class="col-sm-4">
  102 + <div class="form-group">
  103 + <label class="col-form-label">
  104 + <span><vc:i18n name="经办人" namespace="contractApplyDetail"></vc:i18n></span>：
  105 + </label>
  106 + <label class="">{{contractDetailInfo.operator}}</label>
  107 + </div>
  108 + </div>
  109 + <div class="col-sm-4">
  110 + <div class="form-group">
  111 + <label class="col-form-label">
  112 + <span><vc:i18n name="联系电话" namespace="contractApplyDetail"></vc:i18n></span>：
  113 + </label>
  114 + <label class="">{{contractDetailInfo.operatorLink}}</label>
  115 + </div>
  116 + </div>
  117 + <div class="col-sm-4">
  118 + <div class="form-group">
  119 + <label class="col-form-label">
  120 + <span><vc:i18n name="合同金额" namespace="contractApplyDetail"></vc:i18n></span>：
  121 + </label>
  122 + <label class="">{{contractDetailInfo.amount}}</label>
  123 + </div>
  124 + </div>
  125 + </div>
  126 + <div class="row">
  127 + <div class="col-sm-4">
  128 + <div class="form-group">
  129 + <label class="col-form-label">
  130 + <span><vc:i18n name="开始时间" namespace="contractApplyDetail"></vc:i18n></span>：
  131 + </label>
  132 + <label class="">{{contractDetailInfo.startTime}}</label>
  133 + </div>
  134 + </div>
  135 + <div class="col-sm-4">
  136 + <div class="form-group">
  137 + <label class="col-form-label">
  138 + <span><vc:i18n name="结束时间" namespace="contractApplyDetail"></vc:i18n></span>：
  139 + </label>
  140 + <label class="">{{contractDetailInfo.endTime}}</label>
  141 + </div>
  142 + </div>
  143 + <div class="col-sm-4">
  144 + <div class="form-group">
  145 + <label class="col-form-label">
  146 + <span><vc:i18n name="签订时间" namespace="contractApplyDetail"></vc:i18n></span>：
  147 + </label>
  148 + <label class="">{{contractDetailInfo.signingTime}}</label>
  149 + </div>
  150 + </div>
  151 + </div>
  152 + <div class="row">
  153 + <div class="col-sm-10">
  154 + <div class="form-group">
  155 + <label class="col-form-label">
  156 + <span><vc:i18n name="相关附件" namespace="contractApplyDetail"></vc:i18n></span>：
  157 + </label>
  158 + <label v-for="(file,index) in contractDetailInfo.files" style="margin-left: 50px;">
  159 + <a href="javascript:void(0)" @click="_viewFile(file)">{{file.fileRealName}}</a>
  160 + </label>
  161 + </div>
  162 + </div>
  163 + </div>
  164 + </div>
  165 + </div>
  166 + </div>
  167 + </div>
  168 + <div class="row">
  169 + <div class="col-lg-12">
  170 + <div class="ibox">
  171 + <div class="ibox-title">
  172 + <h5>
  173 + <span><vc:i18n name="关联房屋" namespace="contractApplyDetail"></vc:i18n></span>
  174 + </h5>
  175 + <div class="ibox-tools" style="top:10px;"></div>
  176 + </div>
  177 + <div class="ibox-content">
  178 + <table class="table table-stripped">
  179 + <thead>
  180 + <tr>
  181 + <th data-hide="phone" class="text-center">
  182 + <span><vc:i18n name="房屋" namespace="contractApplyDetail"></vc:i18n></span>
  183 + </th>
  184 + <th data-hide="phone" class="text-center">
  185 + <span><vc:i18n name="房屋编号" namespace="contractApplyDetail"></vc:i18n></span>
  186 + </th>
  187 + <th data-hide="phone" class="text-center">
  188 + <span><vc:i18n name="建筑面积" namespace="contractApplyDetail"></vc:i18n></span>
  189 + </th>
  190 + <!--<th data-hide="phone" class="text-center">
  191 + <span><vc:i18n name="房屋状态" namespace="contractApplyDetail"></vc:i18n></span>
  192 + </th>-->
  193 + </tr>
  194 + </thead>
  195 + <tbody>
  196 + <tr v-for="room in contractDetailInfo.rooms">
  197 + <td class="text-center">
  198 + {{room.roomName}}
  199 + </td>
  200 + <td class="text-center">
  201 + {{room.roomId}}
  202 + </td>
  203 + <td class="text-center">
  204 + {{room.builtUpArea}}<span><vc:i18n name="平方米" namespace="contractApplyDetail"></vc:i18n></span>
  205 + </td>
  206 + <!--<td class="text-center">
  207 + {{room.link}}
  208 + </td>
  209 + <td class="text-center">
  210 + {{room.stateName}}
  211 + </td>-->
  212 + </tr>
  213 + </tbody>
  214 + </table>
  215 + </div>
  216 + </div>
  217 + </div>
  218 + </div>
  219 + <div class="row">
  220 + <div class="col-lg-12">
  221 + <div class="ibox">
  222 + <div class="ibox-title">
  223 + <h5>
  224 + <span><vc:i18n name="工单流转" namespace="contractApplyDetail"></vc:i18n></span>
  225 + </h5>
  226 + <div class="ibox-tools" style="top:10px;"></div>
  227 + </div>
  228 + <div class="ibox-content">
  229 + <table class="table table-stripped">
  230 + <thead>
  231 + <tr>
  232 + <th scope="col" class="text-center">
  233 + <span><vc:i18n name="序号" namespace="contractApplyDetail"></vc:i18n></span>
  234 + </th>
  235 + <th scope="col" class="text-center">
  236 + <span><vc:i18n name="处理人" namespace="contractApplyDetail"></vc:i18n></span>
  237 + </th>
  238 + <th scope="col" class="text-center">
  239 + <span><vc:i18n name="状态" namespace="contractApplyDetail"></vc:i18n></span>
  240 + </th>
  241 + <th scope="col" class="text-center">
  242 + <span><vc:i18n name="处理时间" namespace="contractApplyDetail"></vc:i18n></span>
  243 + </th>
  244 + <th scope="col" class="text-center">
  245 + <span><vc:i18n name="耗时" namespace="contractApplyDetail"></vc:i18n></span>
  246 + </th>
  247 + <th scope="col" class="text-center">
  248 + <span><vc:i18n name="意见" namespace="contractApplyDetail"></vc:i18n></span>
  249 + </th>
  250 + </tr>
  251 + </thead>
  252 + <tbody>
  253 + <tr v-for="(tItem,index) in auditUsers">
  254 + <td class="text-center">{{index+1}}</td>
  255 + <td class="text-center">{{tItem.userName?tItem.userName:tItem.auditName}}</td>
  256 + <td class="text-center">{{tItem.stateName}}</td>
  257 + <td class="text-center">{{tItem.auditTime}}</td>
  258 + <td class="text-center">{{tItem.duration}}</td>
  259 + <td class="text-center">{{tItem.message}}</td>
  260 + </tr>
  261 + </tbody>
  262 + </table>
  263 + </div>
  264 + </div>
  265 + </div>
  266 + </div>
  267 +</div>
  268 +```
  269 +```js
  270 +/**
  271 + 入驻小区
  272 + **/
  273 +(function (vc) {
  274 + var DEFAULT_PAGE = 1;
  275 + var DEFAULT_ROWS = 1;
  276 + vc.extends({
  277 + data: {
  278 + contractDetailInfo: {
  279 + contractId: '',
  280 + contractName: '',
  281 + contractCode: '',
  282 + contractType: '',
  283 + contractTypeName: '',
  284 + partyA: '',
  285 + partyB: '',
  286 + aContacts: '',
  287 + bContacts: '',
  288 + aLink: '',
  289 + bLink: '',
  290 + operator: '',
  291 + operatorLink: '',
  292 + amount: '',
  293 + startTime: '',
  294 + endTime: '',
  295 + signingTime: '',
  296 + param: '',
  297 + planType: '',
  298 + files: [],
  299 + rooms: []
  300 + },
  301 + auditUsers: []
  302 + },
  303 + _initMethod: function () {
  304 + vc.component.contractDetailInfo.contractId = vc.getParam('contractId');
  305 + vc.component._listContractApply(DEFAULT_PAGE, DEFAULT_ROWS);
  306 + $that._loadAuditUser();
  307 + $that._loadContractFiles();
  308 + $that._loadContractRooms();
  309 + },
  310 + _initEvent: function () {
  311 + },
  312 + methods: {
  313 + _listContractApply: function (_page, _rows) {
  314 + var param = {
  315 + params: {
  316 + page: _page,
  317 + row: _rows,
  318 + contractId: vc.component.contractDetailInfo.contractId
  319 + }
  320 + };
  321 + //发送get请求
  322 + vc.http.apiGet('/contract/queryContract',
  323 + param,
  324 + function (json) {
  325 + var _contractApplyDetailInfo = JSON.parse(json);
  326 + var _contractApply = _contractApplyDetailInfo.data[0];
  327 + vc.copyObject(_contractApply, vc.component.contractDetailInfo);
  328 + },
  329 + function () {
  330 + console.log('请求失败处理');
  331 + }
  332 + );
  333 + },
  334 + _loadAuditUser: function () {
  335 + var param = {
  336 + params: {
  337 + businessKey: vc.component.contractDetailInfo.contractId,
  338 + communityId: vc.getCurrentCommunity().communityId,
  339 + }
  340 + };
  341 + //发送get请求
  342 + vc.http.apiGet('workflow.listWorkflowAuditInfo',
  343 + param,
  344 + function (json, res) {
  345 + var _json = JSON.parse(json);
  346 + $that.auditUsers = _json.data;
  347 + },
  348 + function (errInfo, error) {
  349 + console.log('请求失败处理');
  350 + }
  351 + );
  352 + },
  353 + _loadContractFiles: function () {
  354 + let param = {
  355 + params: {
  356 + contractId: vc.component.contractDetailInfo.contractId,
  357 + page: 1,
  358 + row: 100
  359 + }
  360 + }
  361 + //发送get请求
  362 + vc.http.apiGet('/contractFile/queryContractFile',
  363 + param,
  364 + function (json, res) {
  365 + var _contractTFile = JSON.parse(json);
  366 + vc.component.contractDetailInfo.files = _contractTFile.data;
  367 + },
  368 + function (errInfo, error) {
  369 + console.log('请求失败处理');
  370 + }
  371 + );
  372 + },
  373 + _loadContractRooms: function () {
  374 + let param = {
  375 + params: {
  376 + contractId: vc.component.contractDetailInfo.contractId,
  377 + page: 1,
  378 + row: 100
  379 + }
  380 + }
  381 + //发送get请求
  382 + vc.http.apiGet('/contract/queryContractRoom',
  383 + param,
  384 + function (json, res) {
  385 + var _contractTFile = JSON.parse(json);
  386 + vc.component.contractDetailInfo.rooms = _contractTFile.data;
  387 + },
  388 + function (errInfo, error) {
  389 + console.log('请求失败处理');
  390 + }
  391 + );
  392 + },
  393 + _viewFile: function (_file) {
  394 + window.open(_file.fileSaveName);
  395 + },
  396 + _goback: function () {
  397 + vc.getBack();
  398 + },
  399 + _printContract: function () {
  400 + let _contract = $that.contractDetailInfo;
  401 + window.open("/print.html#/pages/admin/printContract?contractTypeId=" + _contract.contractType + "&contractId=" + _contract.contractId);
  402 + }
  403 + }
  404 + });
  405 +})(window.vc);
  406 +```
0 \ No newline at end of file 407 \ No newline at end of file
src/views/contract/contractApplyDetail.vue 0 → 100644
  View file @1a2232b
  1 +<template>
  2 + <div class="contract-apply-detail-container">
  3 + <el-row :gutter="20">
  4 + <el-col :span="24">
  5 + <el-card>
  6 + <div slot="header" class="flex justify-between">
  7 + <span>{{ $t('contractApplyDetail.title') }}</span>
  8 + <div>
  9 + <el-button type="primary" size="small" @click="_printContract">
  10 + <i class="el-icon-printer"></i>
  11 + {{ $t('contractApplyDetail.print') }}
  12 + </el-button>
  13 + <el-button type="primary" size="small" style="margin-left: 10px;" @click="_goBack">
  14 + <i class="el-icon-close"></i>
  15 + {{ $t('contractApplyDetail.back') }}
  16 + </el-button>
  17 + </div>
  18 + </div>
  19 +
  20 + <el-form label-width="120px" class="text-left">
  21 + <el-row :gutter="20">
  22 + <el-col :span="8">
  23 + <el-form-item :label="$t('contractApplyDetail.contractName') + '：'">
  24 + <span>{{ contractDetailInfo.contractName }}</span>
  25 + </el-form-item>
  26 + </el-col>
  27 + <el-col :span="8">
  28 + <el-form-item :label="$t('contractApplyDetail.contractCode') + '：'">
  29 + <span>{{ contractDetailInfo.contractCode }}</span>
  30 + </el-form-item>
  31 + </el-col>
  32 + <el-col :span="8">
  33 + <el-form-item :label="$t('contractApplyDetail.contractType') + '：'">
  34 + <span>{{ contractDetailInfo.contractTypeName }}</span>
  35 + </el-form-item>
  36 + </el-col>
  37 + </el-row>
  38 +
  39 + <el-row :gutter="20">
  40 + <el-col :span="8">
  41 + <el-form-item :label="$t('contractApplyDetail.partyA') + '：'">
  42 + <span>{{ contractDetailInfo.partyA }}</span>
  43 + </el-form-item>
  44 + </el-col>
  45 + <el-col :span="8">
  46 + <el-form-item :label="$t('contractApplyDetail.partyAContact') + '：'">
  47 + <span>{{ contractDetailInfo.aContacts }}</span>
  48 + </el-form-item>
  49 + </el-col>
  50 + <el-col :span="8">
  51 + <el-form-item :label="$t('contractApplyDetail.partyAPhone') + '：'">
  52 + <span>{{ contractDetailInfo.aLink }}</span>
  53 + </el-form-item>
  54 + </el-col>
  55 + </el-row>
  56 +
  57 + <el-row :gutter="20">
  58 + <el-col :span="8">
  59 + <el-form-item :label="$t('contractApplyDetail.partyB') + '：'">
  60 + <span>{{ contractDetailInfo.partyB }}</span>
  61 + </el-form-item>
  62 + </el-col>
  63 + <el-col :span="8">
  64 + <el-form-item :label="$t('contractApplyDetail.partyBContact') + '：'">
  65 + <span>{{ contractDetailInfo.bContacts }}</span>
  66 + </el-form-item>
  67 + </el-col>
  68 + <el-col :span="8">
  69 + <el-form-item :label="$t('contractApplyDetail.partyBPhone') + '：'">
  70 + <span>{{ contractDetailInfo.bLink }}</span>
  71 + </el-form-item>
  72 + </el-col>
  73 + </el-row>
  74 +
  75 + <el-row :gutter="20">
  76 + <el-col :span="8">
  77 + <el-form-item :label="$t('contractApplyDetail.operator') + '：'">
  78 + <span>{{ contractDetailInfo.operator }}</span>
  79 + </el-form-item>
  80 + </el-col>
  81 + <el-col :span="8">
  82 + <el-form-item :label="$t('contractApplyDetail.phone') + '：'">
  83 + <span>{{ contractDetailInfo.operatorLink }}</span>
  84 + </el-form-item>
  85 + </el-col>
  86 + <el-col :span="8">
  87 + <el-form-item :label="$t('contractApplyDetail.contractAmount') + '：'">
  88 + <span>{{ contractDetailInfo.amount }}</span>
  89 + </el-form-item>
  90 + </el-col>
  91 + </el-row>
  92 +
  93 + <el-row :gutter="20">
  94 + <el-col :span="8">
  95 + <el-form-item :label="$t('contractApplyDetail.startTime') + '：'">
  96 + <span>{{ contractDetailInfo.startTime }}</span>
  97 + </el-form-item>
  98 + </el-col>
  99 + <el-col :span="8">
  100 + <el-form-item :label="$t('contractApplyDetail.endTime') + '：'">
  101 + <span>{{ contractDetailInfo.endTime }}</span>
  102 + </el-form-item>
  103 + </el-col>
  104 + <el-col :span="8">
  105 + <el-form-item :label="$t('contractApplyDetail.signingTime') + '：'">
  106 + <span>{{ contractDetailInfo.signingTime }}</span>
  107 + </el-form-item>
  108 + </el-col>
  109 + </el-row>
  110 +
  111 + <el-row :gutter="20">
  112 + <el-col :span="24">
  113 + <el-form-item :label="$t('contractApplyDetail.relatedFiles') + '：'">
  114 + <span v-for="(file, index) in contractDetailInfo.files" :key="index" style="margin-left: 20px;">
  115 + <a href="javascript:void(0)" @click="_viewFile(file)">{{ file.fileRealName }}</a>
  116 + </span>
  117 + </el-form-item>
  118 + </el-col>
  119 + </el-row>
  120 + </el-form>
  121 + </el-card>
  122 + </el-col>
  123 + </el-row>
  124 +
  125 + <el-row :gutter="20" class="margin-top">
  126 + <el-col :span="24">
  127 + <el-card>
  128 + <div slot="header" class="flex justify-between">
  129 + <span>{{ $t('contractApplyDetail.relatedRooms') }}</span>
  130 + </div>
  131 + <table class="table table-stripped" style="width: 100%;">
  132 + <thead>
  133 + <tr>
  134 + <th class="text-center">{{ $t('contractApplyDetail.room') }}</th>
  135 + <th class="text-center">{{ $t('contractApplyDetail.roomCode') }}</th>
  136 + <th class="text-center">{{ $t('contractApplyDetail.builtUpArea') }}</th>
  137 + </tr>
  138 + </thead>
  139 + <tbody>
  140 + <tr v-for="(room, index) in contractDetailInfo.rooms" :key="index">
  141 + <td class="text-center">{{ room.roomName }}</td>
  142 + <td class="text-center">{{ room.roomId }}</td>
  143 + <td class="text-center">{{ room.builtUpArea }}{{ $t('contractApplyDetail.squareMeter') }}</td>
  144 + </tr>
  145 + </tbody>
  146 + </table>
  147 + </el-card>
  148 + </el-col>
  149 + </el-row>
  150 +
  151 + <el-row :gutter="20" class="margin-top">
  152 + <el-col :span="24">
  153 + <el-card>
  154 + <div slot="header">
  155 + <span>{{ $t('contractApplyDetail.workflowFlow') }}</span>
  156 + </div>
  157 + <table class="table table-stripped" style="width: 100%;">
  158 + <thead>
  159 + <tr>
  160 + <th scope="col" class="text-center">{{ $t('contractApplyDetail.serialNumber') }}</th>
  161 + <th scope="col" class="text-center">{{ $t('contractApplyDetail.processor') }}</th>
  162 + <th scope="col" class="text-center">{{ $t('contractApplyDetail.status') }}</th>
  163 + <th scope="col" class="text-center">{{ $t('contractApplyDetail.processTime') }}</th>
  164 + <th scope="col" class="text-center">{{ $t('contractApplyDetail.timeConsuming') }}</th>
  165 + <th scope="col" class="text-center">{{ $t('contractApplyDetail.opinion') }}</th>
  166 + </tr>
  167 + </thead>
  168 + <tbody>
  169 + <tr v-for="(item, index) in auditUsers" :key="index">
  170 + <td class="text-center">{{ index + 1 }}</td>
  171 + <td class="text-center">{{ item.userName || item.auditName }}</td>
  172 + <td class="text-center">{{ item.stateName }}</td>
  173 + <td class="text-center">{{ item.auditTime }}</td>
  174 + <td class="text-center">{{ item.duration }}</td>
  175 + <td class="text-center">{{ item.message }}</td>
  176 + </tr>
  177 + </tbody>
  178 + </table>
  179 + </el-card>
  180 + </el-col>
  181 + </el-row>
  182 + </div>
  183 +</template>
  184 +
  185 +<script>
  186 +import { queryContract, getContractFiles, getContractRooms } from '@/api/contract/contractDetailApi'
  187 +import { listWorkflowAuditInfo } from '@/api/contract/contractDetailFlowApi'
  188 +import { getCommunityId } from '@/api/community/communityApi'
  189 +
  190 +export default {
  191 + name: 'ContractApplyDetail',
  192 + data() {
  193 + return {
  194 + contractDetailInfo: {
  195 + contractId: '',
  196 + contractName: '',
  197 + contractCode: '',
  198 + contractType: '',
  199 + contractTypeName: '',
  200 + partyA: '',
  201 + partyB: '',
  202 + aContacts: '',
  203 + bContacts: '',
  204 + aLink: '',
  205 + bLink: '',
  206 + operator: '',
  207 + operatorLink: '',
  208 + amount: '',
  209 + startTime: '',
  210 + endTime: '',
  211 + signingTime: '',
  212 + param: '',
  213 + planType: '',
  214 + files: [],
  215 + rooms: []
  216 + },
  217 + auditUsers: [],
  218 + communityId: ''
  219 + }
  220 + },
  221 + created() {
  222 + this.communityId = getCommunityId()
  223 + this.contractDetailInfo.contractId = this.$route.query.contractId
  224 + if (!this.contractDetailInfo.contractId) {
  225 + this.$message.error('缺少合同ID参数')
  226 + this.$router.go(-1)
  227 + return
  228 + }
  229 + this._initMethod()
  230 + },
  231 + methods: {
  232 + async _initMethod() {
  233 + await Promise.all([
  234 + this._listContractApply(),
  235 + this._loadAuditUser(),
  236 + this._loadContractFiles(),
  237 + this._loadContractRooms()
  238 + ])
  239 + },
  240 + async _listContractApply() {
  241 + try {
  242 + const params = {
  243 + page: 1,
  244 + row: 1,
  245 + contractId: this.contractDetailInfo.contractId
  246 + }
  247 + const res = await queryContract(params)
  248 + if (res.data && res.data.length > 0) {
  249 + Object.assign(this.contractDetailInfo, res.data[0])
  250 + }
  251 + } catch (error) {
  252 + console.error('请求失败:', error)
  253 + this.$message.error('获取合同信息失败')
  254 + }
  255 + },
  256 + async _loadAuditUser() {
  257 + try {
  258 + const params = {
  259 + businessKey: this.contractDetailInfo.contractId,
  260 + communityId: this.communityId
  261 + }
  262 + const res = await listWorkflowAuditInfo(params)
  263 + if (res.data) {
  264 + this.auditUsers = res.data
  265 + }
  266 + } catch (error) {
  267 + console.error('请求失败:', error)
  268 + }
  269 + },
  270 + async _loadContractFiles() {
  271 + try {
  272 + const params = {
  273 + contractId: this.contractDetailInfo.contractId,
  274 + page: 1,
  275 + row: 100
  276 + }
  277 + const res = await getContractFiles(params)
  278 + if (res.data) {
  279 + this.contractDetailInfo.files = res.data
  280 + }
  281 + } catch (error) {
  282 + console.error('请求失败:', error)
  283 + }
  284 + },
  285 + async _loadContractRooms() {
  286 + try {
  287 + const params = {
  288 + contractId: this.contractDetailInfo.contractId,
  289 + page: 1,
  290 + row: 100
  291 + }
  292 + const res = await getContractRooms(params)
  293 + if (res.data) {
  294 + this.contractDetailInfo.rooms = res.data
  295 + }
  296 + } catch (error) {
  297 + console.error('请求失败:', error)
  298 + }
  299 + },
  300 + _viewFile(file) {
  301 + if (file.fileSaveName) {
  302 + window.open(file.fileSaveName)
  303 + }
  304 + },
  305 + _goBack() {
  306 + this.$router.go(-1)
  307 + },
  308 + _printContract() {
  309 + const contract = this.contractDetailInfo
  310 + window.open(`/#/views/contract/printContract?contractTypeId=${contract.contractType}&contractId=${contract.contractId}`)
  311 + }
  312 + }
  313 +}
  314 +</script>
  315 +
  316 +<style lang="scss" scoped>
  317 +.contract-apply-detail-container {
  318 + padding: 20px;
  319 +
  320 + .margin-top {
  321 + margin-top: 20px;
  322 + }
  323 +
  324 + .text-left {
  325 + text-align: left;
  326 + }
  327 +
  328 + .text-center {
  329 + text-align: center;
  330 + }
  331 +
  332 + .table {
  333 + width: 100%;
  334 + border-collapse: collapse;
  335 +
  336 + th,
  337 + td {
  338 + border: 1px solid #ebeef5;
  339 + padding: 12px;
  340 + }
  341 +
  342 + thead th {
  343 + background-color: #f5f7fa;
  344 + font-weight: bold;
  345 + }
  346 +
  347 + tbody tr:hover {
  348 + background-color: #f5f7fa;
  349 + }
  350 + }
  351 +
  352 + .table-stripped tbody tr:nth-child(even) {
  353 + background-color: #fafafa;
  354 + }
  355 +}
  356 +</style>
  357 +
src/views/contract/contractApplyDetailLang.js 0 → 100644
  View file @1a2232b
  1 +export const messages = {
  2 + en: {
  3 + contractApplyDetail: {
  4 + title: 'Contract Information',
  5 + contractName: 'Contract Name',
  6 + contractCode: 'Contract Code',
  7 + contractType: 'Contract Type',
  8 + partyA: 'Party A',
  9 + partyAContact: 'Party A Contact',
  10 + partyAPhone: 'Party A Phone',
  11 + partyB: 'Party B',
  12 + partyBContact: 'Party B Contact',
  13 + partyBPhone: 'Party B Phone',
  14 + operator: 'Operator',
  15 + phone: 'Phone',
  16 + contractAmount: 'Contract Amount',
  17 + startTime: 'Start Time',
  18 + endTime: 'End Time',
  19 + signingTime: 'Signing Time',
  20 + relatedFiles: 'Related Files',
  21 + relatedRooms: 'Related Rooms',
  22 + room: 'Room',
  23 + roomCode: 'Room Code',
  24 + builtUpArea: 'Built-up Area',
  25 + squareMeter: 'm²',
  26 + workflowFlow: 'Work Order Flow',
  27 + serialNumber: 'Serial Number',
  28 + processor: 'Processor',
  29 + status: 'Status',
  30 + processTime: 'Process Time',
  31 + timeConsuming: 'Time Consuming',
  32 + opinion: 'Opinion',
  33 + print: 'Print',
  34 + back: 'Back'
  35 + }
  36 + },
  37 + zh: {
  38 + contractApplyDetail: {
  39 + title: '合同信息',
  40 + contractName: '合同名称',
  41 + contractCode: '合同编号',
  42 + contractType: '合同类型',
  43 + partyA: '甲方',
  44 + partyAContact: '甲方联系人',
  45 + partyAPhone: '甲方联系电话',
  46 + partyB: '乙方',
  47 + partyBContact: '乙方联系人',
  48 + partyBPhone: '乙方联系电话',
  49 + operator: '经办人',
  50 + phone: '联系电话',
  51 + contractAmount: '合同金额',
  52 + startTime: '开始时间',
  53 + endTime: '结束时间',
  54 + signingTime: '签订时间',
  55 + relatedFiles: '相关附件',
  56 + relatedRooms: '关联房屋',
  57 + room: '房屋',
  58 + roomCode: '房屋编号',
  59 + builtUpArea: '建筑面积',
  60 + squareMeter: '平方米',
  61 + workflowFlow: '工单流转',
  62 + serialNumber: '序号',
  63 + processor: '处理人',
  64 + status: '状态',
  65 + processTime: '处理时间',
  66 + timeConsuming: '耗时',
  67 + opinion: '意见',
  68 + print: '打印',
  69 + back: '返回'
  70 + }
  71 + }
  72 +}
  73 +