客户详情添加关联合同、合同详情添加关联项目

src/api/cw/projectRecords/ProjectRecordsService.js

@@ -58,4 +58,11 @@ export default class ProjectRecordsService {
       params: {clientId: id}
     })
   }
+  getByContractId (id) {
+    return request({
+      url: '/cwProjectRecords/getByContractId',
+      method: 'get',
+      params: {contractId: id}
+    })
+  }
 }

src/api/cw/workContract/ContractInfoService.js

@@ -57,4 +57,11 @@ export default class ContractInfoService {
       data: param
     })
   }
+  getByClientId (id) {
+    return request({
+      url: '/contract/registration/getByClientId',
+      method: 'get',
+      params: {clientId: id}
+    })
+  }
 }

src/views/modules/cw/workClientInfo/WorkClientForm.vue

@@ -710,7 +710,7 @@
               show-overflow
               highlight-hover-row
               :menu-config="{}"
-              @sort-change="sortChangeHandle"
+              @sort-change=""
               :sort-config="{remote:true}"
               :data="projectList"
               :checkbox-config="{}">
@@ -727,6 +727,39 @@
               <vxe-column min-width="160" align="center" title="创建时间" field="createDate"></vxe-column>
             </vxe-table>
           </el-tab-pane>
+          <el-tab-pane label="关联合同" name="contract">
+            <vxe-table
+              max-height="500"
+              border="inner"
+              auto-resize
+              resizable
+              height="auto"
+              :loading="loading"
+              size="medium"
+              ref="contractTable"
+              show-header-overflow
+              show-overflow
+              highlight-hover-row
+              :menu-config="{}"
+              @sort-change=""
+              :sort-config="{remote:true}"
+              :data="contractList"
+              :checkbox-config="{}">
+              <vxe-column type="seq" width="60" title="序号"></vxe-column>
+              <vxe-column width="200px" align="center" title="合同名称" field="contractName">
+                <template slot-scope="scope">
+                  <el-link  type="primary" :underline="false" v-if="hasPermission('cw:workContract:view')" @click="viewContract(scope.row.id)">{{scope.row.contractName}}</el-link>
+                  <span v-else>{{scope.row.contractName}}</span>
+                </template>
+              </vxe-column>
+              <vxe-column min-width="160" align="center" title="合同编号" field="contractNo"></vxe-column>
+              <vxe-column min-width="160" align="center" title="签约日期" field="signingDate"></vxe-column>
+              <vxe-column min-width="160" align="center" title="合同金额（元）" field="contractAmount"></vxe-column>
+              <vxe-column min-width="160" align="center" title="所属部门" field="departmentName"></vxe-column>
+              <vxe-column min-width="160" align="center" title="创建人" field="createName"></vxe-column>
+              <vxe-column min-width="160" align="center" title="创建日期" field="createDate"></vxe-column>
+            </vxe-table>
+          </el-tab-pane>
         </el-tabs>
       </el-col>
     </el-row>
@@ -739,6 +772,7 @@
     <ManageLevelTypeListForm ref="manageLevelTypeListForm" @getManageLevelType="getManageLevelType"></ManageLevelTypeListForm>
     <OrganizationTypeListForm ref="organizationTypeListForm" @getOrganizationType="getOrganizationType"></OrganizationTypeListForm>
       <ProjectRecordsForm ref="projectRecordsForm" @refreshList=""></ProjectRecordsForm>
+      <ContractNameForm ref="contractNameForm"></ContractNameForm>
     </el-dialog>
   </div>
 </template>
@@ -755,6 +789,8 @@
   import ManageLevelTypeListForm from './manageLevelType/ManageLevelTypeListForm'
   import OrganizationTypeListForm from './organizationType/OrganizationTypeListForm'
   import ProjectRecordsService from '@/api/cw/projectRecords/ProjectRecordsService'
+  import ContractInfoService from '@/api/cw/workContract/ContractInfoService'
+  import ContractNameForm from '../workContract/ContractNameForm'
   export default {
     props: {
       businessId: {
@@ -900,16 +936,19 @@
             {required: true, message: '联系方式1不可以为空'}
           ]
         },
-        projectList: []
+        projectList: [],
+        contractList: []
       }
     },
     workClientService: null,
     enterpriseSearchService: null,
     projectRecordsService: null,
