index.vue 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723
  1. <template>
  2. <div class="ele-body" style="width: 100%">
  3. <el-card shadow="never" v-loading="loading" style="width: 100%">
  4. <div class="ele-border-lighter form-content" v-loading="loading">
  5. <search-table @search="reload"></search-table>
  6. <!-- 数据表格 -->
  7. <ele-pro-table
  8. ref="table"
  9. :columns="columns"
  10. :datasource="datasource"
  11. height="calc(100vh - 410px)"
  12. style="margin-bottom: 10px"
  13. full-height="calc(100vh - 116px)"
  14. tool-class="ele-toolbar-form"
  15. :selection.sync="selection"
  16. :page-size="20"
  17. @columns-change="handleColumnChange"
  18. :cache-key="cacheKeyUrl"
  19. >
  20. <!-- 表头工具栏 -->
  21. <template v-slot:toolbar>
  22. <el-button
  23. size="small"
  24. type="primary"
  25. icon="el-icon-plus"
  26. class="ele-btn-icon"
  27. @click="openEdit('add', {})"
  28. v-if="
  29. !saleOrderData.id ||
  30. (saleOrderData.id && saleOrderData.orderStatus == 2)
  31. "
  32. >
  33. 新建
  34. </el-button>
  35. <el-button
  36. size="small"
  37. type="danger"
  38. class="el-icon-delete"
  39. @click="allDelBtn"
  40. :disabled="selection?.length === 0"
  41. >
  42. 批量删除
  43. </el-button>
  44. <el-dropdown trigger="click" :disabled="selection?.length === 0">
  45. <el-button type="primary" class="el-icon-printer" size="small">
  46. 打印<i class="el-icon-arrow-down el-icon--right"></i>
  47. </el-button>
  48. <el-dropdown-menu slot="dropdown">
  49. <el-dropdown-item
  50. @click.native="handlePrint('printTemplateByRef')"
  51. v-if="$hasPermission('eom:print-invoice1')"
  52. >发货单</el-dropdown-item
  53. >
  54. <el-dropdown-item
  55. v-if="$hasPermission('eom:print-invoice2')"
  56. @click.native="handlePrint('printTemplateJsRef')"
  57. >器械出库单</el-dropdown-item
  58. >
  59. <el-dropdown-item
  60. v-if="$hasPermission('eom:print-invoice3')"
  61. @click.native="handlePrint('printTemplateJsYpRef')"
  62. >药品出库单</el-dropdown-item
  63. >
  64. <el-dropdown-item
  65. v-if="$hasPermission('eom:print-invoice4')"
  66. @click.native="handlePrint('printTemplateWlRef')"
  67. >送货单模板</el-dropdown-item
  68. >
  69. <el-dropdown-item
  70. v-if="$hasPermission('eom:print-invoice5')"
  71. @click.native="handlePrint('printTemplateBSRef')"
  72. >送货单模板</el-dropdown-item
  73. >
  74. <el-dropdown-item
  75. v-if="$hasPermission('eom:print-invoice6')"
  76. @click.native="handlePrint('printTemplateHtRef')"
  77. >货物签收单</el-dropdown-item
  78. >
  79. <el-dropdown-item
  80. v-if="$hasPermission('eom:print-invoice7')"
  81. @click.native="handlePrint('printTemplateJrRef')"
  82. >发货单</el-dropdown-item
  83. >
  84. <el-dropdown-item
  85. v-if="$hasPermission('eom:print-invoice8')"
  86. @click.native="handlePrint('printTemplateTrRef')"
  87. >送货单打印</el-dropdown-item
  88. >
  89. </el-dropdown-menu>
  90. </el-dropdown>
  91. <exportButton
  92. btnName="列表导出"
  93. fileName="销售发货单"
  94. apiUrl="/eom/saleordersendrecord/export"
  95. :params="params"
  96. ></exportButton>
  97. </template>
  98. <!-- 查看详情列 -->
  99. <template v-slot:docNo="{ row }">
  100. <el-link
  101. type="primary"
  102. :underline="false"
  103. @click="openorderDetail(row, 'docNo')"
  104. >
  105. {{ row.docNo }}
  106. </el-link>
  107. </template>
  108. <template v-slot:orderNo="{ row }">
  109. <el-link
  110. type="primary"
  111. :underline="false"
  112. v-for="(v, j) in row.orderNo.split(',')"
  113. :key="v"
  114. @click="openorderDetail(row, 'orderNo', j)"
  115. >
  116. {{ v }}
  117. <span v-if="j != row.orderNo.split(',').length - 1">,</span>
  118. </el-link>
  119. </template>
  120. <!-- 操作列 -->
  121. <template v-slot:action="{ row }">
  122. <el-link
  123. type="primary"
  124. :underline="false"
  125. icon="el-icon-edit"
  126. @click="openEdit('edit', row)"
  127. v-if="
  128. ([0, 3].includes(row.reviewStatus) &&
  129. isNeed_process_is_close) ||
  130. !isNeed_process_is_close
  131. "
  132. >
  133. 修改
  134. </el-link>
  135. <el-link
  136. type="primary"
  137. :underline="false"
  138. icon="el-icon-plus"
  139. @click="sendSubmit(row)"
  140. v-if="
  141. isNeed_process_is_close && [0, 3].includes(row.reviewStatus)
  142. "
  143. >
  144. 提交
  145. </el-link>
  146. <el-link
  147. type="primary"
  148. :underline="false"
  149. icon="el-icon-plus"
  150. @click="exportFile(row)"
  151. v-if="[2].includes(row.reviewStatus)"
  152. >
  153. 导出
  154. </el-link>
  155. <el-popconfirm
  156. class="ele-action"
  157. title="确定要删除此信息吗?"
  158. @confirm="remove([row.id])"
  159. v-if="
  160. (isNeed_process_is_close &&
  161. [0, 3].includes(row.reviewStatus)) ||
  162. !isNeed_process_is_close
  163. "
  164. >
  165. <template v-slot:reference>
  166. <el-link type="danger" :underline="false" icon="el-icon-delete">
  167. 删除
  168. </el-link>
  169. </template>
  170. </el-popconfirm>
  171. <el-link
  172. type="primary"
  173. :underline="false"
  174. icon="el-icon-edit"
  175. @click="creatInvoiceConfirm(row)"
  176. v-if="[2].includes(row.reviewStatus)"
  177. >
  178. 创建发货确认单
  179. </el-link>
  180. <el-link
  181. type="primary"
  182. :underline="false"
  183. icon="el-icon-edit"
  184. @click="creatReturnGoods('add', row)"
  185. v-if="[2].includes(row.reviewStatus)"
  186. >
  187. 创建退货单
  188. </el-link>
  189. </template>
  190. </ele-pro-table>
  191. </div>
  192. </el-card>
  193. <order-detail-dialog ref="orderDetailDialogRef"></order-detail-dialog>
  194. <add-invoice-dialog
  195. ref="invoiceDialogRef"
  196. @done="reload"
  197. :contactData="contactData"
  198. :saleOrderData="saleOrderData"
  199. ></add-invoice-dialog>
  200. <detail-dialog ref="DetailDialogRef"></detail-dialog>
  201. <add-return-goods-dialog
  202. ref="addReturnGoodsRef"
  203. @done="reload"
  204. :contactData="contactData"
  205. ></add-return-goods-dialog>
  206. <!-- 多选删除弹窗 -->
  207. <pop-modal
  208. :visible.sync="delVisible"
  209. content="是否确定删除?"
  210. @done="commitBtn"
  211. />
  212. <printTemplateBy
  213. ref="printTemplateByRef"
  214. :groupName="groupName"
  215. ></printTemplateBy>
  216. <printTemplateJs
  217. ref="printTemplateJsRef"
  218. :groupName="groupName"
  219. ></printTemplateJs>
  220. <printTemplateJsYp
  221. ref="printTemplateJsYpRef"
  222. :groupName="groupName"
  223. ></printTemplateJsYp>
  224. <printTemplateWl
  225. ref="printTemplateWlRef"
  226. :groupName="groupName"
  227. ></printTemplateWl>
  228. <printTemplateJr
  229. ref="printTemplateJrRef"
  230. :groupName="groupName"
  231. ></printTemplateJr>
  232. <printTemplateBs
  233. ref="printTemplateBSRef"
  234. :groupName="groupName"
  235. ></printTemplateBs>
  236. <printTemplateHt
  237. ref="printTemplateHtRef"
  238. :groupName="groupName"
  239. ></printTemplateHt>
  240. <printTemplateTr
  241. ref="printTemplateTrRef"
  242. :groupName="groupName"
  243. :companyInfo="companyInfo"
  244. ></printTemplateTr>
  245. <process-submit-dialog
  246. :isNotNeedProcess="false"
  247. :isCloseRefresh="false"
  248. :processSubmitDialogFlag.sync="processSubmitDialogFlag"
  249. v-if="processSubmitDialogFlag"
  250. ref="processSubmitDialogRef"
  251. @reload="reload"
  252. ></process-submit-dialog>
  253. <addInvoiceConfirm
  254. ref="addInvoiceConfirmRef"
  255. @done="reload"
  256. :contactData="contactData"
  257. :saleOrderData="saleOrderData"
  258. ></addInvoiceConfirm>
  259. </div>
  260. </template>
  261. <script>
  262. import searchTable from './components/searchTable.vue';
  263. import addInvoiceDialog from './components/addInvoiceDialog.vue';
  264. import addInvoiceConfirm from '@/views/saleManage/saleOrder/invoiceConfirm/components/addInvoiceDialog.vue';
  265. import detailDialog from './components/detailDialog.vue';
  266. import popModal from '@/components/pop-modal';
  267. import { reviewStatus } from '@/enum/dict';
  268. import orderDetailDialog from '@/views/saleManage/saleOrder/components/detailDialog.vue';
  269. import addReturnGoodsDialog from '@/views/saleManage/saleOrder/returnGoods/components/addReturnGoodsDialog';
  270. import printTemplateBy from '@/views/saleManage/saleOrder/invoice/components/print-template-by.vue';
  271. import printTemplateJs from '@/views/saleManage/saleOrder/invoice/components/print-template-js.vue';
  272. import printTemplateJsYp from '@/views/saleManage/saleOrder/invoice/components/print-template-jsyp.vue';
  273. import printTemplateWl from '@/views/saleManage/saleOrder/invoice/components/print-template-wl.vue';
  274. import printTemplateBs from '@/views/saleManage/saleOrder/invoice/components/print-template-bs.vue';
  275. import printTemplateJr from '@/views/saleManage/saleOrder/invoice/components/print-template-jr.vue';
  276. import printTemplateHt from '@/views/saleManage/saleOrder/invoice/components/print-template-ht.vue';
  277. import printTemplateTr from '@/views/saleManage/saleOrder/invoice/components/print-template-tr.vue';
  278. import {
  279. deleteSendInformation,
  280. getSendTableList,
  281. submit
  282. } from '@/api/saleManage/saleordersendrecord';
  283. import dictMixins from '@/mixins/dictMixins';
  284. import processSubmitDialog from '@/BIZComponents/processSubmitDialog/processSubmitDialog.vue';
  285. import tabMixins from '@/mixins/tableColumnsMixin';
  286. import { enterprisePage } from '@/api/contractManage/contractBook';
  287. import { getSendSaleOrderrecordDetailSplit } from '@/api/saleManage/saleordersendrecord';
  288. import { getWarehouseListByIds } from '@/api/purchasingManage/returnGoods';
  289. import exportButton from '@/components/upload/exportButton.vue';
  290. import { downLoadTemplate } from '@/api/system/file/index.js';
  291. export default {
  292. mixins: [dictMixins, tabMixins],
  293. components: {
  294. processSubmitDialog,
  295. printTemplateBy,
  296. searchTable,
  297. popModal,
  298. addReturnGoodsDialog,
  299. orderDetailDialog,
  300. addInvoiceDialog,
  301. detailDialog,
  302. addInvoiceConfirm,
  303. printTemplateJs,
  304. printTemplateJsYp,
  305. printTemplateWl,
  306. printTemplateBs,
  307. printTemplateJr,
  308. exportButton,
  309. printTemplateHt,
  310. printTemplateTr
  311. },
  312. //客户管理数据
  313. props: {
  314. contactData: {
  315. type: Object,
  316. default: () => {
  317. return {};
  318. }
  319. },
  320. saleOrderData: {
  321. type: Object,
  322. default: () => {
  323. return {};
  324. }
  325. }
  326. },
  327. data() {
  328. return {
  329. params: {},
  330. activeComp: 'saleorder',
  331. companyInfo: {},
  332. tabOptions: [
  333. { key: 'saleorder', name: '销售订单' },
  334. { key: 'invoice', name: '发货单' },
  335. { key: 'returnorder', name: '退货单' }
  336. ],
  337. groupName: '',
  338. selection: [], //单选中集合
  339. delVisible: false, //批量删除弹框状态
  340. loading: false, // 加载状态
  341. processSubmitDialogFlag: false,
  342. columns: [
  343. {
  344. width: 45,
  345. type: 'selection',
  346. columnKey: 'selection',
  347. align: 'center'
  348. },
  349. {
  350. columnKey: 'index',
  351. label: '序号',
  352. type: 'index',
  353. width: 55,
  354. align: 'center',
  355. showOverflowTooltip: true,
  356. fixed: 'left'
  357. },
  358. {
  359. prop: 'docNo',
  360. label: '发货单编码',
  361. align: 'center',
  362. sortable: true,
  363. slot: 'docNo',
  364. showOverflowTooltip: true,
  365. minWidth: 200
  366. },
  367. {
  368. prop: 'orderNo',
  369. label: '销售订单编码',
  370. align: 'center',
  371. sortable: true,
  372. slot: 'orderNo',
  373. showOverflowTooltip: true,
  374. minWidth: 200
  375. },
  376. {
  377. prop: 'productNames',
  378. label: '产品名称',
  379. align: 'center',
  380. showOverflowTooltip: true,
  381. minWidth: 140
  382. },
  383. {
  384. prop: 'productCodes',
  385. label: '产品编码',
  386. align: 'center',
  387. showOverflowTooltip: true,
  388. minWidth: 160
  389. },
  390. {
  391. minWidth: 160,
  392. prop: 'productionCodes',
  393. label: '生产编号',
  394. align: 'center'
  395. },
  396. {
  397. prop: 'batchNos',
  398. label: '批次号',
  399. align: 'center',
  400. showOverflowTooltip: true,
  401. minWidth: 140
  402. },
  403. {
  404. prop: 'orderTotalCount',
  405. label: '订单数量',
  406. align: 'center',
  407. showOverflowTooltip: true,
  408. minWidth: 140
  409. },
  410. {
  411. prop: 'sendTotalCount',
  412. label: '发货数量',
  413. align: 'center',
  414. showOverflowTooltip: true,
  415. minWidth: 140
  416. },
  417. {
  418. prop: 'sendTotalAmount',
  419. label: '发货金额',
  420. align: 'center',
  421. showOverflowTooltip: true,
  422. minWidth: 140
  423. },
  424. {
  425. prop: 'projectName',
  426. label: '项目名称',
  427. align: 'center',
  428. showOverflowTooltip: true,
  429. minWidth: 180
  430. },
  431. {
  432. prop: 'contactName',
  433. label: '客户名称',
  434. align: 'center',
  435. showOverflowTooltip: true,
  436. minWidth: 180
  437. },
  438. {
  439. prop: 'replied',
  440. label: '是否回执',
  441. align: 'center',
  442. showOverflowTooltip: true,
  443. minWidth: 120,
  444. formatter: (_row, _column, cellValue) => {
  445. return _row.replied == 1 ? '是' : '否';
  446. }
  447. },
  448. {
  449. prop: 'reviewStatus',
  450. label: '状态',
  451. align: 'center',
  452. showOverflowTooltip: true,
  453. minWidth: 100,
  454. formatter: (_row, _column, cellValue) => {
  455. return reviewStatus[_row.reviewStatus];
  456. }
  457. },
  458. {
  459. prop: 'createUserName',
  460. label: '创建人',
  461. align: 'center',
  462. showOverflowTooltip: true,
  463. minWidth: 80
  464. },
  465. {
  466. prop: 'createTime',
  467. label: '创建时间',
  468. align: 'center',
  469. showOverflowTooltip: true,
  470. minWidth: 170
  471. },
  472. {
  473. columnKey: 'action',
  474. label: '操作',
  475. width: 280,
  476. align: 'center',
  477. resizable: false,
  478. slot: 'action',
  479. showOverflowTooltip: true,
  480. fixed: 'right'
  481. }
  482. ],
  483. cacheKeyUrl: 'eos-bfe3d5ea-saleManage-invoice'
  484. };
  485. },
  486. computed: {},
  487. created() {
  488. enterprisePage({
  489. pageNum: 1,
  490. size: 200
  491. }).then((res) => {
  492. if (res.list?.length > 0) {
  493. this.groupName = res.list[0].name;
  494. this.companyInfo = res.list[0];
  495. }
  496. });
  497. console.log('this.saleOrderData',this.saleOrderData.id)
  498. },
  499. watch: {
  500. saleOrderData: {
  501. handler(newVal, oldVal) {
  502. if (newVal.id) {
  503. this.reload();
  504. }
  505. },
  506. deep: true
  507. }
  508. },
  509. methods: {
  510. /* 表格数据源 */
  511. datasource({ page, limit, where, order }) {
  512. if (this.saleOrderData.id) {
  513. //订单详情进入
  514. where['orderId'] = this.saleOrderData.id;
  515. }
  516. if (this.contactData.id) {
  517. where['contactId'] = this.contactData.id;
  518. }
  519. this.params = {
  520. pageNum: page,
  521. size: limit,
  522. ...where
  523. };
  524. return getSendTableList({
  525. pageNum: page,
  526. size: limit,
  527. ...where
  528. });
  529. },
  530. exportFile(row) {
  531. downLoadTemplate(
  532. `/eom/saleordersendrecord/export/${row.id}`,
  533. '货物签收单'
  534. );
  535. },
  536. //创建退货单
  537. creatReturnGoods(type, row) {
  538. this.$refs.addReturnGoodsRef.open(type, {}, row.id);
  539. },
  540. /* 刷新表格 */
  541. reload(where) {
  542. this.$refs.table.reload({ page: 1, where });
  543. this.$emit('getToDoReminder');
  544. },
  545. //新增编辑
  546. openEdit(type, row) {
  547. this.$refs.invoiceDialogRef.open(type, row);
  548. this.$refs.invoiceDialogRef.$refs.form &&
  549. this.$refs.invoiceDialogRef.$refs.form.clearValidate();
  550. },
  551. creatInvoiceConfirm(row) {
  552. this.$refs.addInvoiceConfirmRef.open('add', {}, row);
  553. },
  554. //批量删除
  555. allDelBtn() {
  556. if (this.selection.length === 0) return;
  557. let flag = this.selection.some((item) =>
  558. [1, 2].includes(item.reviewStatus)
  559. );
  560. if (flag)
  561. return this.$message.warning(
  562. '抱歉已审核、审核中的数据不能删除,请检查'
  563. );
  564. this.delVisible = true;
  565. },
  566. handlePrint(ref) {
  567. if (this.selection.length > 1)
  568. return this.$message.warning('请选择一条');
  569. let flag = this.selection.some((item) =>
  570. [2].includes(item.reviewStatus)
  571. );
  572. if (!flag)
  573. return this.$message.warning('抱歉需要已审核的发货单才能打印,请检查');
  574. if (ref != 'printTemplateByRef' && ref != 'printTemplateHtRef') {
  575. this.$refs[ref].open(this.selection[0].id);
  576. return;
  577. }
  578. this.$confirm('是否需要打印价格', '提示', {
  579. type: 'warning',
  580. cancelButtonText: '否',
  581. confirmButtonText: '是'
  582. })
  583. .then((res) => {
  584. this.$refs[ref].open(this.selection[0].id, true);
  585. })
  586. .catch((err) => {
  587. this.$refs[ref].open(this.selection[0].id, false);
  588. });
  589. },
  590. //删除接口
  591. remove(delData) {
  592. deleteSendInformation(delData).then((res) => {
  593. this.$message.success('删除成功!');
  594. this.reload();
  595. });
  596. },
  597. //删除弹框确定
  598. commitBtn() {
  599. const dataId = this.selection.map((v) => v.id);
  600. this.remove(dataId);
  601. },
  602. async sendSubmit(res) {
  603. const data = await getSendSaleOrderrecordDetailSplit(res.id);
  604. let storemanIds = '';
  605. let ids = data.productList.map((item) => item.warehouseId);
  606. if (ids?.length) {
  607. let warehouseList = await getWarehouseListByIds(ids || []);
  608. storemanIds = warehouseList.map((item) => item.ownerId);
  609. }
  610. this.processSubmitDialogFlag = true;
  611. this.$nextTick(() => {
  612. let params = {
  613. businessId: res.id,
  614. businessKey:
  615. res.saleTypeName.indexOf('技改') != '-1'
  616. ? 'sele_order_send_correction'
  617. : res.saleTypeName.indexOf('三包') != '-1'
  618. ? 'eom_sh'
  619. : res.saleTypeName.indexOf('补发') != '-1'
  620. ? 'eom_sh'
  621. : res.saleTypeName.indexOf('赠品') != '-1'
  622. ? 'sale_order_send_giftAndOther'
  623. : 'sales_send_approve',
  624. // businessKey:'eom_sh',
  625. formCreateUserId: res.createUserId,
  626. variables: {
  627. businessCode: res.docNo,
  628. businessName: res.contactName,
  629. storemanIds: storemanIds.toString(),
  630. businessType: '销售发货单'
  631. }
  632. };
  633. this.$refs.processSubmitDialogRef.init(params);
  634. });
  635. },
  636. //查看详情
  637. openorderDetail(row, type, index) {
  638. if (type === 'docNo') {
  639. this.$refs.DetailDialogRef.open(row);
  640. }
  641. if (type === 'orderNo') {
  642. let orderId = '';
  643. if (row.orderIds) {
  644. orderId = row.orderIds.split(',')[index];
  645. } else {
  646. orderId = row.orderId;
  647. }
  648. this.$refs.orderDetailDialogRef.open({ id: orderId });
  649. }
  650. }
  651. }
  652. };
  653. </script>
  654. <style lang="scss" scoped>
  655. .ele-body {
  656. padding-top: 0;
  657. padding-bottom: 0;
  658. }
  659. :deep .el-card__body {
  660. padding: 0;
  661. }
  662. :deep(.el-link--inner) {
  663. margin-left: 0px !important;
  664. }
  665. .sys-organization-list {
  666. height: calc(100vh - 264px);
  667. box-sizing: border-box;
  668. border-width: 1px;
  669. border-style: solid;
  670. overflow: auto;
  671. }
  672. .sys-organization-list :deep(.el-tree-node__content) {
  673. height: 40px;
  674. & > .el-tree-node__expand-icon {
  675. margin-left: 10px;
  676. }
  677. }
  678. .switch_left ul .active {
  679. border-top: 4px solid var(--color-primary);
  680. color: var(--color-primary-5);
  681. }
  682. .switch {
  683. padding-bottom: 20px;
  684. }
  685. .el-dropdown-link {
  686. cursor: pointer;
  687. color: var(--color-primary-5);
  688. }
  689. .el-icon-arrow-down {
  690. font-size: 12px;
  691. }
  692. </style>