Elizabeth's proactive approach involves introducing urinal toilet attachment , an ingenious concept that optimizes space and functionality.

summaryDetail.vue 24KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667
  1. <template>
  2. <div class="main-contain summaryDetail">
  3. <div class="position">
  4. <bread-crumb :crumbs='crumbs'></bread-crumb>
  5. </div>
  6. <el-popover
  7. placement="bottom"
  8. width="210"
  9. trigger="click">
  10. <el-button size="small" ref="button_two" @click="open(1)">打印清单</el-button>
  11. <el-button size="small" ref="button_six" @click="open(2)">打印汇总</el-button>
  12. <el-button slot="reference" style="margin:10px 10px;float: right" type="primary" size="small" >打印</el-button>
  13. </el-popover>
  14. <div class="app-container" style="display:flex;flex: 1;padding: 20px 20px 0px 20px;">
  15. <div class="mainCenter">
  16. <div class="centerLeft">
  17. <div class="tabsBox">
  18. <el-table :data="tableData" border style="width: 100%;"
  19. :row-style="{ color: '#303133' }"
  20. :header-cell-style="{backgroundColor: 'rgb(245, 247, 250)',color: '#606266'}" highlight-current-row>
  21. <el-table-column align="center" prop="project_name" label="名称">
  22. <template slot-scope="scope">{{ scope.row.name }}</template>
  23. </el-table-column>
  24. <el-table-column align="center" prop="project_name" label="分类" width="100">
  25. <template slot-scope="scope">{{ scope.row.type == 1?'药品': scope.row.project_type == 2? '项目':'耗材'}}</template>
  26. </el-table-column>
  27. <el-table-column align="center" prop="single_dose" width="80" label="单次用量">
  28. <template slot-scope="scope">{{scope.row.single_dose}}&nbsp;&nbsp;{{scope.row.single_dose_unit}}</template>
  29. </el-table-column>
  30. <el-table-column align="center" prop="delivery_way" width="90" label="用法">
  31. <template slot-scope="scope">
  32. <!--<el-input v-model="scope.row.delivery_way" placeholder="" readonly></el-input>-->
  33. {{scope.row.delivery_way}}
  34. </template>
  35. </el-table-column>
  36. <el-table-column align="center" prop="execution_frequency" width="90" label="频率">
  37. <template slot-scope="scope">{{scope.row.execution_frequency}}</template>
  38. </el-table-column>
  39. <el-table-column align="center" prop="number_days" width="60" label="天数">
  40. <template slot-scope="scope">
  41. <!--<el-input v-model="scope.row.number_days" placeholder="" readonly></el-input>-->
  42. {{scope.row.day}}天
  43. </template>
  44. </el-table-column>
  45. <el-table-column align="center" prop="total" width="60" label="总量">
  46. <template slot-scope="scope">{{scope.row.count}}&nbsp;&nbsp;{{scope.row.prescribing_number_unit}}</template>
  47. </el-table-column>
  48. <el-table-column align="center" prop="name" width="60" label="单价">
  49. <template slot-scope="scope">
  50. <!--<el-input v-model="scope.row.price" placeholder="" readonly></el-input>-->
  51. {{scope.row.price}}元
  52. </template>
  53. </el-table-column>
  54. <el-table-column align="center" prop="name" width="60" label="总价">
  55. <template slot-scope="scope">
  56. <!--<el-input v-model="scope.row.price" placeholder="" readonly></el-input>-->
  57. {{scope.row.price.toFixed(4)}}元
  58. </template>
  59. </el-table-column>
  60. <el-table-column align="center" prop="name" width="80" label="备注">
  61. <template slot-scope="scope">
  62. <!--<el-input v-model="scope.row.remark" readonly></el-input>-->
  63. {{scope.row.remark}}
  64. </template>
  65. </el-table-column>
  66. </el-table>
  67. <div class="additionalBox">
  68. <div class="additionalOne" v-for="(item,index) in additions" :key="index">
  69. <span :title="item.item_name">{{item.item_name}}</span>
  70. <el-input v-model="item.price" placeholder="" style="width:50px;" readonly></el-input>
  71. <el-input v-model="item.count" placeholder="" style="width:50px;" readonly></el-input>
  72. <!--<i class="el-icon-delete deleteIcon" @click="delAddition(index,item)"></i>-->
  73. </div>
  74. </div>
  75. </div>
  76. <div class="costBox">
  77. <span>当前处方总费用:<span style="color:red;">{{ order.medfee_sumamt.toFixed(4)}}元</span></span>
  78. <span v-if="order.order_status == 1">待结算</span>
  79. <span v-if="order.order_status == 2">已结算</span>
  80. <span v-if="order.order_status == 3">已退费</span>
  81. </div>
  82. </div>
  83. <div class="centerRight">
  84. <p class="centerRightTitle">人员信息</p>
  85. <ul class="basicUl">
  86. <li style="width:50%;">姓名:{{patientInfo.name}}</li>
  87. <li style="width:50%;">性别:{{patientInfo.gender == 1 ? '男' : '女' }}</li>
  88. <li style="width:50%;">年龄:{{patientInfo.age }}</li>
  89. <li style="width:50%;">身高:{{patientInfo.height?patientInfo.height:''}}</li>
  90. <li style="width:50%;">体重:{{patientInfo.weight?patientInfo.weight:''}}</li>
  91. <li style="width:50%;">电话:{{patientInfo.phone}}</li>
  92. </ul>
  93. <p class="centerRightTitle" style="margin-top:10px;">收费信息</p>
  94. <ul class="basicUl">
  95. <li style="width:50%;">应收金额:{{order.medfee_sumamt.toFixed(4) }}元</li>
  96. <li style="width:50%;">实收金额:{{order.reality_price.toFixed(4)}}元</li>
  97. <li style="width:50%;">舍入金额:{{order.medfee_sumamt.toFixed(4) - order.reality_price.toFixed(4)}}元</li>
  98. <li style="width:50%;">优惠金额:{{order.preferential_price.toFixed(4)}}元</li>
  99. <li style="width:50%;">总金额</li>
  100. <li style="width:50%;">{{order.medfee_sumamt.toFixed(4)}}元</li>
  101. </ul>
  102. <!--<p class="centerRightTitle">发票费用</p>-->
  103. <!--<ul class="basicUl">-->
  104. <!--<li style="width:100%;">西药费:0.00元</li>-->
  105. <!--</ul>-->
  106. </div>
  107. </div>
  108. </div>
  109. <div v-if="listVisible">
  110. <el-dialog
  111. class="centerDialog"
  112. width="900px"
  113. title="打印"
  114. :visible.sync="listVisible">
  115. <list-print :paramsObj='paramsObj'></list-print>
  116. </el-dialog>
  117. </div>
  118. <div v-if="allListVisible">
  119. <el-dialog
  120. class="centerDialog"
  121. width="900px"
  122. title="打印"
  123. :visible.sync="allListVisible">
  124. <all-list-print :paramsObj='paramsObj'></all-list-print>
  125. </el-dialog>
  126. </div>
  127. </div>
  128. </template>
  129. <script>
  130. import BreadCrumb from '@/xt_pages/components/bread-crumb'
  131. import { getHisOrder } from '@/api/his/his'
  132. import prescriptionTable from './components/prescriptionTable'
  133. import { getDictionaryDataConfig} from "@/utils/data";
  134. import ListPrint from './listPrint'
  135. import AllListPrint from './allListPrint'
  136. export default {
  137. components:{
  138. AllListPrint,
  139. ListPrint,
  140. BreadCrumb,
  141. prescriptionTable,
  142. },
  143. data(){
  144. return{
  145. listVisible:false,
  146. allListVisible:false,
  147. paramsObj:{
  148. id:this.$route.query.id,
  149. balance_accounts_type:0
  150. },
  151. crumbs: [
  152. { path: false, name: '门诊收费' },
  153. { path: false, name: '项目消费明细汇总详情' }
  154. ],
  155. info: {},
  156. curPrescriptions: {},
  157. prescriptions: [],
  158. record_date: '',
  159. tableData: [],
  160. additions:[],
  161. editableTabsValue: '1',
  162. loadingone: false,
  163. editableTabs: [{
  164. title: '处方1',
  165. name: '1'
  166. }],
  167. tabIndex: 1,
  168. hisPatientInfo: {},
  169. loadingtwo: false,
  170. patientTableData: [{
  171. name: '杨美英',
  172. mdtrt_id: '1709946'
  173. }],
  174. patientInfo: { id: 0 },
  175. doctor: {},
  176. total: 0,
  177. state: '未收费',
  178. radio: 1,
  179. radioStatus: 1,
  180. search_input: '',
  181. order:{},
  182. }
  183. },created(){
  184. this.GetOrderDetail()
  185. },methods:{
  186. open(val){
  187. if(val == 1){
  188. this.paramsObj.id == this.$route.query.id
  189. this.paramsObj.balance_accounts_type = this.hisPatientInfo.balance_accounts_type
  190. this.listVisible = true
  191. }else if(val == 2){
  192. this.paramsObj.id == this.$route.query.id
  193. this.paramsObj.balance_accounts_type = this.hisPatientInfo.balance_accounts_type
  194. this.allListVisible = true
  195. }
  196. },
  197. // getTotal() {
  198. // var total = 0
  199. // for (let i = 0; i < this.prescriptions.length; i++) {
  200. // if (this.prescriptions[i].advices != null) {
  201. // for (let a = 0; a < this.prescriptions[i].advices.length; a++) {
  202. // console.log(this.prescriptions[i].advices[a].price )
  203. // console.log(this.prescriptions[i].advices[a].prescribing_number)
  204. //
  205. // total = parseFloat(total) + parseFloat(this.prescriptions[i].advices[a].price * this.prescriptions[i].advices[a].prescribing_number)
  206. // }
  207. // }
  208. // if (this.prescriptions[i].project != null) {
  209. // for (let a = 0; a < this.prescriptions[i].project.length; a++) {
  210. //
  211. // total = parseFloat(total) + parseFloat(this.prescriptions[i].project[a].price * this.prescriptions[i].project[a].count)
  212. // }
  213. // }
  214. //
  215. // if (this.prescriptions[i].addition != null) {
  216. // for (let b = 0; b < this.prescriptions[i].addition.length; b++) {
  217. // total = parseFloat(total) + parseFloat(this.prescriptions[i].addition[a].price * this.prescriptions[i].addition[b].count)
  218. // }
  219. // }
  220. // }
  221. // return total.toFixed(2)
  222. //
  223. // },
  224. getDictionaryDataConfig(module, filed_name) {
  225. return getDictionaryDataConfig(module, filed_name)
  226. },
  227. tabclickEvent(val) {
  228. for (let i = 0; i < this.prescriptions.length; i++) {
  229. if (this.prescriptions[i].name == val.name) {
  230. this.curPrescriptions = {}
  231. var temp = this.deepClone(this.prescriptions[i])
  232. this.curPrescriptions = temp
  233. }
  234. }
  235. },
  236. deepClone(source) {
  237. if (!source && typeof source !== 'object') {
  238. throw new Error('error arguments', 'shallowClone')
  239. }
  240. const targetObj = source.constructor === Array ? [] : {}
  241. Object.keys(source).forEach((keys) => {
  242. if (source[keys] && typeof source[keys] === 'object') {
  243. targetObj[keys] = this.deepClone(source[keys])
  244. } else {
  245. targetObj[keys] = source[keys]
  246. }
  247. })
  248. return targetObj
  249. }, getGroup(id){
  250. var name = ""
  251. var statistics_category = getDictionaryDataConfig('system','statistics_category')
  252. for(let i=0;i<statistics_category.length;i++){
  253. if(id == statistics_category[i].id){
  254. name = statistics_category[i].name
  255. }
  256. }
  257. return name
  258. },
  259. getTotal() {
  260. var total = 0
  261. for (let i = 0; i < this.prescriptions.length; i++) {
  262. if (this.prescriptions[i].advices != null) {
  263. for (let a = 0; a < this.prescriptions[i].advices.length; a++) {
  264. total = total + this.prescriptions[i].advices[a].retail_price * this.prescriptions[i].advices[a].prescribing_number
  265. }
  266. }
  267. if (this.prescriptions[i].project != null) {
  268. for (let b = 0; b < this.prescriptions[i].project.length; b++) {
  269. total = total + this.prescriptions[i].project[b].price * this.prescriptions[i].project[b].total
  270. }
  271. }
  272. }
  273. return total
  274. },
  275. moreState(tab, event) {
  276. if (tab == 'more') {
  277. return false
  278. }
  279. }, unique(array) {
  280. // res用来存储结果
  281. var res = []
  282. for (var i = 0, arrayLen = array.length; i < arrayLen; i++) {
  283. for (var j = 0, resLen = res.length; j < resLen; j++) {
  284. if (array[i].id === res[j].id && array[i].price === res[j].price) {
  285. break
  286. }
  287. }
  288. // 如果array[i]是唯一的,那么执行完循环,j等于resLen
  289. if (j === resLen) {
  290. res.push(array[i])
  291. }
  292. }
  293. return res
  294. },
  295. setMonthPrescription(month_prescriptions) {
  296. console.log(month_prescriptions)
  297. let drug_month_prescriptions = {
  298. advices: []
  299. }
  300. let drug_ids = []
  301. let project_month_prescriptions = {
  302. project: []
  303. }
  304. let project_ids = []
  305. let addition_month_prescriptions = {
  306. addition: []
  307. }
  308. let additions_ids = []
  309. for (let i = 0; i < month_prescriptions.length; i++) {
  310. if (month_prescriptions[i].type == 1) { //药品
  311. for (let a = 0; a < month_prescriptions[i].advices.length; a++) {
  312. let obj = {
  313. id: month_prescriptions[i].advices[a].drug_id,
  314. price: month_prescriptions[i].advices[a].price
  315. }
  316. drug_ids.push(obj)
  317. drug_month_prescriptions.advices.push(month_prescriptions[i].advices[a])
  318. }
  319. } else if (month_prescriptions[i].type == 2) { //项目
  320. for (let a = 0; a < month_prescriptions[i].project.length; a++) {
  321. let obj = {
  322. id: month_prescriptions[i].project[a].project_id,
  323. price: month_prescriptions[i].project[a].price
  324. }
  325. project_ids.push(obj)
  326. project_month_prescriptions.project.push(month_prescriptions[i].project[a])
  327. }
  328. }
  329. //附加收费
  330. for (let a = 0; a < month_prescriptions[i].addition.length; a++) {
  331. let obj = {
  332. id: month_prescriptions[i].addition[a].item_id,
  333. price: month_prescriptions[i].addition[a].price
  334. }
  335. additions_ids.push(obj)
  336. addition_month_prescriptions.addition.push(month_prescriptions[i].addition[a])
  337. }
  338. }
  339. drug_ids = this.unique(drug_ids)
  340. project_ids= this.unique(project_ids)
  341. additions_ids= this.unique(additions_ids)
  342. for (let i = 0; i < drug_ids.length; i++) {
  343. let obj = {}
  344. let count = 0
  345. for (let a = 0; a < drug_month_prescriptions.advices.length; a++) {
  346. if (drug_ids[i].price == drug_month_prescriptions.advices[a].price && drug_ids[i].id == drug_month_prescriptions.advices[a].drug_id) {
  347. obj['name'] = drug_month_prescriptions.advices[a].advice_name
  348. obj['statistical_classification'] = ''
  349. obj['type'] = 1
  350. obj['single_dose'] = drug_month_prescriptions.advices[a].single_dose
  351. obj['delivery_way'] = drug_month_prescriptions.advices[a].delivery_way
  352. obj['execution_frequency'] = drug_month_prescriptions.advices[a].execution_frequency
  353. obj['day'] = drug_month_prescriptions.advices[a].day
  354. obj['prescribing_number_unit'] = drug_month_prescriptions.advices[a].prescribing_number_unit
  355. obj['remark'] = drug_month_prescriptions.advices[a].remark
  356. obj['price'] = parseFloat(drug_month_prescriptions.advices[a].price)
  357. count = count + drug_month_prescriptions.advices[a].prescribing_number
  358. }
  359. }
  360. obj['count'] = count
  361. this.tableData.push(obj)
  362. }
  363. for (let i = 0; i < project_ids.length; i++) {
  364. let obj = {}
  365. let count = 0
  366. for (let a = 0; a < project_month_prescriptions.project.length; a++) {
  367. if (project_ids[i].price == project_month_prescriptions.project[a].price &&project_ids[i].id == project_month_prescriptions.project[a].project_id ) {
  368. if(project_month_prescriptions.project[a].type == 2){
  369. obj['name'] = project_month_prescriptions.project[a].project.project_name
  370. obj['statistical_classification'] = ''
  371. obj['project_type'] = 2
  372. }else if (project_month_prescriptions.project[a].type == 3){
  373. obj['name'] = project_month_prescriptions.project[a].good_info.good_name
  374. obj['statistical_classification'] = ''
  375. obj['project_type'] = 3
  376. }
  377. obj['single_dose'] = project_month_prescriptions.project[a].single_dose
  378. obj['delivery_way'] = project_month_prescriptions.project[a].delivery_way
  379. obj['execution_frequency'] = project_month_prescriptions.project[a].execution_frequency
  380. obj['day'] = project_month_prescriptions.project[a].day
  381. obj['single_dose_unit'] = project_month_prescriptions.project[a].unit
  382. obj['prescribing_number_unit'] = project_month_prescriptions.project[a].unit
  383. count = count + project_month_prescriptions.project[a].count
  384. obj['price'] = parseFloat(project_month_prescriptions.project[a].price)
  385. obj['remark'] = project_month_prescriptions.project[a].remark
  386. obj['type'] = 2
  387. }
  388. }
  389. obj['count'] = count
  390. this.tableData.push(obj)
  391. }
  392. for (let i = 0; i < additions_ids.length; i++) {
  393. let obj = {}
  394. let count = 0
  395. console.log(addition_month_prescriptions.addition)
  396. if (addition_month_prescriptions.addition) {
  397. for (let a = 0; a < addition_month_prescriptions.addition.length; a++) {
  398. if (additions_ids[i].price == addition_month_prescriptions.addition[a].price &&additions_ids[i].id == addition_month_prescriptions.addition[a].item_id) {
  399. obj['item_name'] = addition_month_prescriptions.addition[a].item_name
  400. count = count + addition_month_prescriptions.addition[a].count
  401. obj['price'] = parseFloat(addition_month_prescriptions.addition[a].price)
  402. }
  403. }
  404. obj['count'] = count
  405. this.additions.push(obj)
  406. }
  407. }
  408. },
  409. GetOrderDetail(){
  410. let params={
  411. number:this.$route.query.number,
  412. patient_id:this.$route.query.patient_id,
  413. }
  414. getHisOrder(params).then(response => {
  415. if (response.data.state == 0) {
  416. this.$message.error(response.data.msg)
  417. return false
  418. } else {
  419. this.patientInfo = response.data.data.order.patient
  420. this.hisPatientInfo = response.data.data.order.his_patient
  421. this.info = response.data.data.p_info
  422. this.order = response.data.data.order
  423. this.prescriptions = []
  424. this.tableData = []
  425. var prescription = response.data.data.prescription
  426. this.prescriptions = prescription
  427. this.setMonthPrescription(prescription)
  428. // for (let i = 0; i < response.data.data.prescription.length; i++) {
  429. // var prescription = response.data.data.prescription[i]
  430. // for (let b = 0; b < prescription.advices.length; b++) {
  431. // let obj = {
  432. // name: prescription.advices[b].advice_name,
  433. // statistical_classification:"",
  434. // type:1,
  435. // single_dose: prescription.advices[b].single_dose,
  436. // delivery_way: prescription.advices[b].delivery_way,
  437. // execution_frequency: prescription.advices[b].execution_frequency,
  438. // price: prescription.advices[b].price.toString(),
  439. // day: prescription.advices[b].day,
  440. // count:prescription.advices[b].prescribing_number.toString(),
  441. // remark: prescription.advices[b].remark,
  442. // single_dose_unit: prescription.advices[b].single_dose_unit,
  443. // prescribing_number_unit: prescription.advices[b].prescribing_number_unit,
  444. //
  445. // }
  446. // this.tableData.push(obj)
  447. // }
  448. //
  449. // for (let b = 0; b < prescription.project.length; b++) {
  450. // let obj = {
  451. // name: prescription.project[b].project.project_name,
  452. // statistical_classification: prescription.project[b].project.statistical_classification,
  453. // single_dose: prescription.project[b].single_dose,
  454. // delivery_way: prescription.project[b].delivery_way,
  455. // execution_frequency: prescription.project[b].execution_frequency,
  456. // price: prescription.project[b].price,
  457. // day: prescription.project[b].day,
  458. // count: prescription.project[b].count.toString(),
  459. // remark: prescription.project[b].remark,
  460. // single_dose_unit:prescription.project[b].project.unit,
  461. // prescribing_number_unit:prescription.project[b].project.unit,
  462. // type:2,
  463. // }
  464. // this.tableData.push(obj)
  465. // }
  466. //
  467. // for (let b = 0; b < prescription.addition.length; b++) {
  468. // this.additions.push( prescription.addition[b])
  469. // }
  470. // let index = i + 1
  471. // let obj = {
  472. // id: prescription.id,
  473. // name: '处方' + index,
  474. // advices: tempAdvice,
  475. // project: tempProject,
  476. // type: response.data.data.prescription[i].type
  477. // }
  478. // this.prescriptions.push(obj)
  479. // this.curPrescriptions = this.prescriptions[0]
  480. // }
  481. // this.tableData = response.data.data.order
  482. }
  483. })
  484. }
  485. }
  486. }
  487. </script>
  488. <style lang="scss" scoped>
  489. .summaryDetail{
  490. height: 100%;
  491. display: flex;
  492. flex-direction: column;
  493. .tabsBox{
  494. position: relative;
  495. height: 90%;
  496. overflow-y: auto;
  497. margin-bottom: 60px;
  498. .el-tabs__item{
  499. padding: 0 10px;
  500. }
  501. }
  502. .addTab{
  503. position: absolute;
  504. right: 0;
  505. top: 6px;
  506. z-index: 20;
  507. }
  508. .mainCenter{
  509. display: flex;
  510. flex:1;
  511. }
  512. .costBox{
  513. width:100%;
  514. height:60px;
  515. background:#fff;
  516. position: absolute;
  517. bottom:0;
  518. display: flex;
  519. justify-content: space-between;
  520. align-items: center;
  521. }
  522. .centerLeft{
  523. flex: 1;
  524. display: flex;
  525. flex-direction: column;
  526. position: relative;
  527. }
  528. .centerRight{
  529. width: 300px;
  530. margin-left: 5px;
  531. display: flex;
  532. flex-direction: column;
  533. }
  534. .RP{
  535. color:#409EFF;
  536. font-size: 20px;
  537. margin-bottom: 5px;
  538. }
  539. .centerRightTitle{
  540. color:#409EFF;
  541. padding:0 0 10px 0;
  542. }
  543. .basicUl{
  544. border-top: 1px solid #e5e5e5;
  545. border-left: 1px solid #e5e5e5;
  546. display: flex;
  547. flex-wrap: wrap;
  548. li{
  549. border-bottom: 1px solid #e5e5e5;
  550. border-right: 1px solid #e5e5e5;
  551. width: 100%;
  552. height: 38px;
  553. line-height: 38px;
  554. text-indent: 5px;
  555. font-size: 14px;
  556. }
  557. }
  558. .additionalBox{
  559. margin-top: 20px;
  560. display: flex;
  561. flex-wrap: wrap;
  562. .additionalOne{
  563. margin-right:20px;
  564. margin-bottom:10px;
  565. display: flex;
  566. align-items: center;
  567. >span{
  568. white-space: nowrap;
  569. overflow: hidden;
  570. text-overflow: ellipsis;
  571. width:80px;
  572. display: inline-block;
  573. font-size: 14px;
  574. }
  575. }
  576. .deleteIcon{
  577. color:red;
  578. margin-left:5px;
  579. }
  580. }
  581. }
  582. </style>
  583. <style lang="scss">
  584. .summaryDetail{
  585. .el-table th .cell, .el-table td .cell{
  586. padding: 0 2px;
  587. }
  588. .el-icon-delete{
  589. color:red;
  590. }
  591. }
  592. </style>