+    contractInfoService: null,
     created () {
       this.enterpriseSearchService = new EnterpriseSearchService()
       this.workClientService = new WorkClientService()
       this.projectRecordsService = new ProjectRecordsService()
+      this.contractInfoService = new ContractInfoService()
     },
     computed: {
       bus: {
@@ -943,7 +982,8 @@
       WorkClientListForm,
       ManageLevelTypeListForm,
       OrganizationTypeListForm,
-      ProjectRecordsForm
+      ProjectRecordsForm,
+      ContractNameForm
     },
     methods: {
       getKeyWatch (keyWatch) {
@@ -1087,7 +1127,10 @@
             })
             this.projectRecordsService.getByClientId(this.inputForm.id).then(({data}) => {
               this.projectList = data
-              this.loading = false
+              this.contractInfoService.getByClientId(this.inputForm.id).then(({data}) => {
+                this.contractList = data
+                this.loading = false
+              })
             })
           })
         })
@@ -1580,6 +1623,9 @@
       },
       viewProject (id) {
         this.$refs.projectRecordsForm.init('view', id)
+      },
+      viewContract (id) {
+        this.$refs.contractNameForm.init('view', id)
       }
     }
   }

src/views/modules/cw/workContract/ContractNameForm.vue

@@ -10,295 +10,330 @@
       @close="close"
       @keyup.enter.native=""
       :visible.sync="visible">
