uni-data-picker.uts 18 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692
  1. export type PaginationType = {
  2. current : number,
  3. size : number,
  4. count : number
  5. }
  6. export type LoadMoreType = {
  7. contentdown : string,
  8. contentrefresh : string,
  9. contentnomore : string
  10. }
  11. export type SelectedItemType = {
  12. name : string,
  13. value : string,
  14. }
  15. export type GetCommandOptions = {
  16. collection ?: UTSJSONObject,
  17. field ?: string,
  18. orderby ?: string,
  19. where ?: any,
  20. pageData ?: string,
  21. pageCurrent ?: number,
  22. pageSize ?: number,
  23. getCount ?: boolean,
  24. getTree ?: any,
  25. getTreePath ?: UTSJSONObject,
  26. startwith ?: string,
  27. limitlevel ?: number,
  28. groupby ?: string,
  29. groupField ?: string,
  30. distinct ?: boolean,
  31. pageIndistinct ?: boolean,
  32. foreignKey ?: string,
  33. loadtime ?: string,
  34. manual ?: boolean
  35. }
  36. const DefaultSelectedNode = {
  37. text: '请选择',
  38. value: ''
  39. }
  40. export const dataPicker = defineMixin({
  41. props: {
  42. localdata: {
  43. type: Array as PropType<Array<UTSJSONObject>>,
  44. default: [] as Array<UTSJSONObject>
  45. },
  46. collection: {
  47. type: Object,
  48. default: ''
  49. },
  50. field: {
  51. type: String,
  52. default: ''
  53. },
  54. orderby: {
  55. type: String,
  56. default: ''
  57. },
  58. where: {
  59. type: Object,
  60. default: ''
  61. },
  62. pageData: {
  63. type: String,
  64. default: 'add'
  65. },
  66. pageCurrent: {
  67. type: Number,
  68. default: 1
  69. },
  70. pageSize: {
  71. type: Number,
  72. default: 20
  73. },
  74. getcount: {
  75. type: Boolean,
  76. default: false
  77. },
  78. gettree: {
  79. type: Object,
  80. default: ''
  81. },
  82. gettreepath: {
  83. type: Object,
  84. default: ''
  85. },
  86. startwith: {
  87. type: String,
  88. default: ''
  89. },
  90. limitlevel: {
  91. type: Number,
  92. default: 10
  93. },
  94. groupby: {
  95. type: String,
  96. default: ''
  97. },
  98. groupField: {
  99. type: String,
  100. default: ''
  101. },
  102. distinct: {
  103. type: Boolean,
  104. default: false
  105. },
  106. pageIndistinct: {
  107. type: Boolean,
  108. default: false
  109. },
  110. foreignKey: {
  111. type: String,
  112. default: ''
  113. },
  114. loadtime: {
  115. type: String,
  116. default: 'auto'
  117. },
  118. manual: {
  119. type: Boolean,
  120. default: false
  121. },
  122. preload: {
  123. type: Boolean,
  124. default: false
  125. },
  126. stepSearh: {
  127. type: Boolean,
  128. default: true
  129. },
  130. selfField: {
  131. type: String,
  132. default: ''
  133. },
  134. parentField: {
  135. type: String,
  136. default: ''
  137. },
  138. multiple: {
  139. type: Boolean,
  140. default: false
  141. },
  142. value: {
  143. type: Object,
  144. default: ''
  145. },
  146. modelValue: {
  147. type: Object,
  148. default: ''
  149. },
  150. defaultProps: {
  151. type: Object as PropType<UTSJSONObject>,
  152. }
  153. },
  154. data() {
  155. return {
  156. loading: false,
  157. error: null as UniCloudError | null,
  158. treeData: [] as Array<UTSJSONObject>,
  159. selectedIndex: 0,
  160. selectedNodes: [] as Array<UTSJSONObject>,
  161. selectedPages: [] as Array<UTSJSONObject>[],
  162. selectedValue: '',
  163. selectedPaths: [] as Array<UTSJSONObject>,
  164. pagination: {
  165. current: 1,
  166. size: 20,
  167. count: 0
  168. } as PaginationType
  169. }
  170. },
  171. computed: {
  172. mappingTextName() : string {
  173. // TODO
  174. return (this.defaultProps != null) ? this.defaultProps!.getString('text', 'text') : 'text'
  175. },
  176. mappingValueName() : string {
  177. // TODO
  178. return (this.defaultProps != null) ? this.defaultProps!.getString('value', 'value') : 'value'
  179. },
  180. currentDataList() : Array<UTSJSONObject> {
  181. if (this.selectedIndex > this.selectedPages.length - 1) {
  182. return [] as Array<UTSJSONObject>
  183. }
  184. return this.selectedPages[this.selectedIndex]
  185. },
  186. isLocalData() : boolean {
  187. return this.localdata.length > 0
  188. },
  189. isCloudData() : boolean {
  190. return this._checkIsNotNull(this.collection)
  191. },
  192. isCloudDataList() : boolean {
  193. return (this.isCloudData && (this.parentField.length == 0 && this.selfField.length == 0))
  194. },
  195. isCloudDataTree() : boolean {
  196. return (this.isCloudData && this.parentField.length > 0 && this.selfField.length > 0)
  197. },
  198. dataValue() : any {
  199. return this.hasModelValue ? this.modelValue : this.value
  200. },
  201. hasCloudTreeData() : boolean {
  202. return this.treeData.length > 0
  203. },
  204. hasModelValue() : boolean {
  205. if (typeof this.modelValue == 'string') {
  206. const valueString = this.modelValue as string
  207. return (valueString.length > 0)
  208. } else if (Array.isArray(this.modelValue)) {
  209. const valueArray = this.modelValue as Array<string>
  210. return (valueArray.length > 0)
  211. }
  212. return false
  213. },
  214. hasCloudDataValue() : boolean {
  215. if (typeof this.dataValue == 'string') {
  216. const valueString = this.dataValue as string
  217. return (valueString.length > 0)
  218. }
  219. return false
  220. }
  221. },
  222. created() {
  223. this.pagination.current = this.pageCurrent
  224. this.pagination.size = this.pageSize
  225. this.$watch(
  226. () : any => [
  227. this.pageCurrent,
  228. this.pageSize,
  229. this.localdata,
  230. this.value,
  231. this.collection,
  232. this.field,
  233. this.getcount,
  234. this.orderby,
  235. this.where,
  236. this.groupby,
  237. this.groupField,
  238. this.distinct
  239. ],
  240. (newValue : Array<any>, oldValue : Array<any>) => {
  241. this.pagination.size = this.pageSize
  242. if (newValue[0] !== oldValue[0]) {
  243. this.pagination.current = this.pageCurrent
  244. }
  245. this.onPropsChange()
  246. }
  247. )
  248. },
  249. methods: {
  250. onPropsChange() {
  251. this.selectedIndex = 0
  252. this.selectedNodes.length = 0
  253. this.selectedPages.length = 0
  254. this.selectedPaths.length = 0
  255. // 加载数据
  256. this.$nextTick(() => {
  257. this.loadData()
  258. })
  259. },
  260. onTabSelect(index : number) {
  261. this.selectedIndex = index
  262. },
  263. onNodeClick(nodeData : UTSJSONObject) {
  264. if (nodeData.getBoolean('disable', false)) {
  265. return
  266. }
  267. const isLeaf = this._checkIsLeafNode(nodeData)
  268. this._trimSelectedNodes(nodeData)
  269. this.$emit('nodeclick', nodeData)
  270. if (this.isLocalData) {
  271. if (isLeaf || !this._checkHasChildren(nodeData)) {
  272. this.onFinish()
  273. }
  274. } else if (this.isCloudDataList) {
  275. this.onFinish()
  276. } else if (this.isCloudDataTree) {
  277. if (isLeaf) {
  278. this.onFinish()
  279. } else if (!this._checkHasChildren(nodeData)) {
  280. // 尝试请求一次,如果没有返回数据标记为叶子节点
  281. this.loadCloudDataNode(nodeData)
  282. }
  283. }
  284. },
  285. getChangeNodes(): Array<UTSJSONObject> {
  286. const nodes: Array<UTSJSONObject> = []
  287. this.selectedNodes.forEach((node : UTSJSONObject) => {
  288. const newNode: UTSJSONObject = {}
  289. newNode[this.mappingTextName] = node.getString(this.mappingTextName)
  290. newNode[this.mappingValueName] = node.getString(this.mappingValueName)
  291. nodes.push(newNode)
  292. })
  293. return nodes
  294. },
  295. onFinish() { },
  296. // 加载数据(自动判定环境)
  297. loadData() {
  298. if (this.isLocalData) {
  299. this.loadLocalData()
  300. } else if (this.isCloudDataList) {
  301. this.loadCloudDataList()
  302. } else if (this.isCloudDataTree) {
  303. this.loadCloudDataTree()
  304. }
  305. },
  306. // 加载本地数据
  307. loadLocalData() {
  308. this.treeData = this.localdata
  309. if (Array.isArray(this.dataValue)) {
  310. const value = this.dataValue as Array<UTSJSONObject>
  311. this.selectedPaths = value.slice(0)
  312. this._pushSelectedTreeNodes(value, this.localdata)
  313. } else {
  314. this._pushSelectedNodes(this.localdata)
  315. }
  316. },
  317. // 加载 Cloud 数据 (单列)
  318. loadCloudDataList() {
  319. this._loadCloudData(null, (data : Array<UTSJSONObject>) => {
  320. this.treeData = data
  321. this._pushSelectedNodes(data)
  322. })
  323. },
  324. // 加载 Cloud 数据 (树形)
  325. loadCloudDataTree() {
  326. let commandOptions = {
  327. field: this._cloudDataPostField(),
  328. where: this._cloudDataTreeWhere(),
  329. getTree: true
  330. } as GetCommandOptions
  331. if (this._checkIsNotNull(this.gettree)) {
  332. commandOptions.startwith = `${this.selfField}=='${this.dataValue as string}'`
  333. }
  334. this._loadCloudData(commandOptions, (data : Array<UTSJSONObject>) => {
  335. this.treeData = data
  336. if (this.selectedPaths.length > 0) {
  337. this._pushSelectedTreeNodes(this.selectedPaths, data)
  338. } else {
  339. this._pushSelectedNodes(data)
  340. }
  341. })
  342. },
  343. // 加载 Cloud 数据 (节点)
  344. loadCloudDataNode(nodeData : UTSJSONObject) {
  345. const commandOptions = {
  346. field: this._cloudDataPostField(),
  347. where: this._cloudDataNodeWhere()
  348. } as GetCommandOptions
  349. this._loadCloudData(commandOptions, (data : Array<UTSJSONObject>) => {
  350. nodeData['children'] = data
  351. if (data.length == 0) {
  352. nodeData['isleaf'] = true
  353. this.onFinish()
  354. } else {
  355. this._pushSelectedNodes(data)
  356. }
  357. })
  358. },
  359. // 回显 Cloud Tree Path
  360. loadCloudDataPath() {
  361. if (!this.hasCloudDataValue) {
  362. return
  363. }
  364. const command : GetCommandOptions = {}
  365. // 单列
  366. if (this.isCloudDataList) {
  367. // 根据 field's as value标识匹配 where 条件
  368. let where : Array<string> = [];
  369. let whereField = this._getForeignKeyByField();
  370. if (whereField.length > 0) {
  371. where.push(`${whereField} == '${this.dataValue as string}'`)
  372. }
  373. let whereString = where.join(' || ')
  374. if (this._checkIsNotNull(this.where)) {
  375. whereString = `(${this.where}) && (${whereString})`
  376. }
  377. command.field = this._cloudDataPostField()
  378. command.where = whereString
  379. }
  380. // 树形
  381. if (this.isCloudDataTree) {
  382. command.field = this._cloudDataPostField()
  383. command.getTreePath = {
  384. startWith: `${this.selfField}=='${this.dataValue as string}'`
  385. }
  386. }
  387. this._loadCloudData(command, (data : Array<UTSJSONObject>) => {
  388. this._extractTreePath(data, this.selectedPaths)
  389. })
  390. },
  391. _loadCloudData(options ?: GetCommandOptions, callback ?: ((data : Array<UTSJSONObject>) => void)) {
  392. if (this.loading) {
  393. return
  394. }
  395. this.loading = true
  396. this.error = null
  397. this._getCommand(options).then((response : UniCloudDBGetResult) => {
  398. callback?.(response.data)
  399. }).catch((err : any | null) => {
  400. this.error = err as UniCloudError
  401. }).finally(() => {
  402. this.loading = false
  403. })
  404. },
  405. _cloudDataPostField() : string {
  406. let fields = [this.field];
  407. if (this.parentField.length > 0) {
  408. fields.push(`${this.parentField} as parent_value`)
  409. }
  410. return fields.join(',')
  411. },
  412. _cloudDataTreeWhere() : string {
  413. let result : Array<string> = []
  414. let selectedNodes = this.selectedNodes.length > 0 ? this.selectedNodes : this.selectedPaths
  415. let parentField = this.parentField
  416. if (parentField.length > 0) {
  417. result.push(`${parentField} == null || ${parentField} == ""`)
  418. }
  419. if (selectedNodes.length > 0) {
  420. for (var i = 0; i < selectedNodes.length - 1; i++) {
  421. const parentFieldValue = selectedNodes[i].getString('value', '')
  422. result.push(`${parentField} == '${parentFieldValue}'`)
  423. }
  424. }
  425. let where : Array<string> = []
  426. if (this._checkIsNotNull(this.where)) {
  427. where.push(`(${this.where as string})`)
  428. }
  429. if (result.length > 0) {
  430. where.push(`(${result.join(' || ')})`)
  431. }
  432. return where.join(' && ')
  433. },
  434. _cloudDataNodeWhere() : string {
  435. const where : Array<string> = []
  436. if (this.selectedNodes.length > 0) {
  437. const value = this.selectedNodes[this.selectedNodes.length - 1].getString('value', '')
  438. where.push(`${this.parentField} == '${value}'`)
  439. }
  440. let whereString = where.join(' || ')
  441. if (this._checkIsNotNull(this.where)) {
  442. return `(${this.where as string}) && (${whereString})`
  443. }
  444. return whereString
  445. },
  446. _getWhereByForeignKey() : string {
  447. let result : Array<string> = []
  448. let whereField = this._getForeignKeyByField();
  449. if (whereField.length > 0) {
  450. result.push(`${whereField} == '${this.dataValue as string}'`)
  451. }
  452. if (this._checkIsNotNull(this.where)) {
  453. return `(${this.where}) && (${result.join(' || ')})`
  454. }
  455. return result.join(' || ')
  456. },
  457. _getForeignKeyByField() : string {
  458. const fields = this.field.split(',')
  459. let whereField = ''
  460. for (let i = 0; i < fields.length; i++) {
  461. const items = fields[i].split('as')
  462. if (items.length < 2) {
  463. continue
  464. }
  465. if (items[1].trim() === 'value') {
  466. whereField = items[0].trim()
  467. break
  468. }
  469. }
  470. return whereField
  471. },
  472. _getCommand(options ?: GetCommandOptions) : Promise<UniCloudDBGetResult> {
  473. let db = uniCloud.databaseForJQL()
  474. let collection = Array.isArray(this.collection) ? db.collection(...(this.collection as Array<any>)) : db.collection(this.collection)
  475. let filter : UniCloudDBFilter | null = null
  476. if (this.foreignKey.length > 0) {
  477. filter = collection.foreignKey(this.foreignKey)
  478. }
  479. const where : any = options?.where ?? this.where
  480. if (typeof where == 'string') {
  481. const whereString = where as string
  482. if (whereString.length > 0) {
  483. filter = (filter != null) ? filter.where(where) : collection.where(where)
  484. }
  485. } else {
  486. filter = (filter != null) ? filter.where(where) : collection.where(where)
  487. }
  488. let query : UniCloudDBQuery | null = null
  489. if (this.field.length > 0) {
  490. query = (filter != null) ? filter.field(this.field) : collection.field(this.field)
  491. }
  492. if (this.groupby.length > 0) {
  493. if (query != null) {
  494. query = query.groupBy(this.groupby)
  495. } else if (filter != null) {
  496. query = filter.groupBy(this.groupby)
  497. }
  498. }
  499. if (this.groupField.length > 0) {
  500. if (query != null) {
  501. query = query.groupField(this.groupField)
  502. } else if (filter != null) {
  503. query = filter.groupField(this.groupField)
  504. }
  505. }
  506. if (this.distinct == true) {
  507. if (query != null) {
  508. query = query.distinct(this.field)
  509. } else if (filter != null) {
  510. query = filter.distinct(this.field)
  511. }
  512. }
  513. if (this.orderby.length > 0) {
  514. if (query != null) {
  515. query = query.orderBy(this.orderby)
  516. } else if (filter != null) {
  517. query = filter.orderBy(this.orderby)
  518. }
  519. }
  520. const size = this.pagination.size
  521. const current = this.pagination.current
  522. if (query != null) {
  523. query = query.skip(size * (current - 1)).limit(size)
  524. } else if (filter != null) {
  525. query = filter.skip(size * (current - 1)).limit(size)
  526. } else {
  527. query = collection.skip(size * (current - 1)).limit(size)
  528. }
  529. const getOptions = {}
  530. const treeOptions = {
  531. limitLevel: this.limitlevel,
  532. startWith: this.startwith
  533. }
  534. if (this.getcount == true) {
  535. getOptions['getCount'] = this.getcount
  536. }
  537. const getTree : any = options?.getTree ?? this.gettree
  538. if (typeof getTree == 'string') {
  539. const getTreeString = getTree as string
  540. if (getTreeString.length > 0) {
  541. getOptions['getTree'] = treeOptions
  542. }
  543. } else if (typeof getTree == 'object') {
  544. getOptions['getTree'] = treeOptions
  545. } else {
  546. getOptions['getTree'] = getTree
  547. }
  548. const getTreePath = options?.getTreePath ?? this.gettreepath
  549. if (typeof getTreePath == 'string') {
  550. const getTreePathString = getTreePath as string
  551. if (getTreePathString.length > 0) {
  552. getOptions['getTreePath'] = getTreePath
  553. }
  554. } else {
  555. getOptions['getTreePath'] = getTreePath
  556. }
  557. return query.get(getOptions)
  558. },
  559. _checkIsNotNull(value : any) : boolean {
  560. if (typeof value == 'string') {
  561. const valueString = value as string
  562. return (valueString.length > 0)
  563. } else if (value instanceof UTSJSONObject) {
  564. return true
  565. }
  566. return false
  567. },
  568. _checkIsLeafNode(nodeData : UTSJSONObject) : boolean {
  569. if (this.selectedIndex >= this.limitlevel) {
  570. return true
  571. }
  572. if (nodeData.getBoolean('isleaf', false)) {
  573. return true
  574. }
  575. return false
  576. },
  577. _checkHasChildren(nodeData : UTSJSONObject) : boolean {
  578. const children = nodeData.getArray('children') ?? ([] as Array<any>)
  579. return children.length > 0
  580. },
  581. _pushSelectedNodes(nodes : Array<UTSJSONObject>) {
  582. this.selectedNodes.push(DefaultSelectedNode)
  583. this.selectedPages.push(nodes)
  584. this.selectedIndex = this.selectedPages.length - 1
  585. },
  586. _trimSelectedNodes(nodeData : UTSJSONObject) {
  587. this.selectedNodes.splice(this.selectedIndex)
  588. this.selectedNodes.push(nodeData)
  589. if (this.selectedPages.length > 0) {
  590. this.selectedPages.splice(this.selectedIndex + 1)
  591. }
  592. const children = nodeData.getArray<UTSJSONObject>('children') ?? ([] as Array<UTSJSONObject>)
  593. if (children.length > 0) {
  594. this.selectedNodes.push(DefaultSelectedNode)
  595. this.selectedPages.push(children)
  596. }
  597. this.selectedIndex = this.selectedPages.length - 1
  598. },
  599. _pushSelectedTreeNodes(paths : Array<UTSJSONObject>, nodes : Array<UTSJSONObject>) {
  600. let children : Array<UTSJSONObject> = nodes
  601. paths.forEach((node : UTSJSONObject) => {
  602. const findNode = children.find((item : UTSJSONObject) : boolean => {
  603. return (item.getString(this.mappingValueName) == node.getString(this.mappingValueName))
  604. })
  605. if (findNode != null) {
  606. this.selectedPages.push(children)
  607. this.selectedNodes.push(node)
  608. children = findNode.getArray<UTSJSONObject>('children') ?? ([] as Array<UTSJSONObject>)
  609. }
  610. })
  611. this.selectedIndex = this.selectedPages.length - 1
  612. },
  613. _extractTreePath(nodes : Array<UTSJSONObject>, result : Array<UTSJSONObject>) {
  614. if (nodes.length == 0) {
  615. return
  616. }
  617. const node = nodes[0]
  618. result.push(node)
  619. const children = node.getArray<UTSJSONObject>('children')
  620. if (Array.isArray(children) && children!.length > 0) {
  621. this._extractTreePath(children, result)
  622. }
  623. }
  624. }
  625. })