index.vue 38 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986
  1. <template>
  2. <PageMain class="vh100">
  3. <el-tabs v-model="activeName" class="demo-tabs h-full" @tab-click="handleTabsClick">
  4. <el-tab-pane label="车险应收" name="1" class="h-full">
  5. <el-form v-model="receivableForm" label-width="100">
  6. <el-row :gutter="20">
  7. <el-col :span="8">
  8. <el-form-item label="车牌号">
  9. <el-input v-model="receivableForm.licenseNo" placeholder="请输入" clearable></el-input>
  10. </el-form-item>
  11. </el-col>
  12. <el-col :span="8">
  13. <el-form-item label="保险公司">
  14. <el-cascader filterable clearable placeholder="请选择" v-model="receivableForm.companyId"
  15. :options="companyList" :props="companyIdprops" style="width: 100%;" @change="handleCompanyChange" />
  16. </el-form-item>
  17. </el-col>
  18. <el-col :span="8">
  19. <el-form-item label="签单时间">
  20. <el-date-picker v-model="receivableForm.signingTime" type="daterange" range-separator="至"
  21. start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
  22. </el-form-item>
  23. </el-col>
  24. <el-col :span="8">
  25. <el-form-item label="订单号">
  26. <el-input v-model="receivableForm.orderNo" placeholder="请输入" clearable></el-input>
  27. </el-form-item>
  28. </el-col>
  29. <el-col :span="8">
  30. <el-form-item label="业务来源">
  31. <el-select v-model="receivableForm.typeAttr" placeholder="请选择" clearable>
  32. <el-option label="团队" value="5"></el-option>
  33. <el-option label="个代" value="6"></el-option>
  34. <el-option label="渠道" value="7"></el-option>
  35. <el-option label="电销组" value="8"></el-option>
  36. </el-select>
  37. </el-form-item>
  38. </el-col> <el-col :span="8">
  39. <el-form-item label="结算状态">
  40. <el-select v-model="receivableForm.settlementStatus" placeholder="请选择" clearable>
  41. <el-option label="未结算" value="0"></el-option>
  42. <el-option label="已结算" value="1"></el-option>
  43. </el-select>
  44. </el-form-item>
  45. </el-col> <el-col :span="8">
  46. <el-form-item label="增加类型">
  47. <el-input v-model="receivableForm.addType" placeholder="请输入" clearable></el-input>
  48. </el-form-item>
  49. </el-col>
  50. <el-col :span="8">
  51. <el-form-item label="出单协议">
  52. <el-select v-model="receivableForm.agreementId" placeholder="请选择" clearable>
  53. <el-option label="1" value="1"></el-option>
  54. </el-select>
  55. </el-form-item>
  56. </el-col>
  57. <el-col :span="8">
  58. <el-form-item label="出单机构">
  59. <el-cascader style="width: 100%" v-model="receivableForm.deptId" placeholder="请选择" :options="deptOption"
  60. :props="cascaderProps" clearable></el-cascader>
  61. </el-form-item>
  62. </el-col>
  63. <el-col :span="8">
  64. <el-form-item label="险种">
  65. <el-select v-model="receivableForm.riskCode" placeholder="请选择" clearable>
  66. <el-option v-for="(item, index) in insuranceType" :label="item.label" :value="item.label"></el-option>
  67. </el-select>
  68. </el-form-item>
  69. </el-col>
  70. <el-col :span="8">
  71. <el-form-item label="订单类型">
  72. <el-select v-model="receivableForm.orderType" placeholder="请选择" clearable>
  73. <el-option label="车险录入" value="1"></el-option>
  74. <el-option label="代客录单" value="2"></el-option>
  75. <el-option label="外部订单" value="3"></el-option>
  76. </el-select>
  77. </el-form-item>
  78. </el-col>
  79. <el-col :span="8">
  80. <el-form-item label="被保人">
  81. <el-input v-model="receivableForm.insuredName" placeholder="请输入" clearable></el-input>
  82. </el-form-item>
  83. </el-col>
  84. <el-col v-show="isTrue" :span="8">
  85. <el-form-item label="交强险保单号">
  86. <el-input v-model="receivableForm.jqPolicyNo" placeholder="请输入" clearable></el-input>
  87. </el-form-item>
  88. </el-col>
  89. <el-col v-show="isTrue" :span="8">
  90. <el-form-item label="商业险保单号">
  91. <el-input v-model="receivableForm.syPolicyNo" placeholder="请输入" clearable></el-input>
  92. </el-form-item>
  93. </el-col>
  94. <el-col v-show="isTrue" :span="8">
  95. <el-form-item label="对接人">
  96. <el-input v-model="receivableForm.dockingPerson" placeholder="请输入" clearable></el-input>
  97. </el-form-item>
  98. </el-col>
  99. <el-col v-show="isTrue" :span="8">
  100. <el-form-item label="交强起保时间">
  101. <el-date-picker v-model="receivableForm.jqDate" type="daterange" range-separator="至"
  102. start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
  103. </el-form-item>
  104. </el-col>
  105. <el-col v-show="isTrue" :span="8">
  106. <el-form-item label="商业起保时间">
  107. <el-date-picker v-model="receivableForm.syDate" type="daterange" range-separator="至"
  108. start-placeholder="开始时间" end-placeholder="结束时间" format="YYYY-MM-DD" value-format="YYYY-MM-DD" />
  109. </el-form-item>
  110. </el-col>
  111. <el-col :span="24" style="display: flex; align-items: center; justify-content: flex-end">
  112. <el-button type="primary" @click="getPlatFormReceivableList">搜索</el-button>
  113. <el-button plain @click="reset">重置</el-button>
  114. <span class="icon_s">
  115. <span @click="isTrue = !isTrue">高级搜索</span>
  116. <el-icon class="is_icon" :class="{ 'is_down': isTrue }">
  117. <ArrowDown />
  118. </el-icon>
  119. </span>
  120. </el-col>
  121. </el-row>
  122. </el-form>
  123. <el-row :gutter="8" style="margin: 20px 0" class="flex a-c ">
  124. <span class="flex col-160 m-r-8 bg-F9">
  125. <el-checkbox class="p-w-12" @change="selectAll" v-model="selectAllValue"></el-checkbox>&nbsp;
  126. <el-select class="select-all width-100" placeholder="全选" v-model="selectType" @change="selectTypeChange">
  127. <el-option key="all" value="all" :label="`选中所有数据${total1}条`"></el-option>
  128. <el-option key="cur" value="cur" label="选中本页数据"></el-option>
  129. </el-select>
  130. </span>
  131. <div class="col-108 m-r-8">
  132. <el-button class="radius-2px width-100" type="primary" @click="addShow = true">添加应收</el-button>
  133. </div>
  134. <div class="col-108 m-r-8">
  135. <el-button class="radius-2px width-100" type="primary" @click="batchSettle">批量结算</el-button>
  136. </div>
  137. <div class="col-108 m-r-8">
  138. <el-button class="radius-2px width-100" type="primary" @click="dropdownCommand('删除')">删除</el-button>
  139. </div>
  140. <div class="col-108 m-r-8">
  141. <el-button class="radius-2px width-100" type="primary" @click="exportPlatformReceivable">导出</el-button>
  142. </div>
  143. <span class="col-108 m-r-8">
  144. <el-button class="radius-2px width-100" :disabled="selectedList.some(item => item.settlementStatusName === '已结算')" @click="handleBatchEdit">批量修改比例</el-button>
  145. </span>
  146. <span class="col-108 m-r-8">
  147. 已选: <span class="text-red">{{ selectedList.length }}</span> 条
  148. </span>
  149. <span>应收金额总计:¥{{ receivedAmountTotal || 0 }}</span>
  150. </el-row>
  151. <el-table :data="receiveData" :height="isTrue ? 'calc(100% - 446px)' : 'calc(100% - 346px)'"
  152. style="width: 100%; margin-top: 20px;" ref="ReceiveDataRef1" @select="handleSelectChange1"
  153. @select-all="handleSelectAll1">
  154. <el-table-column type="selection" width="50" fixed="left"></el-table-column>
  155. <el-table-column prop="signingTime" label="签单时间" width="150"></el-table-column>
  156. <el-table-column prop="typeAttrName" label="业务来源" width="120"></el-table-column>
  157. <el-table-column prop="orderNo" label="订单号" width="150"></el-table-column>
  158. <el-table-column prop="companyName" label="保险公司" width="120"></el-table-column>
  159. <el-table-column prop="contactPerson" label="对接人" width="100"></el-table-column>
  160. <el-table-column prop="deptName" label="出单机构" width="120"></el-table-column>
  161. <el-table-column prop="agreementName" label="出单协议" width="150"></el-table-column>
  162. <el-table-column prop="orderType" label="订单类型" width="100"></el-table-column>
  163. <el-table-column prop="licenseNo" label="车牌号" width="100"></el-table-column>
  164. <el-table-column prop="receivableAmount" label="应收金额" width="100"> </el-table-column>
  165. <el-table-column prop="productName" label="险种" width="100"></el-table-column>
  166. <el-table-column prop="settlementStatusName" label="结算状态" width="100"></el-table-column>
  167. <el-table-column prop="insuredPerson" label="被保人" width="100"></el-table-column>
  168. <el-table-column prop="jqPremium" label="交强险保费" width="100"></el-table-column>
  169. <el-table-column prop="jqSuperviseCostsProportion" label="交强险手续费比例" width="150"></el-table-column>
  170. <el-table-column prop="jqTotalProportion" label="交强险总比例" width="150"></el-table-column>
  171. <el-table-column prop="jqOtherCostsProportion" label="交强险跟单比例" width="150"></el-table-column>
  172. <el-table-column prop="jqReceivablePremium" label="交强应收金额" width="150"></el-table-column>
  173. <!-- <el-table-column prop="jqSuperviseCostsProportion" label="交强入口比例" width="120">
  174. <template #default="scope">
  175. {{ scope.row.insFeeOrders?.jqInletRatio || '-' }}
  176. </template>
  177. </el-table-column> -->
  178. <el-table-column prop="taxPremium" label="车船税" width="100"></el-table-column>
  179. <el-table-column prop="syPremium" label="商业险保费" width="100"></el-table-column>
  180. <el-table-column prop="sySuperviseCostsProportion" label="商业险手续费比例" width="150"></el-table-column>
  181. <el-table-column prop="syTotalProportion" label="商业险总比例" width="150"></el-table-column>
  182. <el-table-column prop="syOtherCostsProportion" label="商业险跟单比例" width="150"></el-table-column>
  183. <el-table-column prop="syReceivablePremium" label="商业应收金额" width="150"></el-table-column>
  184. <!-- <el-table-column prop="sySuperviseCostsProportion" label="商业入口比例" width="120">
  185. <template #default="scope">
  186. {{ scope.row.insFeeOrders?.syInletRatio || '-' }}
  187. </template>
  188. </el-table-column> -->
  189. <el-table-column prop="jyPremium" label="非车保费" width="100"></el-table-column>
  190. <el-table-column prop="jySuperviseCostsProportion" label="非车手续费比例" width="150"></el-table-column>
  191. <el-table-column prop="jyTotalProportion" label="非车总比例" width="150"></el-table-column>
  192. <el-table-column prop="jyOtherCostsProportion" label="非车跟单比例" width="150"></el-table-column>
  193. <el-table-column prop="jyTotalPremiums" label="非车应收金额" width="150"></el-table-column>
  194. <!-- <el-table-column prop="sySuperviseCostsProportion" label="非车入口比例" width="120">
  195. <template #default="scope">
  196. {{ scope.row.insFeeOrders?.jyInletRatio || '-' }}
  197. </template>
  198. </el-table-column> -->
  199. <el-table-column prop="receivableAmount" label="总应收金额" width="100"></el-table-column>
  200. <el-table-column prop="jqPolicyNo" label="交强险保单号" width="150"></el-table-column>
  201. <el-table-column prop="syPolicyNo" label="商业险保单号" width="150"></el-table-column>
  202. <el-table-column prop="jqStartDate" label="交强险起保日期" width="150"></el-table-column>
  203. <el-table-column prop="syStartDate" label="商业险起保日期" width="150"></el-table-column>
  204. <el-table-column prop="updateBy" label="修改人" width="100"></el-table-column>
  205. <el-table-column prop="createTime" label="创建时间" width="150"></el-table-column>
  206. <el-table-column label="操作" width="180" fixed="right">
  207. <template #default="scope">
  208. <el-button link type="primary" :disabled="scope.row.settlementStatusName == '已结算'"
  209. @click="ticketRef.openSettlement([scope.row], scope.row.contactPersonPhone)">结算</el-button>
  210. <el-button link type="primary" @click="toEdit(scope.row)">编辑</el-button>
  211. <el-button link type="primary" :disabled="scope.row.settlementStatusName == '已结算'"
  212. @click="toDelete([scope.row.id])">删除</el-button>
  213. </template>
  214. </el-table-column>
  215. </el-table>
  216. <div class="pagination">
  217. <el-pagination v-model:current-page="pages" v-model:page-size="size" :page-sizes="[10, 20, 30, 40]"
  218. layout="total, sizes, prev, pager, next, jumper" :total="total1" @size-change="handleSizeChange"
  219. @current-change="handleCurrentChange"></el-pagination>
  220. </div>
  221. </el-tab-pane>
  222. </el-tabs>
  223. <el-dialog :close-on-click-modal="false" v-model="addShow" width="800" title="添加应收">
  224. <div class="add-content">
  225. <el-input v-model="addSearchValue" style="max-width: 500px" :placeholder="`请输入${placeholder}`"
  226. class="input-with-select">
  227. <template #prepend>
  228. <el-select v-model="addSelectType" placeholder="请选择" style="width: 120px"
  229. @change="handleAddSelectTypeChange">
  230. <el-option label="订单号查询" value="1" />
  231. <el-option label="交强险保单号查询" value="2" />
  232. <el-option label="商业险保单号查询" value="3" />
  233. </el-select>
  234. </template>
  235. <template #append>
  236. <el-button type="primary" @click="getUnauditedOrder">搜索</el-button>
  237. </template>
  238. </el-input>
  239. <el-table :data="selectingData" style="width: 100%;">
  240. <el-table-column prop="a" label="费用状态" width="100"></el-table-column>
  241. <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
  242. <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
  243. <el-table-column prop="jqPolicyNo" label="交强保单号" width="120"></el-table-column>
  244. <el-table-column prop="syPolicyNo" label="商业保单号" width="120"></el-table-column>
  245. <el-table-column prop="jqPremium" label="交强保费" width="100"></el-table-column>
  246. <el-table-column prop="jqSuperviseCostsProportion" label="交强手续费比例" width="100"></el-table-column>
  247. <el-table-column prop="syPremium" label="商业保费" width="100"></el-table-column>
  248. <el-table-column prop="sySuperviseCostsProportion" label="商业手续费比例" width="100"></el-table-column>
  249. <el-table-column prop="a" label="应收金额" width="100"></el-table-column>
  250. <el-table-column label="操作" fixed="right" width="100">
  251. <template #default="scope">
  252. <el-button link type="primary" @click="handleToAdd(scope.row)">添加</el-button>
  253. </template>
  254. </el-table-column>
  255. </el-table>
  256. <p>已添加的应收单据</p>
  257. <el-table :data="selectedData" style="width: 100%;">
  258. <el-table-column prop="a" label="费用状态" width="100"></el-table-column>
  259. <el-table-column prop="signingTime" label="签单时间" width="120"></el-table-column>
  260. <el-table-column prop="licenseNo" label="车牌号" width="120"></el-table-column>
  261. <el-table-column prop="jqPolicyNo" label="交强保单号" width="120"></el-table-column>
  262. <el-table-column prop="syPolicyNo" label="商业保单号" width="120"></el-table-column>
  263. <el-table-column prop="jqPremium" label="交强保费" width="100"></el-table-column>
  264. <el-table-column prop="jqSuperviseCostsProportion" label="交强手续费比例" width="100"></el-table-column>
  265. <el-table-column prop="syPremium" label="商业保费" width="100"></el-table-column>
  266. <el-table-column prop="sySuperviseCostsProportion" label="商业手续费比例" width="100"></el-table-column>
  267. <el-table-column prop="a" label="应收金额" width="100"></el-table-column>
  268. <el-table-column label="操作" fixed="right" width="100">
  269. <template #default="scope">
  270. <el-button link type="primary" @click="handleDel(scope.row)">删除</el-button>
  271. </template>
  272. </el-table-column>
  273. </el-table>
  274. </div>
  275. <template #footer>
  276. <el-button class="border-[#0083FF] color-[#0083FF]" plain @click="addShow = false">取消</el-button>
  277. <el-button type="primary" @click="handleAddSubmit">确定</el-button>
  278. </template>
  279. </el-dialog>
  280. <el-dialog :close-on-click-modal="false" v-model="batchShow" width="800"
  281. :title="`选中修改(已选${selectedData.length}条数据)`">
  282. <div style="display: flex; align-items: center; justify-content: center; margin-bottom: 10px">
  283. 下载「标准导入模板」,编辑后上传;系统将自动匹配相关字段
  284. <el-button link type="primary" @click="exportData">下载模板</el-button>
  285. </div>
  286. <el-upload class="upload-demo" drag accept=".xls, .xlsx">
  287. <el-icon class="el-icon--upload"><upload-filled /></el-icon>
  288. <div class="el-upload__text">
  289. 点击或将文件拖拽到这里上传
  290. </div>
  291. <a style="color: #999; font-size: 12px">目前支持的文件类型为*.xls, *.xlsx</a>
  292. </el-upload>
  293. </el-dialog>
  294. <el-dialog :close-on-click-modal="false" v-model="invoiceShow" width="600" title="提示">
  295. <el-radio-group v-model="invoiceRadio">
  296. <el-radio :value="item.contactPersonPhone" v-for="(item, index) in options">{{ item.contactPerson }}</el-radio>
  297. </el-radio-group>
  298. <template #footer>
  299. <el-button class="border-[#0083FF] color-[#0083FF]" plain @click="invoiceShow = false">取消</el-button>
  300. <el-button type="primary" @click="handleInvoiceSubmit">确定</el-button>
  301. </template>
  302. </el-dialog>
  303. <el-dialog :close-on-click-modal="false" title="批量修改" v-model="batchEditShow" width="700">
  304. <el-tabs v-model="subActiveName" class="demo-tabs">
  305. <el-tab-pane label="User" name="first">
  306. <template #label>选中修改({{ selectedList.length }})</template>
  307. <el-form :model="editForm">
  308. <el-radio v-model="feeRate">手续费比例</el-radio>
  309. <el-row :gutter="20">
  310. <el-col :span="12">
  311. <el-form-item label="交强险手续费比例">
  312. <el-input v-model="editForm.jqSuperviseCostsProportion">
  313. <template #append>%</template>
  314. </el-input>
  315. </el-form-item>
  316. </el-col>
  317. <el-col :span="12">
  318. <el-form-item label="交强跟单费比例">
  319. <el-input v-model="editForm.jqOtherCostsProportion">
  320. <template #append>%</template>
  321. </el-input>
  322. </el-form-item>
  323. </el-col>
  324. <el-col :span="12">
  325. <el-form-item label="商业险手续费比例">
  326. <el-input v-model="editForm.sySuperviseCostsProportion">
  327. <template #append>%</template>
  328. </el-input>
  329. </el-form-item>
  330. </el-col>
  331. <el-col :span="12">
  332. <el-form-item label="商业跟单费比例">
  333. <el-input v-model="editForm.syOtherCostsProportion">
  334. <template #append>%</template>
  335. </el-input>
  336. </el-form-item>
  337. </el-col>
  338. <el-col :span="12">
  339. <el-form-item label="驾意险手续费比例">
  340. <el-input v-model="editForm.jySuperviseCostsProportion">
  341. <template #append>%</template>
  342. </el-input>
  343. </el-form-item>
  344. </el-col>
  345. <el-col :span="12">
  346. <el-form-item label="驾意跟单费比例">
  347. <el-input v-model="editForm.jyOtherCostsProportion">
  348. <template #append>%</template>
  349. </el-input>
  350. </el-form-item>
  351. </el-col>
  352. </el-row>
  353. <el-radio v-model="signTime">签单时间</el-radio>
  354. <el-row :gutter="20">
  355. <el-col :span="12">
  356. <el-form-item label="">
  357. <el-date-picker v-model="editForm.signingTime" type="datetime" format="YYYY-MM-DD HH:mm:ss"
  358. value-format="YYYY-MM-DD HH:mm:ss"></el-date-picker>
  359. </el-form-item>
  360. </el-col>
  361. </el-row>
  362. <el-radio v-model="people">对接人</el-radio>
  363. <el-row :gutter="20">
  364. <el-col :span="12">
  365. <el-form-item label="姓名">
  366. <el-input v-model="editForm.contractUserName"></el-input>
  367. </el-form-item>
  368. </el-col>
  369. <el-col :span="12">
  370. <el-form-item label="手机号">
  371. <el-input v-model="editForm.contractUserPhone"></el-input>
  372. </el-form-item>
  373. </el-col>
  374. </el-row>
  375. </el-form>
  376. </el-tab-pane>
  377. <el-tab-pane label="Config" name="second">
  378. <template #label>导入修改</template>
  379. <div style="display: flex; align-items: center; justify-content: center; margin-bottom: 10px">
  380. 下载「标准导入模板」,编辑后上传;系统将自动匹配相关字段
  381. <el-button link type="primary" @click="exportData">下载模板</el-button>
  382. </div>
  383. <el-upload class="upload-demo" drag accept=".xls, .xlsx" :auto-upload="false" @change="uploadJYFile">
  384. <el-icon class="el-icon--upload"><upload-filled /></el-icon>
  385. <div class="el-upload__text">
  386. 点击或将文件拖拽到这里上传
  387. </div>
  388. <a style="color: #999; font-size: 12px">目前支持的文件类型为*.xls, *.xlsx</a>
  389. </el-upload>
  390. <div v-if="importModifyCallback">
  391. <div>
  392. 您将导入 <span style="color:#409eff;">{{ importModifyCallback?.failedNumber +
  393. importModifyCallback?.successNumber
  394. ||
  395. 0 }}
  396. </span> 条数据,其中 <span style="color:#409eff;">{{ importModifyCallback?.successNumber || 0 }} </span>
  397. 条正常导入;<span style="color: red;">{{ importModifyCallback?.failedNumber || 0 }}</span> 条不符合要求无法导入。
  398. </div>
  399. <el-button type="primary" link @click="downloadImportFailedData(importModifyCallback)">下载导入失败文件</el-button>
  400. </div>
  401. </el-tab-pane>
  402. </el-tabs>
  403. <template #footer>
  404. <el-button class="border-[#0083FF] color-[#0083FF]" plain @click="batchEditShow = false">取消</el-button>
  405. <el-button type="primary" @click="handleBatchEditSubmit()">确定</el-button>
  406. </template>
  407. </el-dialog>
  408. </PageMain>
  409. <ticket ref="ticketRef" />
  410. </template>
  411. <script setup lang="ts">
  412. import { ElMessage, ElMessageBox } from "element-plus";
  413. import { useRouter } from 'vue-router'
  414. import ticket from "./ticket.vue";
  415. import api from '@/api'
  416. let myRouter = useRouter()
  417. let ticketRef = ref(null)
  418. let activeName = ref('1')
  419. let subActiveName = ref('first')
  420. let receivedAmountTotal = ref(0)
  421. const handleTabsClick = (e) => {
  422. console.log(e.props.name)
  423. activeName.value = e.props.name
  424. if (e.props.name == '1') {
  425. getPlatFormReceivableList()
  426. } else if (e.props.name == '2') {
  427. getPlatformReceivableList()
  428. }
  429. isTrue.value = false
  430. receivableForm.value = {}
  431. selectedList.value = []
  432. }
  433. let isTrue = ref(false)
  434. let receivableForm = ref({})
  435. const toDelete = (ids) => {
  436. ElMessageBox.confirm(
  437. '确定要删除吗',
  438. '删除应收订单',
  439. {
  440. confirmButtonText: '确定',
  441. type: 'error',
  442. center: true,
  443. confirmButtonClass: 'el-button--danger',
  444. }
  445. ).then(() => {
  446. api.financeApi.deleteIncomesByIds(ids).then((res: any) => {
  447. if (res.code == 200) {
  448. ElMessage.success('删除成功')
  449. reset()
  450. }
  451. })
  452. })
  453. }
  454. const reset = () => {
  455. receivableForm.value = {}
  456. pages.value = 1
  457. size.value = 10
  458. if (activeName.value == '1') {
  459. getPlatFormReceivableList()
  460. } else if (activeName.value == '2') {
  461. getPlatformReceivableList()
  462. }
  463. }
  464. const companyIdprops = {
  465. expandTrigger: 'hover' as const,
  466. value: 'id',
  467. label: 'name',
  468. checkStrictly: true,
  469. }
  470. // 保险公司选择器改变时触发
  471. const handleCompanyChange = (e) => {
  472. console.log(e)
  473. recordForm.value.companyId = e[e.length - 1] || ''
  474. }
  475. let ReceiveDataRef1 = ref()
  476. // 选中的数据
  477. let selectedList = ref([])
  478. let allData = ref([])
  479. // 全选的类型
  480. let selectType = ref('')
  481. // 外部全选是否勾选
  482. let selectAllValue = ref(false)
  483. // 外部的全选
  484. const selectAll = (type: boolean) => {
  485. if (type) {
  486. if (selectType.value) {
  487. receiveData.value.forEach((item) => {
  488. ReceiveDataRef1.value!.toggleRowSelection(item, true)
  489. })
  490. if (selectType.value == 'cur') {
  491. selectedList.value = receiveData.value
  492. } else {
  493. selectedList.value = allData.value
  494. }
  495. }
  496. } else {
  497. receiveData.value.forEach(item => {
  498. ReceiveDataRef1.value!.toggleRowSelection(item, false)
  499. })
  500. selectType.value = ''
  501. selectedList.value = []
  502. }
  503. }
  504. // 全选类型改变
  505. const selectTypeChange = (type) => {
  506. selectAllValue.value = true
  507. receiveData.value.forEach(item => {
  508. ReceiveDataRef1.value!.toggleRowSelection(item, true)
  509. })
  510. if (type == 'cur') {
  511. selectedList.value = receiveData.value
  512. } else if (type == 'all') {
  513. selectedList.value = allData.value
  514. }
  515. }
  516. let options = ref([])
  517. const dropdownCommand = (e) => {
  518. if (e === '数据导入') {
  519. batchShow.value = true
  520. }
  521. if (e === '删除') {
  522. if (selectedList.value.length === 0) {
  523. ElMessage.warning('请选择删除的数据')
  524. return
  525. }
  526. toDelete(selectedList.value.map(item => item.id))
  527. }
  528. }
  529. let total1 = ref(0)
  530. let total2 = ref(0)
  531. let receiveData = ref([])
  532. // 应收添加
  533. let addShow = ref(false)
  534. let addSearchValue = ref('1932252903508697088')
  535. let placeholder = ref('订单号查询')
  536. let addSelectType = ref('1')
  537. const handleAddSelectTypeChange = (e) => {
  538. switch (e) {
  539. case '1':
  540. placeholder.value = '订单号查询'
  541. break;
  542. case '2':
  543. placeholder.value = '交强险保单号查询'
  544. break;
  545. case '3':
  546. placeholder.value = '商业险保单号查询'
  547. break;
  548. }
  549. }
  550. const getUnauditedOrder = () => {
  551. api.financeApi.getUnauditedOrder({
  552. orderNo: addSearchValue.value,
  553. agreementType: '1',
  554. queryType: activeName.value == '1' ? '1' : activeName.value == '2' ? '3' : ''
  555. }).then((res: any) => {
  556. if (res.code == 200) {
  557. selectingData.value = res.data
  558. }
  559. })
  560. }
  561. const exportData = () => {
  562. let params = {
  563. licenseNo: receivableForm.value?.licenseNo,
  564. companyId: receivableForm.value?.companyId,
  565. signingStartTime: receivableForm.value?.signingTime?.[0],
  566. signingEndTime: receivableForm.value?.signingTime?.[1],
  567. orderNo: receivableForm.value?.orderNo,
  568. agreementId: receivableForm.value?.agreementId,
  569. deptId: receivableForm.value?.deptId,
  570. riskCode: receivableForm.value?.riskCode,
  571. orderType: receivableForm.value?.orderType,
  572. insuredName: receivableForm.value?.insuredName,
  573. jqPolicyNo: receivableForm.value?.jqPolicyNo,
  574. syPolicyNo: receivableForm.value?.syPolicyNo,
  575. dockingPerson: receivableForm.value?.dockingPerson,
  576. jqStartDate: receivableForm.value?.jqDate?.[0],
  577. jqEndDate: receivableForm.value?.jqDate?.[1],
  578. syStartDate: receivableForm.value?.syDate?.[0],
  579. syEndDate: receivableForm.value?.syDate?.[1],
  580. queryType: activeName.value == '1' ? '1' : activeName.value == '2' ? '3' : ''
  581. }
  582. api.financeApi.exportReceivable(params).then((res: any) => {
  583. if (res.code == 200) {
  584. const link = document.createElement('a');
  585. link.href = res.msg;
  586. link.download = '';
  587. // 触发下载
  588. document.body.appendChild(link);
  589. link.click();
  590. document.body.removeChild(link);
  591. } else {
  592. ElMessage({
  593. message: res.msg,
  594. type: 'warning'
  595. })
  596. }
  597. })
  598. }
  599. // 批量操作数据导入
  600. let selectingData = ref([])
  601. let selectedData = ref([])
  602. const handleToAdd = (row) => {
  603. if (selectedData.value.length < 1) {
  604. selectedData.value.push(row)
  605. } else {
  606. if (!selectedData.value.some(item => item.id === row.id)) {
  607. selectedData.value.push(row)
  608. }
  609. }
  610. }
  611. const handleDel = (row) => {
  612. selectedData.value = selectedData.value.filter(item => item.id != row.id)
  613. }
  614. const handleAddSubmit = () => {
  615. if (selectedData.value.length < 1) {
  616. ElMessage({
  617. message: '请选择要添加的数据!',
  618. type: 'warning'
  619. })
  620. return
  621. }
  622. let arr = selectedData.value?.map(item => {
  623. return item.orderNo
  624. })
  625. api.financeApi.addReceivable({
  626. orderNo: [...arr],
  627. queryType: activeName.value == '1' ? '1' : activeName.value == '2' ? '2' : ''
  628. }).then((res: any) => {
  629. if (res.code == 200) {
  630. ElMessage({
  631. message: res.msg,
  632. type: 'success'
  633. })
  634. addShow.value = false
  635. getPlatFormReceivableList()
  636. getPlatformReceivableList()
  637. }
  638. })
  639. }
  640. let batchShow = ref(false)
  641. // 应收开票
  642. let invoiceShow = ref(false)
  643. let invoiceRadio = ref(null)
  644. const handleInvoiceSubmit = () => {
  645. const arr = selectedList.value.map(v => ({ id: v.id, orderNo: v.orderNo }))
  646. myRouter.push({
  647. name: 'Platformticket',
  648. query: {
  649. contactPersonPhone: invoiceRadio.value,
  650. selectedList: JSON.stringify(arr),
  651. invoiceType: "5"
  652. }
  653. })
  654. }
  655. const handleSelectChange1 = (row: any) => {
  656. console.log(row)
  657. if (row.length > 0) {
  658. selectedList.value = row
  659. } else {
  660. selectedList.value = []
  661. }
  662. }
  663. const handleSelectAll1 = (row: any) => {
  664. if (row.length > 0) {
  665. selectedList.value = row
  666. } else {
  667. selectedList.value = []
  668. }
  669. }
  670. // 批量修改比例
  671. let batchEditShow = ref(false)
  672. let feeRate = ref(null)
  673. let signTime = ref(null)
  674. let people = ref(null)
  675. let editForm = ref({})
  676. const handleBatchEdit = () => {
  677. if (selectedList.value.length < 1) {
  678. ElMessage({
  679. message: '请选择数据!',
  680. type: 'warning'
  681. })
  682. return
  683. }
  684. editForm.value = {}
  685. batchEditShow.value = true
  686. }
  687. const handleBatchEditSubmit = async () => {
  688. const params = {
  689. incomeIds: selectedList.value.map(item => item.id),
  690. ...editForm.value,
  691. updateFlag: "4"
  692. }
  693. const { code, data, msg } = await api.financeApi.batchModify(params)
  694. if (code === 200) {
  695. ElMessage.success(msg)
  696. batchEditShow.value = false
  697. getPlatFormReceivableList()
  698. }
  699. }
  700. let importModifyCallback = ref()// 导入数据回调
  701. const uploadJYFile = async (file) => {
  702. let files = file.raw
  703. const params = new FormData(); // 声明formData数据类型
  704. params.append("file", files);
  705. const { code, data, msg } = await api.financeApi.importPlatformExcel(params)
  706. if (code == 200) {
  707. importModifyCallback.value = data
  708. ElMessage({
  709. message: msg,
  710. type: 'success'
  711. })
  712. }
  713. }
  714. // 下载导入失败文件
  715. const downloadImportFailedData = (item) => {
  716. const link = document.createElement('a');
  717. link.href = item.failFileUrl;
  718. link.download = '';
  719. // 触发下载
  720. document.body.appendChild(link);
  721. link.click();
  722. document.body.removeChild(link);
  723. }
  724. // 分页
  725. let pages = ref(1)
  726. let size = ref(10)
  727. const handleSizeChange = (val) => {
  728. size.value = val
  729. if (activeName.value == '1') {
  730. getPlatFormReceivableList()
  731. } else if (activeName.value == '2') {
  732. getPlatformReceivableList()
  733. }
  734. }
  735. const handleCurrentChange = (val) => {
  736. pages.value = val
  737. if (activeName.value == '1') {
  738. getPlatFormReceivableList()
  739. } else if (activeName.value == '2') {
  740. getPlatformReceivableList()
  741. }
  742. }
  743. // 获取险种
  744. let insuranceType = ref([])
  745. const dictDetails = () => {
  746. api.additionalApi.dictDetails('insurance_type').then((res: any) => {
  747. if (res.code == 200) {
  748. insuranceType.value = res.data
  749. }
  750. })
  751. }
  752. // 保险公司
  753. let companyList = ref([])
  754. const initCompany = () => {
  755. api.agreementApi.findTree({ name: "", systemCode: localStorage.getItem('login_system') }).then((res: any) => {
  756. if (res.code == 200) {
  757. companyList.value = res.data
  758. }
  759. })
  760. }
  761. // 归属
  762. let deptOption = ref([])
  763. const cascaderProps = {
  764. value: 'id',
  765. label: 'name',
  766. children: 'children',
  767. checkStrictly: true,
  768. }
  769. const initDept = () => {
  770. api.insuranceApi.getDeptTree({ sysCode: localStorage.getItem('sysCode') }).then((res: any) => {
  771. if (res.code == 200) {
  772. deptOption.value = res.data
  773. } else {
  774. ElMessage({
  775. message: res.msg,
  776. type: 'warning'
  777. })
  778. }
  779. })
  780. }
  781. // 编辑
  782. const toEdit = (row: any) => {
  783. console.log(row)
  784. myRouter.push({
  785. path: '/finance/auditOrderDetail',
  786. query: {
  787. id: row.orderNo,
  788. jumpType: 'costMsg'
  789. }
  790. })
  791. }
  792. // 车险列表
  793. const getPlatFormReceivableList = () => {
  794. let params = {
  795. ...receivableForm.value,
  796. jqStartDate: receivableForm.value?.jqDate?.[0],
  797. jqEndDate: receivableForm.value?.jqDate?.[1],
  798. syStartDate: receivableForm.value?.syDate?.[0],
  799. syEndDate: receivableForm.value?.syDate?.[1],
  800. queryType: '1'
  801. }
  802. api.financeApi.getPlatFormReceivableList({
  803. ...params,
  804. pages: pages.value,
  805. size: size.value
  806. }).then((res: any) => {
  807. if (res.code == 200) {
  808. receivedAmountTotal.value = res.data.allAmount
  809. receiveData.value = res.data.insPlyIncomePage.records
  810. allData.value = res.data.insPlyIncomeOrders
  811. total1.value = res.data.insPlyIncomePage.total
  812. receiveData.value.forEach(element => {
  813. if (selectedList.value.find(v => v.id === element.id)) {
  814. nextTick(() => {
  815. ReceiveDataRef1.value!.toggleRowSelection(element, true)
  816. })
  817. }
  818. });
  819. }
  820. })
  821. }
  822. // 非车险列表
  823. const getPlatformReceivableList = () => {
  824. let params = {
  825. licenseNo: receivableForm.value?.licenseNo,
  826. companyId: receivableForm.value?.companyId,
  827. signingStartTime: receivableForm.value?.signingTime?.[0],
  828. signingEndTime: receivableForm.value?.signingTime?.[1],
  829. orderNo: receivableForm.value?.orderNo,
  830. agreementId: receivableForm.value?.agreementId,
  831. deptId: receivableForm.value?.deptId,
  832. riskCode: receivableForm.value?.riskCode,
  833. orderType: receivableForm.value?.orderType,
  834. insuredName: receivableForm.value?.insuredName,
  835. jqPolicyNo: receivableForm.value?.jqPolicyNo,
  836. syPolicyNo: receivableForm.value?.syPolicyNo,
  837. dockingPerson: receivableForm.value?.dockingPerson,
  838. jqStartDate: receivableForm.value?.jqDate?.[0],
  839. jqEndDate: receivableForm.value?.jqDate?.[1],
  840. syStartDate: receivableForm.value?.syDate?.[0],
  841. syEndDate: receivableForm.value?.syDate?.[1],
  842. queryType: '3',
  843. }
  844. api.financeApi.getPlatformReceivableList({
  845. ...params,
  846. pageNo: pages.value,
  847. pageSize: size.value
  848. }).then((res: any) => {
  849. if (res.code == 200) {
  850. receiveData.value = res.data.records
  851. total2.value = res.data.total
  852. }
  853. })
  854. }
  855. const exportPlatformReceivable = () => {
  856. let params = {
  857. licenseNo: receivableForm.value?.licenseNo,
  858. companyId: receivableForm.value?.companyId,
  859. signingStartTime: receivableForm.value?.signingTime?.[0],
  860. signingEndTime: receivableForm.value?.signingTime?.[1],
  861. orderNo: receivableForm.value?.orderNo,
  862. agreementId: receivableForm.value?.agreementId,
  863. deptId: receivableForm.value?.deptId,
  864. riskCode: receivableForm.value?.riskCode,
  865. orderType: receivableForm.value?.orderType,
  866. insuredName: receivableForm.value?.insuredName,
  867. jqPolicyNo: receivableForm.value?.jqPolicyNo,
  868. syPolicyNo: receivableForm.value?.syPolicyNo,
  869. dockingPerson: receivableForm.value?.dockingPerson,
  870. jqStartDate: receivableForm.value?.jqDate?.[0],
  871. jqEndDate: receivableForm.value?.jqDate?.[1],
  872. syStartDate: receivableForm.value?.syDate?.[0],
  873. syEndDate: receivableForm.value?.syDate?.[1],
  874. queryType: activeName.value == '1' ? '1' : activeName.value == '2' ? '3' : '',
  875. }
  876. api.financeApi.exportPlatformReceivable(params).then((res: any) => {
  877. if (res.code == 200) {
  878. const link = document.createElement('a');
  879. link.href = res.msg;
  880. link.download = '';
  881. // 触发下载
  882. document.body.appendChild(link);
  883. link.click();
  884. document.body.removeChild(link);
  885. }
  886. })
  887. }
  888. // 批量结算
  889. const batchSettle = () => {
  890. if (selectedList.value.length == 0) {
  891. myRouter.push({
  892. name: 'Platformticket',
  893. query: {
  894. invoiceType: "5"
  895. }
  896. })
  897. } else {
  898. if (selectedList.value.some((item: any) => item.settlementStatusName == '已结算')) {
  899. ElMessage({
  900. message: '存在已结算数据,不能结算!',
  901. type: 'warning'
  902. })
  903. return
  904. }
  905. api.financeApi.queryReceivableContact({
  906. incomeIds: selectedList.value.map((item: any) => item.id)
  907. }).then((res: any) => {
  908. if (res.code == 200) {
  909. options.value = res.data.filter(v => v.contactPersonPhone)
  910. invoiceShow.value = true
  911. }
  912. })
  913. }
  914. }
  915. onMounted(() => {
  916. dictDetails();
  917. initCompany();
  918. initDept();
  919. getPlatFormReceivableList();
  920. })
  921. </script>
  922. <style scoped lang="scss">
  923. @use "@/assets/styles/common/style.scss";
  924. .icon_s {
  925. display: flex;
  926. align-items: center;
  927. justify-content: flex-end;
  928. margin-left: 20px;
  929. color: #00a0f4;
  930. cursor: pointer;
  931. .is_icon {
  932. transition: ease 0.2s;
  933. }
  934. .is_down {
  935. transform: rotate(180deg);
  936. }
  937. }
  938. .add-content {
  939. width: 100%;
  940. max-height: 600px;
  941. }
  942. .pagination {
  943. margin-top: 10px;
  944. display: flex;
  945. justify-content: end;
  946. }
  947. :deep(.el-radio) {
  948. width: 100%;
  949. }
  950. </style>