-    <el-form size="middle" :model="inputForm" ref="inputForm" v-loading="loading" :class="method==='view'?'readonly':''"  :disabled="method==='view'"
-             label-width="150px">
-      <el-divider v-if="method==='view' && commonJS.isNotEmpty(inputForm.customerId)" content-position="left">
-        <el-link  type="primary" :underline="false" icon="el-icon-document" @click="viewClient(inputForm.customerId)"><b>查看客户详情</b></el-link>
-      </el-divider>
-      <el-divider v-else content-position="left"><i class="el-icon-document"></i> 客户信息</el-divider>
-      <el-row  :gutter="0">
-        <el-col :span="12">
-          <el-form-item label="委托方联系人" prop="clientContacts"
-                        :rules="[{required: true, message: '委托方联系人', trigger: 'blur'}
-                 ]">
-            <el-input maxlength="100" @focus="openWorkClient2()" v-model="inputForm.clientContacts" placeholder="请选择委托方联系人">
-              <el-button slot="append" icon="el-icon-search" @click="openWorkClient2()"></el-button>
-            </el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="客户编号" prop="customerNo"
-                        :rules="[
-                   ]">
-            <el-input :disabled="true" v-model="inputForm.customerNo" placeholder="请填写客户编号" clearable></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="统一社会信用代码" prop="uscCode"
-                        :rules="[
-                   ]">
-            <el-input :disabled="true" v-model="inputForm.uscCode" placeholder="请填写统一社会信用代码" clearable></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="委托方联系人电话" prop="clientContactsPhone"
-                        :rules="[{required: true, message: '委托方联系人电话', trigger: 'blur'}
-                 ]">
-            <el-input maxlength="15" :disabled="true" v-model="inputForm.clientContactsPhone" placeholder="请输入委托方联系人电话"
-                      @keyup.native="inputForm.clientContactsPhone = twoDecimalPlaces(inputForm.clientContactsPhone)"
-            ></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="地址" prop="address"
-                        :rules="[
-                   ]">
-            <el-input :disabled="true" v-model="inputForm.address" placeholder="地址" clearable></el-input>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-divider content-position="left"><i class="el-icon-document"></i> 基本信息</el-divider>
-      <el-row  :gutter="0">
-        <el-col :span="12">
-          <el-form-item label="合同名称" prop="contractName"
-                        :rules="[{required: true, message: '合同名称不能为空', trigger: 'blur'}
-                 ]">
-            <el-input v-model="inputForm.contractName" placeholder="请输入合同名称"     clearable></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="合同编号" prop="contractNo">
-            <el-input maxlength="64" :disabled="true" v-model="inputForm.contractNo" placeholder="自动生成"></el-input>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="付款主体" prop="payerSubject"
-                        :rules="[{required: true, message: '付款主体不能为空', trigger: 'blur'}
-                 ]">
-            <el-select v-model="inputForm.payerSubject" placeholder="请选择付款主体" style="width:100%;">
-              <el-option
-                v-for="item in $dictUtils.getDictList('cw_payment_subject')"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value">
-              </el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item label="付款方式" prop="paymentMethod"
-                        :rules="[{required: true, message: '付款方式不能为空', trigger: 'blur'}
-                 ]">
-            <el-select v-model="inputForm.paymentMethod" placeholder="请选择付款方式" style="width:100%;">
-              <el-option
-                v-for="item in $dictUtils.getDictList('cw_payment_method')"
-                :key="item.value"
-                :label="item.label"
-                :value="item.value">
-              </el-option>
-            </el-select>
-          </el-form-item>
-        </el-col>
+      <el-tabs v-model="activeNameTop" type="border-card" @tab-click="tabHandleClickTop">
+        <el-tab-pane label="合同信息" name="contract">
+          <el-form size="middle" :model="inputForm" ref="inputForm" v-loading="loading" :class="method==='view'?'readonly':''"  :disabled="method==='view'"
+                   label-width="150px">
+            <el-divider v-if="method==='view' && commonJS.isNotEmpty(inputForm.customerId)" content-position="left">
+              <el-link  type="primary" :underline="false" icon="el-icon-document" @click="viewClient(inputForm.customerId)"><b>查看客户详情</b></el-link>
+            </el-divider>
+            <el-divider v-else content-position="left"><i class="el-icon-document"></i> 客户信息</el-divider>
+            <el-row  :gutter="0">
+              <el-col :span="12">
+                <el-form-item label="委托方联系人" prop="clientContacts"
+                              :rules="[{required: true, message: '委托方联系人', trigger: 'blur'}
+                       ]">
+                  <el-input maxlength="100" @focus="openWorkClient2()" v-model="inputForm.clientContacts" placeholder="请选择委托方联系人">
+                    <el-button slot="append" icon="el-icon-search" @click="openWorkClient2()"></el-button>
+                  </el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="客户编号" prop="customerNo"
+                              :rules="[
+                         ]">
+                  <el-input :disabled="true" v-model="inputForm.customerNo" placeholder="请填写客户编号" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="统一社会信用代码" prop="uscCode"
+                              :rules="[
+                         ]">
+                  <el-input :disabled="true" v-model="inputForm.uscCode" placeholder="请填写统一社会信用代码" clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="委托方联系人电话" prop="clientContactsPhone"
+                              :rules="[{required: true, message: '委托方联系人电话', trigger: 'blur'}
+                       ]">
+                  <el-input maxlength="15" :disabled="true" v-model="inputForm.clientContactsPhone" placeholder="请输入委托方联系人电话"
+                            @keyup.native="inputForm.clientContactsPhone = twoDecimalPlaces(inputForm.clientContactsPhone)"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="地址" prop="address"
+                              :rules="[
+                         ]">
+                  <el-input :disabled="true" v-model="inputForm.address" placeholder="地址" clearable></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-divider content-position="left"><i class="el-icon-document"></i> 基本信息</el-divider>
+            <el-row  :gutter="0">
+              <el-col :span="12">
+                <el-form-item label="合同名称" prop="contractName"
+                              :rules="[{required: true, message: '合同名称不能为空', trigger: 'blur'}
+                       ]">
+                  <el-input v-model="inputForm.contractName" placeholder="请输入合同名称"     clearable></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="合同编号" prop="contractNo">
+                  <el-input maxlength="64" :disabled="true" v-model="inputForm.contractNo" placeholder="自动生成"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="付款主体" prop="payerSubject"
+                              :rules="[{required: true, message: '付款主体不能为空', trigger: 'blur'}
+                       ]">
+                  <el-select v-model="inputForm.payerSubject" placeholder="请选择付款主体" style="width:100%;">
+                    <el-option
+                      v-for="item in $dictUtils.getDictList('cw_payment_subject')"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value">
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="付款方式" prop="paymentMethod"
+                              :rules="[{required: true, message: '付款方式不能为空', trigger: 'blur'}
+                       ]">
+                  <el-select v-model="inputForm.paymentMethod" placeholder="请选择付款方式" style="width:100%;">
+                    <el-option
+                      v-for="item in $dictUtils.getDictList('cw_payment_method')"
+                      :key="item.value"
+                      :label="item.label"
+                      :value="item.value">
+                    </el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="签约日期" prop="signingDate"
-                        :rules="[
-                {required: true, message:'请输入签约日期', trigger:'blur'}
-               ]">
-            <el-date-picker
-              placement="bottom-start"
-              value-format="yyyy-MM-dd"
-              v-model="inputForm.signingDate"
-              style="width: 100%"
-              placeholder="选择日期">
-            </el-date-picker>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="签约日期" prop="signingDate"
+                              :rules="[
+                      {required: true, message:'请输入签约日期', trigger:'blur'}
+                     ]">
+                  <el-date-picker
+                    placement="bottom-start"
+                    value-format="yyyy-MM-dd"
+                    v-model="inputForm.signingDate"
+                    style="width: 100%"
+                    placeholder="选择日期">
+                  </el-date-picker>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="合同金额类别" prop="contractAmountType"
-                        :rules="[
-                  {required: true, message:'请选择合同金额类别', trigger:'blur'}
-               ]">
-            <el-radio-group v-model="inputForm.contractAmountType">
-              <el-radio v-for="item in $dictUtils.getDictList('contract_amount_type')" :label="item.value" >{{item.label}}</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="合同金额类别" prop="contractAmountType"
+                              :rules="[
+                        {required: true, message:'请选择合同金额类别', trigger:'blur'}
+                     ]">
+                  <el-radio-group v-model="inputForm.contractAmountType">
+                    <el-radio v-for="item in $dictUtils.getDictList('contract_amount_type')" :label="item.value" >{{item.label}}</el-radio>
+                  </el-radio-group>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="合同金额(元)" prop="contractAmount" v-if="inputForm.contractAmountType === '1'"
-                        :rules="[
-                  {required: true, message:'请输入合同金额(元)', trigger:'blur'}
-               ]">
-            <el-input maxlength="15" v-model="inputForm.contractAmount" placeholder="请输入合同金额(元)"
-                      @keyup.native="inputForm.contractAmount = twoDecimalPlaces(inputForm.contractAmount)"
-            ></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="合同金额(元)" prop="contractAmount" v-if="inputForm.contractAmountType === '1'"
+                              :rules="[
+                        {required: true, message:'请输入合同金额(元)', trigger:'blur'}
+                     ]">
+                  <el-input maxlength="15" v-model="inputForm.contractAmount" placeholder="请输入合同金额(元)"
+                            @keyup.native="inputForm.contractAmount = twoDecimalPlaces(inputForm.contractAmount)"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="合同实际金额" prop="actualContractAmount">
-            <el-input maxlength="64" :disabled="true" v-model="inputForm.actualContractAmount" ></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="合同实际金额" prop="actualContractAmount">
+                  <el-input maxlength="64" :disabled="true" v-model="inputForm.actualContractAmount" ></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="合同份数" prop="contractNum"
-                        :rules="[{required: true, message: '合同份数', trigger: 'blur'}
-                 ]">
-            <el-input maxlength="64" v-model="inputForm.contractNum" placeholder="请输入合同份数"></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="合同份数" prop="contractNum"
+                              :rules="[{required: true, message: '合同份数', trigger: 'blur'}
+                       ]">
+                  <el-input maxlength="64" v-model="inputForm.contractNum" placeholder="请输入合同份数"></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="对方合同编号" prop="contractOpposite">
-            <el-input maxlength="64" v-model="inputForm.contractOpposite" placeholder="请填写对方合同编号"></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="对方合同编号" prop="contractOpposite">
+                  <el-input maxlength="64" v-model="inputForm.contractOpposite" placeholder="请填写对方合同编号"></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="24">
-          <el-form-item label="收费标准" prop="contractFees">
-            <el-checkbox-group v-model="inputForm.contractFees">
-              <el-checkbox @change="changeContractFee" v-for="item in $dictUtils.getDictList('contract_fee')" :label="item.value">
-                {{item.label}}
-              </el-checkbox>
-            </el-checkbox-group>
-          </el-form-item>
-        </el-col>
+              <el-col :span="24">
+                <el-form-item label="收费标准" prop="contractFees">
+                  <el-checkbox-group v-model="inputForm.contractFees">
+                    <el-checkbox @change="changeContractFee" v-for="item in $dictUtils.getDictList('contract_fee')" :label="item.value">
+                      {{item.label}}
+                    </el-checkbox>
+                  </el-checkbox-group>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="24">
-          <el-form-item prop="contractFee">
-            <el-input style="width: 100%" placeholder="请选择收费标准" v-model="inputForm.contractFee"></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="24">
+                <el-form-item prop="contractFee">
+                  <el-input style="width: 100%" placeholder="请选择收费标准" v-model="inputForm.contractFee"></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="案卷号" prop="filedNo" v-if="this.inputForm.filedPaperType !== '0' & this.inputForm.filedPaperType !== ''"
-                        :rules="[{required: true, message: '请输入案卷号', trigger: 'blur'}
-                 ]">
-            <el-input maxlength="15" v-model="inputForm.filedNo" placeholder="请输入案卷号"
-            ></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="案卷号" prop="filedNo" v-if="this.inputForm.filedPaperType !== '0' & this.inputForm.filedPaperType !== ''"
+                              :rules="[{required: true, message: '请输入案卷号', trigger: 'blur'}
+                       ]">
+                  <el-input maxlength="15" v-model="inputForm.filedNo" placeholder="请输入案卷号"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="确认案卷号" prop="confirmFiledNo" v-if="this.inputForm.filedPaperType !== '0' & this.inputForm.filedPaperType !== ''"
-                        :rules="[{required: true, message: '请输入确认案卷号', trigger: 'blur'}
-                 ]">
-            <el-input maxlength="15" @change="checkFiledNo" v-model="inputForm.confirmFiledNo" placeholder="请输入确认案卷号"
-            ></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="确认案卷号" prop="confirmFiledNo" v-if="this.inputForm.filedPaperType !== '0' & this.inputForm.filedPaperType !== ''"
+                              :rules="[{required: true, message: '请输入确认案卷号', trigger: 'blur'}
+                       ]">
+                  <el-input maxlength="15" @change="checkFiledNo" v-model="inputForm.confirmFiledNo" placeholder="请输入确认案卷号"
+                  ></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="修改次数" prop="changeNum"
-                        :rules="[{required: true, message: '修改次数', trigger: 'blur'}
-                 ]">
-            <el-input maxlength="64" :disabled="true" v-model="inputForm.changeNum" placeholder="请输入修改次数"></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="修改次数" prop="changeNum"
+                              :rules="[{required: true, message: '修改次数', trigger: 'blur'}
+                       ]">
+                  <el-input maxlength="64" :disabled="true" v-model="inputForm.changeNum" placeholder="请输入修改次数"></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item  prop="department" label="所属部门">
-            <SelectTree
-              ref="officeTree"
-              :props="{
-                  value: 'id',             // ID字段名
-                  label: 'name',         // 显示名称
-                  children: 'children'    // 子级字段名
-                }"
+              <el-col :span="12">
+                <el-form-item  prop="department" label="所属部门">
+                  <SelectTree
+                    ref="officeTree"
+                    :props="{
+                        value: 'id',             // ID字段名
+                        label: 'name',         // 显示名称
+                        children: 'children'    // 子级字段名
+                      }"
 
