|  |  | 
 |  |  |     > | 
 |  |  |       <template slot="title"> | 
 |  |  |         <div class="header"> | 
 |  |  |           <span class="header-label">服务合同编号</span> | 
 |  |  |           <span class="header-label">服务合同</span> | 
 |  |  |           <span class="header-title">{{ detailConfig.infomation.number }}</span> | 
 |  |  |         </div> | 
 |  |  |       </template> | 
 |  |  | 
 |  |  |         <div class="tab-view"> | 
 |  |  |           <el-tabs v-model="activeName" @tab-click="tabsClick"> | 
 |  |  |             <el-tab-pane label="详情" name="first"></el-tab-pane> | 
 |  |  |             <el-tab-pane label="收款计划" name="collection"> | 
 |  |  |             <!-- <el-tab-pane label="收款计划" name="collection"> --> | 
 |  |  |               <!-- <template slot="label"> | 
 |  |  |                 <div>跟进记录<el-badge type="primary" :value="2"> </el-badge></div> | 
 |  |  |               </template> --> | 
 |  |  |             </el-tab-pane> | 
 |  |  |             <!-- </el-tab-pane> --> | 
 |  |  |             <el-tab-pane label="收款单" name="receipt"></el-tab-pane> | 
 |  |  |             <el-tab-pane label="客户服务单" name="clientService"> </el-tab-pane> | 
 |  |  |             <el-tab-pane label="销售发票" name="invoice"></el-tab-pane> | 
 |  |  | 
 |  |  |                     <div class="content-data">{{ item.leftValue ? item.leftValue : "--" }}</div> | 
 |  |  |                   </div> | 
 |  |  |                   <div v-if="item.rightStr" class="right"> | 
 |  |  |                     <div class="content-title">{{ item.rightStr }}</div> | 
 |  |  |                     <div class="content-title">{{ item.rightStr + ":" }}</div> | 
 |  |  |                     <div class="content-data">{{ item.rightValue ? item.rightValue : "--" }}</div> | 
 |  |  |                   </div> | 
 |  |  |                 </li> | 
 |  |  | 
 |  |  |                     <div class="content-data">{{ item.leftValue ? item.leftValue : "--" }}</div> | 
 |  |  |                   </div> | 
 |  |  |                   <div v-if="item.rightStr" class="right"> | 
 |  |  |                     <div class="content-title">{{ item.rightStr }}</div> | 
 |  |  |                     <div class="content-title">{{ item.rightStr + ":" }}</div> | 
 |  |  |                     <div class="content-data">{{ item.rightValue ? item.rightValue : "--" }}</div> | 
 |  |  |                   </div> | 
 |  |  |                 </li> | 
 |  |  | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |           <!-- 附件信息 --> | 
 |  |  |           <div class="basic-info"> | 
 |  |  |           <!-- <div class="basic-info"> | 
 |  |  |             <div class="basic-info-label" @click="expandClick('annex')"> | 
 |  |  |               <i v-if="isAnnexExpand" class="el-icon-arrow-down"></i> | 
 |  |  |               <i v-else class="el-icon-arrow-up"></i> | 
 |  |  | 
 |  |  |                 </li> | 
 |  |  |               </ul> | 
 |  |  |             </div> | 
 |  |  |           </div> | 
 |  |  |           </div> --> | 
 |  |  |           <!-- 产品管理 --> | 
 |  |  |           <div class="basic-info"> | 
 |  |  |             <div class="basic-info-label" @click="expandClick('product')"> | 
 |  |  | 
 |  |  |           </div> | 
 |  |  |         </div> | 
 |  |  |         <div v-if="activeName === 'collection'" class="second"> | 
 |  |  |           <!-- <FollowupRecords :isDetail="true" /> --> | 
 |  |  |           <CollectionPlan :isDetail="true" :add-config="addConfig" :source-type="2" /> | 
 |  |  |         </div> | 
 |  |  |         <div v-if="activeName === 'receipt'" class="second"> | 
 |  |  |           <!-- <FollowupRecords :isDetail="true" /> --> | 
 |  |  |           <Receipt :isDetail="true" :add-config="addConfig" :source-type="2" /> | 
 |  |  |         </div> | 
 |  |  |         <div v-if="activeName === 'clientService'" class="second"> | 
 |  |  |           <ClientServiceOrder :isDetail="true" /> | 
 |  |  |           <ClientServiceOrder :isDetail="true" :add-config="addConfig" /> | 
 |  |  |         </div> | 
 |  |  |         <div v-if="activeName === 'invoice'" class="second"> | 
 |  |  |           <!-- <FollowupRecords :isDetail="true" /> --> | 
 |  |  |           <SaleInvoice :isDetail="true" :add-config="addConfig" :source-type="2" /> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |     </el-drawer> | 
 |  |  | 
 |  |  | import ClientServiceOrder from "@/views/service/clientServiceOrder" | 
 |  |  | import Status from "@/common/const/salesFixedStatus" | 
 |  |  | import CommonFormTableView from "@/components/makepager/CommonFormTableView" | 
 |  |  | import CollectionPlan from "@/views/other/payment/collectionPlan" | 
 |  |  | import Receipt from "@/views/other/payment/receipt" | 
 |  |  | import SaleInvoice from "@/views/other/payment/saleInvoice" | 
 |  |  | export default { | 
 |  |  |   name: "DetailSpecification", | 
 |  |  |   props: { | 
 |  |  | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   components: { ClientServiceOrder, CommonFormTableView }, | 
 |  |  |   components: { ClientServiceOrder, CommonFormTableView, CollectionPlan, Receipt, SaleInvoice }, | 
 |  |  |   computed: {}, | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  | 
 |  |  |       showSummary: { | 
 |  |  |         show: true, | 
 |  |  |         total: true, | 
 |  |  |         sumProp: ["other1", "other2", "other3", "other4"], | 
 |  |  |         mergeNumber: 3 | 
 |  |  |         sumProp: ["amount", "price", "total"], | 
 |  |  |         mergeNumber: 1 | 
 |  |  |       }, | 
 |  |  |       productTableList: {} | 
 |  |  |       productTableList: {}, | 
 |  |  |       addConfig: {} | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created() { | 
 |  |  |     this.setData(this.detailConfig.infomation) | 
 |  |  |     this.addConfig = { | 
 |  |  |       keywordType: "服务合同", | 
 |  |  |       keyword: this.detailConfig.infomation.number, | 
 |  |  |       id: this.detailConfig.infomation.id, | 
 |  |  |       client_name: this.detailConfig.infomation.client.name, | 
 |  |  |       contact_name: this.detailConfig.infomation.contact_name, | 
 |  |  |       client_id: this.detailConfig.infomation.client_id, | 
 |  |  |       contact_id: this.detailConfig.infomation.contact_id, | 
 |  |  |       amountTotal: this.detailConfig.infomation.amountTotal, | 
 |  |  |       salesDetailsId:this.serviceContractDetail.infomation.salesDetailsId, | 
 |  |  |       serviceContractId:this.serviceContractDetail.infomation.id | 
 |  |  |     } | 
 |  |  |     this.setTableForm() | 
 |  |  |   }, | 
 |  |  |   mounted() {}, | 
 |  |  | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |           leftStr: "负责人", | 
 |  |  |           leftValue: item.memberId, | 
 |  |  |           leftValue: item.member.username, | 
 |  |  |           rightStr: "联系人姓名", | 
 |  |  |           rightValue: item.contactId | 
 |  |  |           rightValue: item.contact.name | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |           leftStr: "销售机会", | 
 |  |  | 
 |  |  |         }, | 
 |  |  |         { | 
 |  |  |           leftStr: "创建时间", | 
 |  |  |           leftValue: "", | 
 |  |  |           leftValue: item.createTime, | 
 |  |  |           rightStr: "数量合计", | 
 |  |  |           rightValue: "" | 
 |  |  |         } | 
 |  |  | 
 |  |  |       if (value === "basic") { | 
 |  |  |         this.isBasicExpand = !this.isBasicExpand | 
 |  |  |       } else if (value === "dynamic") { | 
 |  |  |         this.isDynamicExpand = !this.isLabelExpand | 
 |  |  |         this.isDynamicExpand = !this.isDynamicExpand | 
 |  |  |       } else if (value === "delivery") { | 
 |  |  |         this.isDeliveryExpand = !this.isDeliveryExpand | 
 |  |  |       } else if (value === "termsConditions") { | 
 |  |  | 
 |  |  |     }, | 
 |  |  |     setTableForm() { | 
 |  |  |       this.productTableList = { | 
 |  |  |         tableData: [ | 
 |  |  |           { | 
 |  |  |             id: "1", | 
 |  |  |             productName: "上海有限公司", | 
 |  |  |             other0: "ZDYBD03-1", | 
 |  |  |             other1: "12", | 
 |  |  |             other2: "5.00", | 
 |  |  |             other4: "3.00", | 
 |  |  |             other3: "2.00" | 
 |  |  |           } | 
 |  |  |         ], | 
 |  |  |         tableData: this.detailConfig.infomation.products, | 
 |  |  |         tableColumn: [ | 
 |  |  |           { label: "#", prop: "id", width: 40 }, | 
 |  |  |           { label: "含税单价", prop: "other9", input: true }, | 
 |  |  |           { label: "产品名称", prop: "productName", input: true, isRequird: true }, | 
 |  |  |           { label: "产品编号", prop: "other0" }, | 
 |  |  |           { label: "数量", prop: "other1", input: true, isRequird: true }, | 
 |  |  |           { label: "折扣率(%)", prop: "other6", input: true }, | 
 |  |  |           { label: "不含税单价", prop: "other7", input: true }, | 
 |  |  |           { label: "折扣额", prop: "other2" }, | 
 |  |  |           { label: "税(销售)", prop: "other7", input: true }, | 
 |  |  |           { label: "实际含税单价", prop: "other3" }, | 
 |  |  |           { label: "不含税金额", prop: "other4" }, | 
 |  |  |           { label: "价税合计", prop: "other3", input: true }, | 
 |  |  |           { label: "描述", prop: "other8" }, | 
 |  |  |           { label: "源单类型", prop: "other5" }, | 
 |  |  |           { label: "源单", prop: "other6" } | 
 |  |  |           { label: "产品名称", prop: "name", productName: true, isRequird: true }, | 
 |  |  |           { label: "产品编号", prop: "number" }, | 
 |  |  |           { label: "数量", prop: "amount", inputNumber: true, isRequird: true }, | 
 |  |  |           { label: "销售单价", prop: "price", inputFloat: true }, | 
 |  |  |           { label: "价税合计", prop: "total", inputFloat: true } | 
 |  |  |         ] | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  | 
 |  |  |               align-items: center; | 
 |  |  |               font-size: 14px; | 
 |  |  |               font-family: PingFangSC; | 
 |  |  |               min-height: 40px; | 
 |  |  |               // padding: 5px 0; | 
 |  |  |               .content-title { | 
 |  |  |                 width: 320px; |