AddNewRuleTable.vue 28 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872
  1. <style lang="less" scoped>
  2. #AddNewRuleTable {
  3. width: 100%;
  4. background: #fff;
  5. margin-top: 10px;
  6. padding: 20px;
  7. box-sizing: border-box;
  8. /deep/ .el-table .el-input--mini .el-input__inner,
  9. .el-select {
  10. width: 100%;
  11. font-size: 12px;
  12. }
  13. .btn_box {
  14. width: 100%;
  15. height: 100%;
  16. display: flex;
  17. align-items: center;
  18. justify-content: space-around;
  19. .btn_div {
  20. flex: 1;
  21. display: flex;
  22. align-items: center;
  23. justify-content: center;
  24. }
  25. img {
  26. width: 16px;
  27. height: 16px;
  28. cursor: pointer;
  29. }
  30. }
  31. .inp_box {
  32. // width: 100px;
  33. height: 100%;
  34. margin: 0 auto;
  35. }
  36. /deep/ .el-form-item__error {
  37. // position: absolute;
  38. top: 28px;
  39. }
  40. .form-texarea {
  41. /deep/ .el-form-item__error {
  42. // position: absolute;
  43. top: 54px;
  44. }
  45. }
  46. .texarea-form {
  47. /deep/ .el-form-item__error {
  48. // position: absolute;
  49. top: 32px;
  50. }
  51. }
  52. .type_content {
  53. /deep/ .el-form-item--mini.el-form-item,
  54. .el-form-item--small.el-form-item {
  55. margin: 0;
  56. width: 100%;
  57. }
  58. display: flex;
  59. .type_content_item1 {
  60. /deep/ .el-form-item__content {
  61. padding-bottom: 8px;
  62. }
  63. .row_box {
  64. .el-col {
  65. /deep/ .el-form-item__content {
  66. position: static;
  67. }
  68. /deep/ .el-form-item__error {
  69. position: absolute;
  70. width: 260px;
  71. left: 72px;
  72. white-space: normal;
  73. }
  74. }
  75. }
  76. }
  77. /deep/ .el-input.is-disabled .el-input__inner {
  78. color: #888;
  79. }
  80. }
  81. .custom_table_header {
  82. vertical-align: middle;
  83. &::before {
  84. content: '*';
  85. color: red;
  86. font-size: 12px;
  87. margin-right: 4px;
  88. }
  89. }
  90. /deep/ .el-table th {
  91. background: transparent;
  92. }
  93. /deep/ .el-form-item__content {
  94. padding-bottom: 14px;
  95. }
  96. .table_cell_cls {
  97. vertical-align: top;
  98. }
  99. /deep/ .el-form-item__label {
  100. font-size: 12px;
  101. }
  102. h4 {
  103. font-size: 14px;
  104. font-weight: 400;
  105. }
  106. /deep/ .el-select {
  107. font-size: 12px;
  108. }
  109. /deep/ .el-table--mini,
  110. .el-table--small,
  111. .el-table__expand-icon {
  112. font-size: 14px;
  113. }
  114. }
  115. </style>
  116. <template>
  117. <!-- :prop="`klRuleByIdSub[${scope.$index}].subDescription`" -->
  118. <div id="AddNewRuleTable">
  119. <h4 style="margin-bottom: 24px">规则内容:</h4>
  120. <!-- 隔行换色 :row-style="rowStyle" -->
  121. <el-table
  122. border
  123. :data="klRuleByIdSub"
  124. size="mini"
  125. style="min-height: 200px"
  126. height="calc(100vh - 393px)"
  127. :header-row-style="{ background: '#E3EAF4' }"
  128. :cell-style="cellStyle"
  129. :span-method="ObjectSpanMethod"
  130. ref="table"
  131. row-key="groupChildId"
  132. >
  133. <el-table-column width="80px" label="组" prop="groupType" fixed="left">
  134. <template slot-scope="scope">
  135. <div class="btn_box">
  136. <div class="btn_div">
  137. <img @click="addGroup(scope)" src="../../images/add-new-rule-sub.png" alt />
  138. </div>
  139. <div class="btn_div" v-if="!isLastDate(scope.row.groupId)">
  140. <img
  141. @click="$emit('delGroup', scope.row.groupId)"
  142. src="../../images/add-new-rule-del.png"
  143. alt
  144. />
  145. </div>
  146. </div>
  147. </template>
  148. </el-table-column>
  149. <el-table-column width="170px" label="附加信息" prop="subMsg" fixed="left">
  150. <template slot="header" slot-scope="scope">
  151. <div :class="showMsg?'custom_table_header':''">附加信息</div>
  152. </template>
  153. <template slot-scope="scope">
  154. <el-form-item
  155. :prop="`klRuleByIdSub[${scope.$index}].subMsg`"
  156. :rules="showMsg?rules.subMsg:rules.subMsgs"
  157. :class="scope.row.subMsg == ''?'texarea-form':'form-texarea'"
  158. >
  159. <el-input
  160. type="textarea"
  161. :autosize="{minRows: 1,maxRows: 2}"
  162. placeholder="请输入附加信息"
  163. v-model.trim="scope.row.subMsg"
  164. ></el-input>
  165. </el-form-item>
  166. </template>
  167. </el-table-column>
  168. <el-table-column
  169. width="80px"
  170. v-if="maxNum && maxNum > 1"
  171. fixed="left"
  172. label="基础规则"
  173. prop="groupType"
  174. >
  175. <template slot-scope="scope">
  176. <div class="btn_box">
  177. <div class="btn_div" v-if="!isMax(scope.row.groupId)">
  178. <img @click="addChildGroup(scope)" src="../../images/add-new-rule-sub.png" alt />
  179. </div>
  180. <div class="btn_div" v-if="klRuleByIdSub.length > 1 && !scope.row.disabled">
  181. <img
  182. @click="$emit('delGroupChild', scope.row.groupChildId)"
  183. src="../../images/add-new-rule-del.png"
  184. alt
  185. />
  186. </div>
  187. </div>
  188. </template>
  189. </el-table-column>
  190. <el-table-column width="170px" prop="subDescription" label="基础规则名称">
  191. <template slot="header" slot-scope="scope">
  192. <div class="custom_table_header">基础规则名称</div>
  193. </template>
  194. <template slot-scope="scope">
  195. <el-form-item
  196. class="inp_box"
  197. :prop="`klRuleByIdSub[${scope.$index}].subDescription`"
  198. :rules="rules.subDescription"
  199. >
  200. <el-input
  201. type="text"
  202. :disabled="scope.row.disabled"
  203. v-model="scope.row.subDescription"
  204. clearable
  205. placeholder="请输入"
  206. ></el-input>
  207. </el-form-item>
  208. </template>
  209. </el-table-column>
  210. <el-table-column width="170px" prop="subType" label="基础规则类型">
  211. <template slot="header" slot-scope="scope">
  212. <div class="custom_table_header">基础规则类型</div>
  213. </template>
  214. <template slot-scope="scope">
  215. <el-form-item
  216. class="inp_box"
  217. :prop="`klRuleByIdSub[${scope.$index}].subType`"
  218. :rules="rules.subType"
  219. >
  220. <el-select
  221. v-model="scope.row.subType"
  222. :disabled="scope.row.disabled"
  223. placeholder="请选择"
  224. @change="subTypeChange($event, scope.$index)"
  225. @focus="
  226. setTheRef($event, `klRuleByIdSub[${scope.$index}].subType`)
  227. "
  228. :ref="`klRuleByIdSub[${scope.$index}].subType`"
  229. >
  230. <el-option
  231. v-for="item in scope.row.baseTypes"
  232. :key="item.id"
  233. :label="item.name"
  234. :value="item.type"
  235. ></el-option>
  236. </el-select>
  237. </el-form-item>
  238. </template>
  239. </el-table-column>
  240. <el-table-column width="170px" prop="subLenCode" label="基础规则术语类型">
  241. <template slot="header" slot-scope="scope">
  242. <div class="custom_table_header">基础规则术语类型</div>
  243. </template>
  244. <template slot-scope="scope">
  245. <el-form-item
  246. class="inp_box"
  247. :prop="`klRuleByIdSub[${scope.$index}].subLenCode`"
  248. :rules="rules.subLenCode"
  249. >
  250. <el-select
  251. :disabled="scope.row.disabled"
  252. v-model="scope.row.subLenCode"
  253. placeholder="请选择"
  254. :ref="`klRuleByIdSub[${scope.$index}].subLenCode`"
  255. @change="subCodeChange($event, scope.$index)"
  256. @focus="
  257. setTheRef($event, `klRuleByIdSub[${scope.$index}].subLenCode`)
  258. "
  259. >
  260. <el-option
  261. v-for="item in scope.row.baseTermTypeList"
  262. :key="item.id"
  263. :label="item.name"
  264. :value="item.code"
  265. ></el-option>
  266. </el-select>
  267. </el-form-item>
  268. </template>
  269. </el-table-column>
  270. <el-table-column width="170px" label="医学标准术语" prop="subConceptId">
  271. <template slot="header" slot-scope="scope">
  272. <div class="custom_table_header">医学标准术语</div>
  273. </template>
  274. <template slot-scope="scope">
  275. <el-form-item
  276. class="inp_box"
  277. :prop="`klRuleByIdSub[${scope.$index}].subConceptId`"
  278. :rules="rules.subConceptId"
  279. >
  280. <el-select
  281. clearable
  282. remote
  283. filterable
  284. :disabled="scope.row.disabled"
  285. @focus="subConceptIdfocus(scope.$index)"
  286. :remote-method="searchConcept"
  287. v-model.trim="scope.row.subConceptId"
  288. :ref="`klRuleByIdSub[${scope.$index}].subConceptId`"
  289. >
  290. <el-option
  291. v-for="item in scope.row.conceptList"
  292. :key="item.conceptId"
  293. :label="item.conceptName"
  294. :value="item.conceptId"
  295. ></el-option>
  296. </el-select>
  297. </el-form-item>
  298. </template>
  299. </el-table-column>
  300. <el-table-column label="规则具体内容" min-width="900px" prop>
  301. <template slot-scope="scope">
  302. <div class="type_content">
  303. <el-form-item
  304. style="width: 100px; margin-right: 20px"
  305. :prop="`klRuleByIdSub[${scope.$index}].dataType`"
  306. :rules="rules.dataType"
  307. v-if="scope.row.subType === 2 && showDataType(scope.$index)"
  308. >
  309. <el-select
  310. v-model="scope.row.dataType"
  311. placeholder="选择类型"
  312. @change="dataTypeChange($event, scope.$index)"
  313. @focus="
  314. setTheRef($event, `klRuleByIdSub[${scope.$index}].dataType`)
  315. "
  316. :ref="`klRuleByIdSub[${scope.$index}].dataType`"
  317. >
  318. <el-option label="数值类型" value="1"></el-option>
  319. <el-option label="文本类型" value="2"></el-option>
  320. </el-select>
  321. </el-form-item>
  322. <!-- v-if="klRuleByIdSub[scope.$index].dataType === '1'" -->
  323. <el-form-item
  324. class="type_content_item type_content_item1"
  325. style="flex: 2; margin: 0 10px"
  326. label="最大值:"
  327. v-if="scope.row.dataType === '1'"
  328. >
  329. <!-- <div> -->
  330. <el-row :gutter="10" class="row_box">
  331. <el-col :span="6">
  332. <el-form-item
  333. :prop="`klRuleByIdSub[${scope.$index}].subMaxOperator`"
  334. :rules="[
  335. {
  336. validator: (rule, value, callback) => {
  337. subMaxOperator(scope, rule, value, callback);
  338. },
  339. trigger: ['change']
  340. }
  341. ]"
  342. >
  343. <el-select
  344. v-model="scope.row.subMaxOperator"
  345. placeholder="请选择"
  346. clearable
  347. @change="maxChange($event, scope.$index, 's')"
  348. @focus="
  349. setTheRef(
  350. $event,
  351. `klRuleByIdSub[${scope.$index}].subMaxOperator`
  352. )
  353. "
  354. :ref="`klRuleByIdSub[${scope.$index}].subMaxOperator`"
  355. >
  356. <el-option
  357. v-for="item in operMaxList"
  358. :key="item.key"
  359. :label="item.name"
  360. :value="item.key"
  361. ></el-option>
  362. </el-select>
  363. </el-form-item>
  364. </el-col>
  365. <el-col :span="6">
  366. <el-form-item
  367. :prop="`klRuleByIdSub[${scope.$index}].subMaxValue`"
  368. :rules="[
  369. {
  370. validator: (rule, value, callback) => {
  371. subMaxValue(scope, rule, value, callback);
  372. },
  373. trigger: ['change']
  374. }
  375. ]"
  376. >
  377. <el-input
  378. type="text"
  379. @focus="maxChange($event, scope.$index, 'i')"
  380. :ref="`klRuleByIdSub[${scope.$index}].subMaxValue`"
  381. v-model="scope.row.subMaxValue"
  382. placeholder="填写数值"
  383. />
  384. </el-form-item>
  385. </el-col>
  386. <el-col :span="6">
  387. <el-form-item :prop="`klRuleByIdSub[${scope.$index}].subMaxUnit`">
  388. <el-input
  389. type="text"
  390. @focus="setScrollRight"
  391. v-model.trim="scope.row.subMaxUnit"
  392. placeholder="填写单位"
  393. />
  394. </el-form-item>
  395. </el-col>
  396. </el-row>
  397. <!-- </div> -->
  398. </el-form-item>
  399. <el-form-item
  400. class="type_content_item type_content_item1"
  401. style="flex: 2"
  402. label="最小值:"
  403. v-if="scope.row.dataType === '1'"
  404. >
  405. <el-row :gutter="10" class="row_box">
  406. <el-col :span="6">
  407. <el-form-item
  408. :prop="`klRuleByIdSub[${scope.$index}].subMinOperator`"
  409. :rules="[
  410. {
  411. validator: (rule, value, callback) => {
  412. subMinOperatorRule(scope, rule, value, callback);
  413. },
  414. trigger: ['change']
  415. }
  416. ]"
  417. >
  418. <el-select
  419. v-model="scope.row.subMinOperator"
  420. placeholder="请选择"
  421. clearable
  422. :ref="`klRuleByIdSub[${scope.$index}].subMinOperator`"
  423. @change="minChange($event, scope.$index, 's')"
  424. @focus="
  425. setTheRef(
  426. $event,
  427. `klRuleByIdSub[${scope.$index}].subMinOperator`
  428. )
  429. "
  430. >
  431. <el-option
  432. v-for="item in operMinList"
  433. :key="item.name"
  434. :label="item.name"
  435. :value="item.name"
  436. ></el-option>
  437. </el-select>
  438. </el-form-item>
  439. </el-col>
  440. <el-col :span="6">
  441. <el-form-item
  442. :prop="`klRuleByIdSub[${scope.$index}].subMinValue`"
  443. :rules="[
  444. {
  445. validator: (rule, value, callback) => {
  446. subMinValueRule(scope, rule, value, callback);
  447. },
  448. trigger: ['change']
  449. }
  450. ]"
  451. >
  452. <el-input
  453. type="text"
  454. :ref="`klRuleByIdSub[${scope.$index}].subMinValue`"
  455. @focus="minChange($event, scope.$index, 'i')"
  456. v-model="scope.row.subMinValue"
  457. placeholder="填写数值"
  458. />
  459. </el-form-item>
  460. </el-col>
  461. <el-col :span="6">
  462. <el-form-item :prop="`klRuleByIdSub[${scope.$index}].subMinUnit`">
  463. <el-input
  464. type="text"
  465. @focus="setScrollRight"
  466. v-model.trim="scope.row.subMinUnit"
  467. placeholder="填写单位"
  468. />
  469. </el-form-item>
  470. </el-col>
  471. </el-row>
  472. </el-form-item>
  473. <!-- v-if="klRuleByIdSub[scope.$index].subType !== 6 && klRuleByIdSub[scope.$index].dataType === '2'" -->
  474. <div style="flex: 2" v-if="scope.row.subType != 6 && scope.row.dataType == '2'">
  475. <el-form-item
  476. class="type_content_item"
  477. style="width: 100%"
  478. label="医学内容:"
  479. label-width="100px"
  480. :prop="`klRuleByIdSub[${scope.$index}].subEqValue`"
  481. :rules="[
  482. {
  483. required: true,
  484. message: '请输入' + textName(scope.$index),
  485. trigger: 'blur'
  486. },
  487. {
  488. validator: (rule, value, callback) => {
  489. subEqValue(scope, rule, value, callback);
  490. },
  491. trigger: 'blur'
  492. }
  493. ]"
  494. >
  495. <el-input
  496. type="textarea"
  497. rows="1"
  498. placeholder="请输入医学内容"
  499. @focus="setScrollRight"
  500. v-model.trim="scope.row.subEqValue"
  501. ></el-input>
  502. </el-form-item>
  503. </div>
  504. <!-- v-if="groupData.subType === 6" -->
  505. <div style="flex: 2" v-if="scope.row.subType == 6">
  506. <el-form-item
  507. class="type_content_item"
  508. label="正则表达式:"
  509. label-width="120px"
  510. style="width: 100%"
  511. :prop="`klRuleByIdSub[${scope.$index}].subEqValue1`"
  512. :rules="[
  513. {
  514. required: true,
  515. message: '请输入' + textName(scope.$index),
  516. trigger: 'blur'
  517. },
  518. {
  519. validator: (rule, value, callback) => {
  520. subEqValue(scope, rule, value, callback);
  521. },
  522. trigger: 'blur'
  523. }
  524. ]"
  525. >
  526. <el-input
  527. type="textarea"
  528. rows="1"
  529. placeholder="请输入正则表达式"
  530. @focus="setScrollRight"
  531. v-model.trim="scope.row.subEqValue"
  532. ></el-input>
  533. </el-form-item>
  534. </div>
  535. </div>
  536. </template>
  537. </el-table-column>
  538. </el-table>
  539. </div>
  540. </template>
  541. <script>
  542. import api from '@api/knowledgeLib.js';
  543. import { tableRules } from './rules';
  544. export default {
  545. name: 'AddNewRuleTable',
  546. data() {
  547. return {
  548. numTypes: '',
  549. subConceptIdIndex: '',
  550. operMaxList: [
  551. { name: '<=', key: '<=' },
  552. { name: '<', key: '<' }
  553. ],
  554. operMinList: [
  555. { name: '>', key: '>' },
  556. { name: '>=', key: '>=' }
  557. ],
  558. rules: tableRules,
  559. theRef: null
  560. };
  561. },
  562. methods: {
  563. setScrollRight() {
  564. this.$nextTick(() => {
  565. this.$refs.table.bodyWrapper.scrollLeft = this.$refs.table.bodyWrapper.scrollWidth;
  566. });
  567. },
  568. maxChange(e, val, type) {
  569. if (
  570. type === 'i' &&
  571. this.klRuleByIdSub[val].subMaxOperator &&
  572. this.klRuleByIdSub[val].subMaxOperator != ''
  573. ) {
  574. this.$emit('clearValidate', [
  575. `klRuleByIdSub[${val}].subMinValue`,
  576. `klRuleByIdSub[${val}].subMinOperator`
  577. ]);
  578. } else if (
  579. type === 's' &&
  580. this.klRuleByIdSub[val].subMaxValue &&
  581. this.klRuleByIdSub[val].subMaxValue != ''
  582. ) {
  583. this.$emit('clearValidate', [
  584. `klRuleByIdSub[${val}].subMinValue`,
  585. `klRuleByIdSub[${val}].subMinOperator`
  586. ]);
  587. }
  588. this.setScrollRight();
  589. },
  590. minChange(e, val, type) {
  591. if (
  592. type === 'i' &&
  593. this.klRuleByIdSub[val].subMinOperator &&
  594. this.klRuleByIdSub[val].subMinOperator != ''
  595. ) {
  596. this.$emit('clearValidate', [
  597. `klRuleByIdSub[${val}].subMaxOperator`,
  598. `klRuleByIdSub[${val}].subMaxValue`
  599. ]);
  600. } else if (
  601. type === 's' &&
  602. this.klRuleByIdSub[val].subMinValue &&
  603. this.klRuleByIdSub[val].subMinValue != ''
  604. ) {
  605. this.$emit('clearValidate', [
  606. `klRuleByIdSub[${val}].subMaxOperator`,
  607. `klRuleByIdSub[${val}].subMaxValue`
  608. ]);
  609. }
  610. this.setScrollRight();
  611. },
  612. addGroup(scope) {
  613. this.$emit('addGroup', null, { groupId: scope.row.groupId });
  614. this.$refs.table.bodyWrapper.scrollLeft = 0;
  615. },
  616. addChildGroup(scope) {
  617. this.$emit('addGroup', scope.row.groupId, { index: scope.$index });
  618. this.$refs.table.bodyWrapper.scrollLeft = 0;
  619. },
  620. scrollFun() {
  621. this.$refs.table.bodyWrapper.scrollTop =
  622. this.$refs.table.bodyWrapper.scrollTop + 60;
  623. },
  624. // table 隔行换色
  625. // rowStyle({ row }) {
  626. // if (row.rowIndex % 2 == 0) {
  627. // return {
  628. // background: "#DFF7EF"
  629. // };
  630. // }
  631. // },
  632. // cellStyle
  633. cellStyle({ row, column, rowIndex, columnIndex }) {
  634. if (column.label == '组' || column.label == '基础规则') return {};
  635. return { 'vertical-align': 'top', 'padding-top': '14px' };
  636. },
  637. // 最大值 选择rule
  638. subMaxOperator(scope, rule, value, callback) {
  639. const { subMaxValue, subMinOperator, subMinValue } = scope.row;
  640. const val = value + subMinOperator + subMinValue + subMaxValue;
  641. if (!val || (!value && subMaxValue !== '')) {
  642. callback(new Error('最大值和最小值至少完整填写一个,单位不必填'));
  643. } else {
  644. callback();
  645. }
  646. },
  647. // 最大值 数值rule
  648. subMaxValue(scope, rule, value, callback) {
  649. const { subMaxOperator, subMinOperator, subMinValue } = scope.row;
  650. const val = value + subMaxOperator + subMinValue + subMinOperator;
  651. const isNum = /^(\-|\+)?\d+(\.\d+)?$/.test(value);
  652. if (!val || (value == '' && subMaxOperator)) {
  653. callback(new Error('最大值和最小值至少完整填写一个,单位不必填'));
  654. } else if (value !== '' && !isNum) {
  655. callback(new Error('只能输入数字'));
  656. } else {
  657. callback();
  658. }
  659. },
  660. // 最小值 选择rule
  661. subMinOperatorRule(scope, rule, value, callback) {
  662. const { subMaxValue, subMaxOperator, subMinValue } = scope.row;
  663. const val = value + subMaxOperator + subMinValue + subMaxValue;
  664. if (!val || (!value && subMinValue !== '')) {
  665. callback(new Error('最大值和最小值至少完整填写一个,单位不必填'));
  666. } else {
  667. callback();
  668. }
  669. },
  670. // 最小值 数值rule
  671. subMinValueRule(scope, rule, value, callback) {
  672. const { subMaxValue, subMinOperator, subMaxOperator } = scope.row;
  673. const val = value + subMaxOperator + subMaxValue + subMinOperator;
  674. const isNum = /^(\-|\+)?\d+(\.\d+)?$/.test(value);
  675. if (!val || (value == '' && subMinOperator)) {
  676. callback(new Error('最大值和最小值至少完整填写一个,单位不必填'));
  677. } else if (value !== '' && !isNum) {
  678. callback(new Error('只能输入数字'));
  679. } else {
  680. callback();
  681. }
  682. },
  683. // 医学内容rule
  684. subEqValue(scope, rule, value, callback) {
  685. if (value === '') {
  686. callback(new Error('请输入' + this.textName(scope.$index)));
  687. } else if (value.length > 200) {
  688. callback(new Error(this.textName(scope.$index) + '不能超过200字'));
  689. } else {
  690. callback();
  691. }
  692. },
  693. // 判断是否为最后一条规则
  694. isLastDate(id) {
  695. const tableLength = this.klRuleByIdSub.filter(item => item.groupId !== id)
  696. .length;
  697. return tableLength === 0;
  698. },
  699. // 是否超出最大规则数
  700. isMax(id) {
  701. const typeNum = this.klRuleByIdSub.filter(item => item.groupId === id)
  702. .length;
  703. return typeNum >= this.maxNum;
  704. },
  705. // 基础规则类型选择
  706. subTypeChange(e, index) {
  707. this.$emit('subTypeChange', e, index);
  708. },
  709. //
  710. setTheRef(e, val) {
  711. this.theRef = val;
  712. },
  713. // 规则术语类型
  714. subCodeChange(val, index) {
  715. //基础规则术语类型修改
  716. this.$emit('childSubCodeChange', val, index, this.numTypes);
  717. },
  718. clearConcept(index) {
  719. this.$emit('childClearConcept', index);
  720. },
  721. clearNumText(index) {
  722. this.$emit('childClearNumText', index);
  723. },
  724. //医学标准术语change
  725. subConceptIdfocus(index) {
  726. this.subConceptIdIndex = '';
  727. this.subConceptIdIndex = index;
  728. this.setTheRef(1, `klRuleByIdSub[${index}].subConceptId`);
  729. },
  730. // 医学标准术语
  731. searchConcept(val) {
  732. const param = {
  733. excludedConceptIds: [
  734. this.klRuleByIdSub[this.subConceptIdIndex].subType
  735. ],
  736. libType: this.klRuleByIdSub[this.subConceptIdIndex].subLenCode,
  737. name: val
  738. };
  739. api
  740. .searchConcept(param)
  741. .then(res => {
  742. if (res.data.code == '0') {
  743. const data = res.data.data;
  744. this.$emit('setFormData', this.subConceptIdIndex, data);
  745. }
  746. })
  747. .catch(error => {
  748. console.log(error);
  749. });
  750. },
  751. dataTypeChange(val, index) {
  752. this.$emit('ChildDataTypeChange', val, index);
  753. },
  754. // 处理要合并相同行的列
  755. getSpanArr(data) {
  756. this.spanArr = [];
  757. for (var i = 0; i < data.length; i++) {
  758. if (i === 0) {
  759. // 如果是第一条记录(即索引是0的时候),向数组中加入1
  760. /** *
  761. * 例子:
  762. * name:1
  763. * name:1
  764. * name:2
  765. * name:2
  766. * 最终结果:spanArr = [2,0,2,0]
  767. */
  768. this.spanArr.push(1);
  769. this.pos = 0;
  770. } else {
  771. if (data[i].groupId === data[i - 1].groupId) {
  772. // 如果remark相等就累加,并且push 0
  773. this.spanArr[this.pos] += 1;
  774. this.spanArr.push(0);
  775. } else {
  776. // 不相等push 1,并且pos 要换成当前下标
  777. this.spanArr.push(1);
  778. this.pos = i;
  779. }
  780. }
  781. }
  782. },
  783. // 合并单元格
  784. ObjectSpanMethod({ row, column, rowIndex, columnIndex }) {
  785. if (columnIndex == 0 || columnIndex == 1) {
  786. const _row = this.spanArr[rowIndex];
  787. const _col = _row > 0 ? 1 : 0;
  788. return {
  789. rowspan: _row,
  790. colspan: _col
  791. };
  792. }
  793. },
  794. showDataType(index) {
  795. return (
  796. (this.numTypes + ',').indexOf(
  797. this.klRuleByIdSub[index].subLenCode + ','
  798. ) === -1
  799. );
  800. },
  801. textName(index) {
  802. return this.klRuleByIdSub[index].subType !== 6 &&
  803. this.klRuleByIdSub[index].dataType == '2'
  804. ? '医学内容'
  805. : '正则表达式';
  806. },
  807. blurRef() {
  808. console.log('scroll');
  809. console.log(this.$refs[this.theRef]);
  810. if (this.theRef) {
  811. this.$refs[this.theRef].blur();
  812. // console.log(document.getElementById(this.theRef).blur,'hehehe');
  813. // document.getElementById(this.theRef).focus()
  814. // document.getElementById(this.theRef).value = 123
  815. }
  816. }
  817. },
  818. components: {},
  819. mounted() {
  820. // this.theRef
  821. // console.log('mounted');
  822. // let that = this;
  823. // this.$refs.table.bodyWrapper.addEventListener(
  824. // "scroll",
  825. // that.blurRef,
  826. // false
  827. // );
  828. },
  829. created() {
  830. this.numTypes = localStorage.getItem('zskNumDict');
  831. this.getSpanArr(this.klRuleByIdSub);
  832. },
  833. beforeUpdate() {
  834. this.getSpanArr(this.klRuleByIdSub);
  835. },
  836. updated() {
  837. // let that = this;
  838. // this.$nextTick(() => {
  839. // // FIX 滚动添加事件
  840. // this.$refs.table.bodyWrapper.removeEventListener(
  841. // "scroll",
  842. // that.blurRef,
  843. // false
  844. // );
  845. // setTimeout(() => {
  846. // that.$refs.table.bodyWrapper.addEventListener(
  847. // "scroll",
  848. // that.blurRef,
  849. // false
  850. // );
  851. // }, 300);
  852. // });
  853. },
  854. props: {
  855. klRuleByIdSub: {
  856. type: Array,
  857. required: true
  858. },
  859. maxNum: {
  860. default: null
  861. },
  862. showMsg: {
  863. default: null
  864. }
  865. }
  866. };
  867. </script>