-              :url="`/sys/office/treeData?type=1`"
-              :value="inputForm.department"
-              :accordion="true"
-              size="medium"
-              @getValue="(value) => {inputForm.department=value}"/>
-          </el-form-item>
-        </el-col>
+                    :url="`/sys/office/treeData?type=1`"
+                    :value="inputForm.department"
+                    :accordion="true"
+                    size="medium"
+                    @getValue="(value) => {inputForm.department=value}"/>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="创建人" prop="createBy"
-                        :rules="[{required: true, message: '创建人', trigger: 'blur'}
-                 ]">
-            <el-input maxlength="64" :disabled="true" v-model="inputForm.createBy" placeholder="请输入创建人"></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="创建人" prop="createBy"
+                              :rules="[{required: true, message: '创建人', trigger: 'blur'}
+                       ]">
+                  <el-input maxlength="64" :disabled="true" v-model="inputForm.createBy" placeholder="请输入创建人"></el-input>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="创建时间" prop="createDate">
-            <el-date-picker
-              placement="bottom-start"
-              value-format="yyyy-MM-dd"
-              v-model="inputForm.createDate"
-              style="width: 100%"
-              :disabled="true"
-              placeholder="选择日期">
-            </el-date-picker>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="创建时间" prop="createDate">
+                  <el-date-picker
+                    placement="bottom-start"
+                    value-format="yyyy-MM-dd"
+                    v-model="inputForm.createDate"
+                    style="width: 100%"
+                    :disabled="true"
+                    placeholder="选择日期">
+                  </el-date-picker>
+                </el-form-item>
+              </el-col>
 
-        <el-col :span="12">
-          <el-form-item label="付款约定" prop="paymentAgreement">
-            <el-input maxlength="64" type="textarea" v-model="inputForm.paymentAgreement" placeholder="请输入付款约定"></el-input>
-          </el-form-item>
-        </el-col>
+              <el-col :span="12">
+                <el-form-item label="付款约定" prop="paymentAgreement">
+                  <el-input maxlength="64" type="textarea" v-model="inputForm.paymentAgreement" placeholder="请输入付款约定"></el-input>
+                </el-form-item>
+              </el-col>
 
-      </el-row>
-    </el-form>
-    <el-tabs v-model="activeName" type="border-card" @tab-click="tabHandleClick">
-      <el-tab-pane label="合同正文" name="uploadFile">
-        <!--        合同正文-->
-        <UpLoadComponent ref="uploadFile"></UpLoadComponent>
-      </el-tab-pane>
-      <el-tab-pane label="参与签约方" name="contactParty">
-        <el-row :gutter="15">
-          <el-button type="info" :disabled="method === 'view'" style="margin-bottom: 15px" size="mini"  @click="openWorkClient">
-            新增参与签约方
-          </el-button>
-        </el-row>
-        <el-row  :gutter="15">
-          <el-form :disabled="method === 'view'">
-            <vxe-table
-              border
-              show-overflow
-              show-footer
-              :column-config="{resizable: true}"
-              ref="contactTable"
-              :key="tableKeyClient"
-              class="vxe-table-element"
-              :data="inputForm.cwWorkClientContactDTOList"
-              style=""
-              @cell-click=""
-              @edit-closed=""
-              highlight-current-row
-              :edit-config="{trigger: 'click', mode: 'row', showStatus: false, autoClear: false}"
-            >
-              <vxe-table-column align="center" field="no" title="客户编号" :edit-render="{}">
-                <template v-slot:edit="scope">
-                  <el-input :readonly="true" v-model="scope.row.no" placeholder="客户编号" clearable></el-input>
-                </template>
-              </vxe-table-column>
-              <vxe-table-column align="center" field="name" title="客户名称" :edit-render="{}">
-                <template v-slot:edit="scope">
-                  <el-input :readonly="true" v-model="scope.row.name" placeholder="客户名称" clearable></el-input>
-                </template>
-              </vxe-table-column>
-              <vxe-table-column align="center" title="操作" width="100">
-                <template v-slot="scope">
-                  <el-button size="mini" type="danger" @click="removeEvent(scope.row,scope.$rowIndex,'client')">删除</el-button>
-                </template>
-              </vxe-table-column>
-            </vxe-table>
+            </el-row>
           </el-form>
-        </el-row>
-      </el-tab-pane>
-      <el-tab-pane label="合同归档文件" name="archiveFile">
-        <!--        合同归档文件-->
-        <UpLoadComponent ref="archiveFile"></UpLoadComponent>
-      </el-tab-pane>
+          <el-tabs v-model="activeName" type="border-card" @tab-click="tabHandleClick">
+            <el-tab-pane label="合同正文" name="uploadFile">
+              <!--        合同正文-->
+              <UpLoadComponent ref="uploadFile"></UpLoadComponent>
+            </el-tab-pane>
+            <el-tab-pane label="参与签约方" name="contactParty">
+              <el-row :gutter="15">
+                <el-button type="info" :disabled="method === 'view'" style="margin-bottom: 15px" size="mini"  @click="openWorkClient">
+                  新增参与签约方
+                </el-button>
+              </el-row>
+              <el-row  :gutter="15">
+                <el-form :disabled="method === 'view'">
+                  <vxe-table
+                    border
+                    show-overflow
+                    show-footer
+                    :column-config="{resizable: true}"
+                    ref="contactTable"
+                    :key="tableKeyClient"
+                    class="vxe-table-element"
+                    :data="inputForm.cwWorkClientContactDTOList"
+                    style=""
+                    @cell-click=""
+                    @edit-closed=""
+                    highlight-current-row
+                    :edit-config="{trigger: 'click', mode: 'row', showStatus: false, autoClear: false}"
+                  >
+                    <vxe-table-column align="center" field="no" title="客户编号" :edit-render="{}">
+                      <template v-slot:edit="scope">
+                        <el-input :readonly="true" v-model="scope.row.no" placeholder="客户编号" clearable></el-input>
+                      </template>
+                    </vxe-table-column>
+                    <vxe-table-column align="center" field="name" title="客户名称" :edit-render="{}">
+                      <template v-slot:edit="scope">
+                        <el-input :readonly="true" v-model="scope.row.name" placeholder="客户名称" clearable></el-input>
+                      </template>
+                    </vxe-table-column>
+                    <vxe-table-column align="center" title="操作" width="100">
+                      <template v-slot="scope">
+                        <el-button size="mini" type="danger" @click="removeEvent(scope.row,scope.$rowIndex,'client')">删除</el-button>
+                      </template>
+                    </vxe-table-column>
+                  </vxe-table>
+                </el-form>
+              </el-row>
+            </el-tab-pane>
+            <el-tab-pane label="合同归档文件" name="archiveFile">
+              <!--        合同归档文件-->
+              <UpLoadComponent ref="archiveFile"></UpLoadComponent>
+            </el-tab-pane>
 
-    </el-tabs>
+          </el-tabs>
+        </el-tab-pane>
+        <el-tab-pane label="关联项目" name="project">
+          <vxe-table
+            max-height="500"
+            border="inner"
+            auto-resize
+            resizable
+            height="auto"
+            :loading="loading"
+            size="medium"
+            ref="projectTable"
+            show-header-overflow
+            show-overflow
+            highlight-hover-row
+            :menu-config="{}"
+            @sort-change=""
+            :sort-config="{remote:true}"
+            :data="projectList"
+            :checkbox-config="{}">
+            <vxe-column type="seq" width="60" title="序号"></vxe-column>
+            <vxe-column min-width="230" align="center" title="项目名称" field="projectName">
+              <template slot-scope="scope">
+                <el-link  type="primary" :underline="false" v-if="hasPermission('cwProjectRecords:view')" @click="viewProject(scope.row.id)">{{scope.row.projectName}}</el-link>
+                <span v-else>{{scope.row.projectName}}</span>
+              </template>
+            </vxe-column>
+            <vxe-column min-width="160" align="center" title="项目编号" field="projectNumber"></vxe-column>
+            <vxe-column min-width="160" align="center" title="项目经理" field="projectMasterName"></vxe-column>
+            <vxe-column min-width="160" align="center" title="创建人" field="createName"></vxe-column>
+            <vxe-column min-width="160" align="center" title="创建时间" field="createDate"></vxe-column>
+          </vxe-table>
+        </el-tab-pane>
+      </el-tabs>
       <span slot="footer" class="dialog-footer">
       <el-button size="small" @click="close()" icon="el-icon-circle-close">关闭</el-button>
       <el-button size="small" v-if="method === 'edit'" type="primary" icon="el-icon-circle-check" @click="doSubmit('save')">确定</el-button>
@@ -311,13 +346,16 @@
       zIndex="9999"/>
     <WorkClientChooseForm ref="workClientChooseForm" @getWorkClientChoose="getWorkClientChoose"></WorkClientChooseForm>
       <WorkClientChooseRadio ref="workClientChooseRadio" @getWorkClientRadioChoose="getWorkClientChoose2"></WorkClientChooseRadio>
-      <WorkClientForm ref="workClientForm" @refreshList=""></WorkClientForm>
+
     </el-dialog>
+    <WorkClientForm ref="workClientForm"></WorkClientForm>
+    <ProjectRecordsForm ref="projectRecordsForm" @refreshList=""></ProjectRecordsForm>
   </div>
 </template>
 
 <script>
   import ContractInfoService from '@/api/cw/workContract/ContractInfoService'
+  import ProjectRecordsService from '@/api/cw/projectRecords/ProjectRecordsService'
   import ContractFileService from '../../../../api/cw/workContract/ContractFileService'
   import UpLoadComponent from '@/views/common/UpLoadComponent'
   import WorkClientChooseForm from '../workClientInfo/WorkClientChooseForm'
@@ -333,6 +371,7 @@
   } from '@/api/sys/OSSService'
   import moment from 'moment'
   import ElImageViewer from 'element-ui/packages/image/src/image-viewer'
+  import ProjectRecordsForm from '../projectRecords/ProjectRecordsForm'
   export default {
     data () {
       return {
@@ -413,6 +452,7 @@
           contractInfoList: []
         },
         activeName: 'archiveFile',
+        activeNameTop: 'contract',
         filesArra2: [],
         fileList: [],
         isFlag: true,
@@ -426,7 +466,8 @@
         progressFlag: false, // 关闭进度条
         promi: null,
         keyWatch: '',
-        tableKeyClient: '1'
+        tableKeyClient: '1',
+        projectList: []
       }
     },
     props: {
@@ -449,17 +490,20 @@
       WorkClientChooseForm,
       SelectTree,
       WorkClientChooseRadio,
-      WorkClientForm
+      WorkClientForm,
+      ProjectRecordsForm
     },
     ossService: null,
     // workContractService: null,
     contractInfoService: null,
     contractFileService: null,
+    projectRecordsService: null,
     created () {
       this.ossService = new OSSSerive()
       // this.workContractService = new WorkContractService()
       this.contractInfoService = new ContractInfoService()
       this.contractFileService = new ContractFileService()
+      this.projectRecordsService = new ProjectRecordsService()
     },
     mounted () {
       window.onPreview = this.onPreview
@@ -526,6 +570,7 @@
       init (method, id) {
         // console.log(method)
         // console.log('id', id)
+        this.activeNameTop = 'contract'
         this.dataList = []
         this.dataListNew = []
         if (method === 'edit') {
@@ -613,6 +658,10 @@
             this.$refs.archiveFile.newUpload(method, this.inputForm.contractInfoList, 'cwWorkContract', null, null, null, null, false)
             this.loading = false
           })
+          // 获取关联项目信息
+          this.projectRecordsService.getByContractId(this.inputForm.id).then((project) => {
+            this.projectList = project.data
+          })
         }
         )
       },
@@ -653,6 +702,9 @@
       tabHandleClick (event) {
         // console.log(event)
       },
+      tabHandleClickTop (event) {
+        // console.log(event)
+      },
       saveData (data, method) {
         // console.log('data', data)
         this.inputForm = this.recover(this.inputForm, data)
@@ -889,7 +941,10 @@
       // 查看客户信息详情
       viewClient (id) {
         this.$refs.workClientForm.init('view', id)
-      }
+      },
+      viewProject (id) {
+        this.$refs.projectRecordsForm.init('view', id)
+      },
     }
   }
 </script>