田强 / qx-common · Commits

Commit 910f10c57264aea2d3ddcb4e89849d80dc5b507f

Authored by 陈洋
1 parent a53e7466

pref: 组件样式 迭代

Inline Side-by-side
Showing 8 changed files with 1297 additions and 23 deletions
1 1 {
2 2 "name": "@qx/common",
3   - "version": "3.0.0-alpha.5",
  3 + "version": "3.0.0-alpha.6",
4 4 "lockfileVersion": 2,
5 5 "requires": true,
6 6 "packages": {
7 7 "": {
8 8 "name": "@qx/common",
9   - "version": "3.0.0-alpha.5",
  9 + "version": "3.0.0-alpha.6",
10 10 "license": "MIT",
11 11 "dependencies": {
12 12 "@ant-design/icons": "^5.2.5",
... ...
1 1 {
2 2 "name": "@qx/common",
3   - "version": "3.0.0-alpha.5",
  3 + "version": "3.0.0-alpha.6",
4 4 "description": "A react library developed with dumi",
5 5 "license": "MIT",
6 6 "module": "dist/index.js",
... ...
... ... @@ -216,3 +216,75 @@ export default () => {
216 216 }}/>;
217 217 };
218 218 ```
  219 +### 单个 选择弹框
  220 +
  221 +```tsx
  222 +import React from 'react';
  223 +import { QxFieldPopover, QxBaseIcon } from '@qx/common';
  224 +import {optionsList, treeList} from './mock';
  225 +import {
  226 + Button,
  227 + Col,
  228 + Dropdown,
  229 + Input,
  230 + Menu,
  231 + message,
  232 + Row,
  233 + Space,
  234 + Tooltip,
  235 + TreeSelect,
  236 + Typography,
  237 +} from 'antd';
  238 +
  239 +export default () => {
  240 + return <QxFieldPopover onChange={(val) => {
  241 +
  242 + }} data={optionsList} trigger={'click'}>
  243 + <Button
  244 + size="small"
  245 + type={'link'}
  246 + >
  247 + <QxBaseIcon style={{fontSize: 16}} type={'qx-icon-plus'} />
  248 + 添加字段
  249 + </Button>
  250 + </QxFieldPopover>;
  251 +};
  252 +```
  253 +
  254 +### 多个选择弹框
  255 +
  256 +```tsx
  257 +import React, {useState} from 'react';
  258 +import { QxFieldPopover, QxBaseIcon, QxCheckboxFieldPopover } from '@qx/common';
  259 +import {optionsList, treeList} from './mock';
  260 +import {
  261 + Button,
  262 + Col,
  263 + Dropdown,
  264 + Input,
  265 + Menu,
  266 + message,
  267 + Row,
  268 + Space,
  269 + Tooltip,
  270 + TreeSelect,
  271 + Typography,
  272 +} from 'antd';
  273 +
  274 +export default () => {
  275 + const [selectedFieldsKey, setSelectedFieldsKey] = useState<string[]>([]);
  276 +
  277 +
  278 + return <QxCheckboxFieldPopover onChange={(val) => {
  279 + setSelectedFieldsKey(val)
  280 + }} data={optionsList} values={selectedFieldsKey} trigger={'click'}>
  281 + <Button
  282 + size="small"
  283 + type={'link'}
  284 + >
  285 + <QxBaseIcon style={{fontSize: 16}} type={'qx-icon-plus'} />
  286 + 添加字段
  287 + </Button>
  288 + </QxCheckboxFieldPopover>;
  289 +};
  290 +```
... ...
1 1 import QxFieldItem from './src/item';
2 2 import QxFieldSelect from './src/select';
3 3 import QxFieldPopover from './src/popover';
4   -// import QxCheckboxFieldPopover from './src/popover/checkbox';
  4 +import QxCheckboxFieldPopover from './src/popover/checkbox';
5 5
6   -export { QxFieldItem, QxFieldSelect, QxFieldPopover };
  6 +export { QxFieldItem, QxFieldSelect, QxFieldPopover, QxCheckboxFieldPopover };
... ...
  1 +export const optionsList = [
  2 + {
  3 + "name": "记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录记录记录记录记录记录记录记录记录记录记录记录",
  4 + "code": "id",
  5 + "extract": {
  6 + "fieldType": "REL",
  7 + "fieldKey": "id",
  8 + "widget": "relSelector",
  9 + "relId": "EsDhRXIo0OVRQol54PR",
  10 + "allowSelect": true,
  11 + "$base": true
  12 + }
  13 + },
  14 + {
  15 + "name": "标题",
  16 + "code": "title",
  17 + "extract": {
  18 + "fieldType": "STRING",
  19 + "fieldKey": "title",
  20 + "widget": "qxInput",
  21 + "required": true,
  22 + "readOnly": false,
  23 + "hidden": false
  24 + }
  25 + },
  26 + {
  27 + "name": "简单统计1单标签",
  28 + "code": "rel_bxxukj",
  29 + "extract": {
  30 + "fieldType": "REL",
  31 + "fieldKey": "rel_bxxukj",
  32 + "widget": "relSelector",
  33 + "required": false,
  34 + "readOnly": false,
  35 + "hidden": false,
  36 + "relId": "ydJhLCYFDfR9u9RZWD6",
  37 + "allowSelect": true,
  38 + "allowAdd": true,
  39 + "enableEdit": false,
  40 + "relAppCode": "cjzza",
  41 + "relFunCode": "hcxsd"
  42 + }
  43 + },
  44 + {
  45 + "name": "简单统计1多标签",
  46 + "code": "relSelector_hjktkq",
  47 + "extract": {
  48 + "fieldType": "REL_MULTI",
  49 + "fieldKey": "relSelector_hjktkq",
  50 + "widget": "relSelector",
  51 + "required": false,
  52 + "readOnly": false,
  53 + "hidden": false,
  54 + "relId": "ydJhLCYFDfR9u9RZWD6",
  55 + "allowSelect": true,
  56 + "allowAdd": true,
  57 + "enableEdit": false,
  58 + "relAppCode": "cjzza",
  59 + "relFunCode": "hcxsd"
  60 + }
  61 + },
  62 + {
  63 + "name": "简单统计1多表格",
  64 + "code": "relSelector_hzaqtp",
  65 + "extract": {
  66 + "fieldType": "REL_MULTI",
  67 + "fieldKey": "relSelector_hzaqtp",
  68 + "widget": "relSelector",
  69 + "required": false,
  70 + "readOnly": false,
  71 + "hidden": false,
  72 + "relId": "ydJhLCYFDfR9u9RZWD6",
  73 + "allowSelect": true,
  74 + "allowAdd": true,
  75 + "enableEdit": false,
  76 + "relAppCode": "cjzza",
  77 + "relFunCode": "hcxsd"
  78 + }
  79 + },
  80 + {
  81 + "name": "描述",
  82 + "code": "description",
  83 + "extract": {
  84 + "fieldType": "TEXT",
  85 + "fieldKey": "description",
  86 + "widget": "qxInput",
  87 + "required": false,
  88 + "readOnly": false,
  89 + "hidden": false
  90 + }
  91 + },
  92 + {
  93 + "name": "图片",
  94 + "code": "img_vslcgc",
  95 + "extract": {
  96 + "fieldType": "FILE",
  97 + "fieldKey": "img_vslcgc",
  98 + "widget": "qxUploadImage",
  99 + "required": false,
  100 + "readOnly": false,
  101 + "hidden": false
  102 + }
  103 + },
  104 + {
  105 + "name": "数值",
  106 + "code": "num_cagoif",
  107 + "extract": {
  108 + "fieldType": "DOUBLE",
  109 + "fieldKey": "num_cagoif",
  110 + "widget": "qxNumber",
  111 + "required": false,
  112 + "readOnly": false,
  113 + "hidden": false
  114 + }
  115 + },
  116 + {
  117 + "name": "文本",
  118 + "code": "input_fkjlvi",
  119 + "extract": {
  120 + "fieldType": "STRING",
  121 + "fieldKey": "input_fkjlvi",
  122 + "widget": "qxInput",
  123 + "required": false,
  124 + "readOnly": false,
  125 + "hidden": false
  126 + }
  127 + },
  128 + {
  129 + "name": "日期",
  130 + "code": "date_uvpapz",
  131 + "extract": {
  132 + "fieldType": "YEAR_SEC",
  133 + "fieldKey": "date_uvpapz",
  134 + "widget": "qxDatetime",
  135 + "required": false,
  136 + "readOnly": false,
  137 + "hidden": false
  138 + }
  139 + },
  140 + {
  141 + "name": "时间",
  142 + "code": "time_awxdij",
  143 + "extract": {
  144 + "fieldType": "HOUR_MIN",
  145 + "fieldKey": "time_awxdij",
  146 + "widget": "qxTime",
  147 + "required": false,
  148 + "readOnly": false,
  149 + "hidden": false
  150 + }
  151 + },
  152 + {
  153 + "name": "开关",
  154 + "code": "switch_qhiokh",
  155 + "extract": {
  156 + "fieldType": "BOOL",
  157 + "fieldKey": "switch_qhiokh",
  158 + "widget": "qxSwitch",
  159 + "required": false,
  160 + "readOnly": false,
  161 + "hidden": false
  162 + }
  163 + },
  164 + {
  165 + "name": "多选",
  166 + "code": "select_m_sahhgm",
  167 + "extract": {
  168 + "fieldType": "ENUM_MULTI",
  169 + "fieldKey": "select_m_sahhgm",
  170 + "widget": "qxMultiSelect",
  171 + "required": false,
  172 + "readOnly": false,
  173 + "hidden": false
  174 + }
  175 + },
  176 + {
  177 + "name": "单选",
  178 + "code": "select_ytsdsm",
  179 + "extract": {
  180 + "fieldType": "ENUM",
  181 + "fieldKey": "select_ytsdsm",
  182 + "widget": "qxSelect",
  183 + "required": false,
  184 + "readOnly": false,
  185 + "hidden": false
  186 + }
  187 + },
  188 + {
  189 + "name": "金额",
  190 + "code": "money_iiixgq",
  191 + "extract": {
  192 + "fieldType": "DECIMAL",
  193 + "fieldKey": "money_iiixgq",
  194 + "widget": "qxMoney",
  195 + "required": false,
  196 + "readOnly": false,
  197 + "hidden": false
  198 + }
  199 + },
  200 + {
  201 + "name": "百分数",
  202 + "code": "percent_phlubg",
  203 + "extract": {
  204 + "fieldType": "PERCENT",
  205 + "fieldKey": "percent_phlubg",
  206 + "widget": "qxPercent",
  207 + "required": false,
  208 + "readOnly": false,
  209 + "hidden": false
  210 + }
  211 + },
  212 + {
  213 + "name": "邮箱",
  214 + "code": "email_ioccbo",
  215 + "extract": {
  216 + "fieldType": "STRING",
  217 + "fieldKey": "email_ioccbo",
  218 + "widget": "qxEmail",
  219 + "required": false,
  220 + "readOnly": false,
  221 + "hidden": false
  222 + }
  223 + },
  224 + {
  225 + "name": "手机",
  226 + "code": "mobile_khosix",
  227 + "extract": {
  228 + "fieldType": "STRING",
  229 + "fieldKey": "mobile_khosix",
  230 + "widget": "qxMobile",
  231 + "required": false,
  232 + "readOnly": false,
  233 + "hidden": false
  234 + }
  235 + },
  236 + {
  237 + "name": "地址",
  238 + "code": "address_tppevj",
  239 + "extract": {
  240 + "fieldType": "STRING",
  241 + "fieldKey": "address_tppevj",
  242 + "widget": "qxAddress",
  243 + "required": false,
  244 + "readOnly": false,
  245 + "hidden": false
  246 + }
  247 + },
  248 + {
  249 + "name": "附件",
  250 + "code": "file_giiptw",
  251 + "extract": {
  252 + "fieldType": "FILE",
  253 + "fieldKey": "file_giiptw",
  254 + "widget": "qxUpload",
  255 + "required": false,
  256 + "readOnly": false,
  257 + "hidden": false
  258 + }
  259 + },
  260 + {
  261 + "name": "富文本",
  262 + "code": "rich_uzyiau",
  263 + "extract": {
  264 + "fieldType": "TEXT",
  265 + "fieldKey": "rich_uzyiau",
  266 + "widget": "qxRichText",
  267 + "required": false,
  268 + "readOnly": false,
  269 + "hidden": false
  270 + }
  271 + },
  272 + {
  273 + "name": "选人员",
  274 + "code": "user_wdeiip",
  275 + "extract": {
  276 + "fieldType": "USER",
  277 + "fieldKey": "user_wdeiip",
  278 + "widget": "userSelector",
  279 + "required": false,
  280 + "readOnly": false,
  281 + "hidden": false,
  282 + "relId": "user"
  283 + }
  284 + },
  285 + {
  286 + "name": "选部门",
  287 + "code": "org_mayygw",
  288 + "extract": {
  289 + "fieldType": "ORG",
  290 + "fieldKey": "org_mayygw",
  291 + "widget": "orgSelector",
  292 + "required": false,
  293 + "readOnly": false,
  294 + "hidden": false,
  295 + "relId": "org"
  296 + }
  297 + },
  298 + {
  299 + "name": "选人员-多",
  300 + "code": "userSelector_vieygh",
  301 + "extract": {
  302 + "fieldType": "USER_MULTI",
  303 + "fieldKey": "userSelector_vieygh",
  304 + "widget": "userSelector",
  305 + "required": false,
  306 + "readOnly": false,
  307 + "hidden": false,
  308 + "relId": "user"
  309 + }
  310 + },
  311 + {
  312 + "name": "选部门-多",
  313 + "code": "orgSelector_zqgyfg",
  314 + "extract": {
  315 + "fieldType": "ORG_MULTI",
  316 + "fieldKey": "orgSelector_zqgyfg",
  317 + "widget": "orgSelector",
  318 + "required": false,
  319 + "readOnly": false,
  320 + "hidden": false,
  321 + "relId": "org"
  322 + }
  323 + },
  324 + {
  325 + "name": "创建人",
  326 + "code": "created_by",
  327 + "extract": {
  328 + "fieldType": "USER",
  329 + "fieldKey": "created_by",
  330 + "widget": "userSelector",
  331 + "required": false,
  332 + "readOnly": false,
  333 + "hidden": false,
  334 + "relId": "user",
  335 + "$base": true
  336 + }
  337 + },
  338 + {
  339 + "name": "创建时间",
  340 + "code": "created_at2222",
  341 + "extract": {
  342 + "fieldType": "STRING",
  343 + "fieldKey": "created_at2222",
  344 + "widget": "createdAt",
  345 + "required": false,
  346 + "readOnly": false,
  347 + "hidden": false
  348 + }
  349 + },
  350 + {
  351 + "name": "更新人",
  352 + "code": "updated_by",
  353 + "extract": {
  354 + "fieldType": "USER",
  355 + "fieldKey": "updated_by",
  356 + "widget": "userSelector",
  357 + "required": false,
  358 + "readOnly": false,
  359 + "hidden": false,
  360 + "relId": "user",
  361 + "$base": true
  362 + }
  363 + },
  364 + {
  365 + "name": "更新时间",
  366 + "code": "updated_at",
  367 + "extract": {
  368 + "fieldType": "YEAR_SEC",
  369 + "fieldKey": "updated_at",
  370 + "widget": "qxDatetime",
  371 + "required": false,
  372 + "readOnly": false,
  373 + "hidden": false,
  374 + "$base": true
  375 + }
  376 + },
  377 + {
  378 + "name": "公式",
  379 + "code": "fx_jdfqnd",
  380 + "extract": {
  381 + "fieldType": "FORMULA",
  382 + "fieldKey": "fx_jdfqnd",
  383 + "widget": "qxFormula",
  384 + "required": false,
  385 + "readOnly": false,
  386 + "hidden": false
  387 + }
  388 + },
  389 + {
  390 + "name": "流水号",
  391 + "code": "no_ilgtbb",
  392 + "extract": {
  393 + "fieldType": "STRING",
  394 + "fieldKey": "no_ilgtbb",
  395 + "widget": "qxBizNo",
  396 + "required": false,
  397 + "readOnly": true,
  398 + "hidden": false
  399 + }
  400 + },
  401 + {
  402 + "name": "树形关联",
  403 + "code": "p_id",
  404 + "extract": {
  405 + "fieldType": "TREE",
  406 + "fieldKey": "p_id",
  407 + "widget": "qxTree",
  408 + "required": true,
  409 + "readOnly": false,
  410 + "hidden": false,
  411 + "relId": "EsDhRXIo0OVRQol54PR"
  412 + }
  413 + },
  414 + {
  415 + "name": "子表",
  416 + "code": "sub_zyycui",
  417 + "extract": {
  418 + "fieldType": "TABLE",
  419 + "fieldKey": "sub_zyycui",
  420 + "widget": "subform",
  421 + "required": false,
  422 + "readOnly": false,
  423 + "hidden": false,
  424 + "relId": "oJHol3pBmfwKd6SULhX"
  425 + }
  426 + },
  427 + {
  428 + "name": "关联记录-简单统计2",
  429 + "code": "rel_xaxqec",
  430 + "extract": {
  431 + "fieldType": "REL_MULTI",
  432 + "fieldKey": "rel_xaxqec",
  433 + "widget": "relSelector",
  434 + "required": false,
  435 + "readOnly": false,
  436 + "hidden": false,
  437 + "relId": "olfkD8dExv49R0FAiIW",
  438 + "allowSelect": true,
  439 + "allowAdd": true,
  440 + "enableEdit": false,
  441 + "relAppCode": "cjzza",
  442 + "relFunCode": "hkzf8"
  443 + }
  444 + },
  445 + {
  446 + "name": "关联1-1",
  447 + "code": "rel_ulqhzt",
  448 + "extract": {
  449 + "fieldType": "REL_MULTI",
  450 + "fieldKey": "rel_ulqhzt",
  451 + "widget": "relSelector",
  452 + "required": false,
  453 + "readOnly": false,
  454 + "hidden": false,
  455 + "relId": "pJMTmcXEH9Dq9mnq6wV",
  456 + "allowSelect": true,
  457 + "allowAdd": true,
  458 + "enableEdit": false,
  459 + "relAppCode": "cjzza",
  460 + "relFunCode": "8xcmq"
  461 + }
  462 + },
  463 + {
  464 + "name": "关联1",
  465 + "code": "rel_nofdmy",
  466 + "extract": {
  467 + "fieldType": "REL_MULTI",
  468 + "fieldKey": "rel_nofdmy",
  469 + "widget": "relSelector",
  470 + "required": false,
  471 + "readOnly": false,
  472 + "hidden": false,
  473 + "relId": "duvtdNb0dbuBaDceWav",
  474 + "allowSelect": true,
  475 + "allowAdd": true,
  476 + "enableEdit": false,
  477 + "relAppCode": "cjzza",
  478 + "relFunCode": "hi76x"
  479 + }
  480 + },
  481 + {
  482 + "name": "数据标题",
  483 + "code": "data_title",
  484 + "extract": {
  485 + "fieldType": "STRING",
  486 + "fieldKey": "data_title",
  487 + "widget": "qxInput",
  488 + "required": false,
  489 + "readOnly": false,
  490 + "hidden": false,
  491 + "$base": true,
  492 + "$default": true
  493 + }
  494 + },
  495 + {
  496 + "name": "拥有人",
  497 + "code": "owner_id",
  498 + "extract": {
  499 + "fieldType": "USER",
  500 + "fieldKey": "owner_id",
  501 + "widget": "userSelector",
  502 + "required": false,
  503 + "readOnly": false,
  504 + "hidden": false,
  505 + "relId": "user",
  506 + "$base": true,
  507 + "$default": true
  508 + }
  509 + },
  510 + {
  511 + "name": "创建时间",
  512 + "code": "created_at",
  513 + "extract": {
  514 + "fieldType": "YEAR_SEC",
  515 + "fieldKey": "created_at",
  516 + "widget": "qxDatetime",
  517 + "required": false,
  518 + "readOnly": false,
  519 + "hidden": false,
  520 + "$base": true,
  521 + "$default": true
  522 + }
  523 + }
  524 +];
  525 +
  526 +export const treeList = [
  527 + {
  528 + "key": "id",
  529 + "code": "id",
  530 + "filedName": "id",
  531 + "name": "记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录ID记录记录记录记录记录记录记录记录记录记录记录记录",
  532 + "extract": {
  533 + "fieldType": "REL",
  534 + "fieldKey": "id",
  535 + "widget": "relSelector",
  536 + "relId": "EsDhRXIo0OVRQol54PR",
  537 + "allowSelect": true,
  538 + "$base": true
  539 + },
  540 + "fieldType": "REL",
  541 + "fieldGroupType": "REL"
  542 + },
  543 + {
  544 + "key": "title",
  545 + "code": "title",
  546 + "filedName": "title",
  547 + "name": "标题",
  548 + "extract": {
  549 + "fieldType": "STRING",
  550 + "fieldKey": "title",
  551 + "widget": "qxInput",
  552 + "required": true,
  553 + "readOnly": false,
  554 + "hidden": false
  555 + },
  556 + "fieldType": "STRING",
  557 + "fieldGroupType": "TEXT"
  558 + },
  559 + {
  560 + "key": "rel_bxxukj",
  561 + "code": "rel_bxxukj",
  562 + "filedName": "rel_bxxukj",
  563 + "name": "简单统计1单标签",
  564 + "extract": {
  565 + "fieldType": "REL",
  566 + "fieldKey": "rel_bxxukj",
  567 + "widget": "relSelector",
  568 + "required": false,
  569 + "readOnly": false,
  570 + "hidden": false,
  571 + "relId": "ydJhLCYFDfR9u9RZWD6",
  572 + "allowSelect": true,
  573 + "allowAdd": true,
  574 + "enableEdit": false,
  575 + "relAppCode": "cjzza",
  576 + "relFunCode": "hcxsd"
  577 + },
  578 + "fieldType": "REL",
  579 + "fieldGroupType": "REL"
  580 + },
  581 + {
  582 + "key": "relSelector_hjktkq",
  583 + "code": "relSelector_hjktkq",
  584 + "filedName": "relSelector_hjktkq",
  585 + "name": "简单统计1多标签",
  586 + "extract": {
  587 + "fieldType": "REL_MULTI",
  588 + "fieldKey": "relSelector_hjktkq",
  589 + "widget": "relSelector",
  590 + "required": false,
  591 + "readOnly": false,
  592 + "hidden": false,
  593 + "relId": "ydJhLCYFDfR9u9RZWD6",
  594 + "allowSelect": true,
  595 + "allowAdd": true,
  596 + "enableEdit": false,
  597 + "relAppCode": "cjzza",
  598 + "relFunCode": "hcxsd"
  599 + },
  600 + "fieldType": "REL_MULTI",
  601 + "fieldGroupType": "REL_MULTI"
  602 + },
  603 + {
  604 + "key": "relSelector_hzaqtp",
  605 + "code": "relSelector_hzaqtp",
  606 + "filedName": "relSelector_hzaqtp",
  607 + "name": "简单统计1多表格",
  608 + "extract": {
  609 + "fieldType": "REL_MULTI",
  610 + "fieldKey": "relSelector_hzaqtp",
  611 + "widget": "relSelector",
  612 + "required": false,
  613 + "readOnly": false,
  614 + "hidden": false,
  615 + "relId": "ydJhLCYFDfR9u9RZWD6",
  616 + "allowSelect": true,
  617 + "allowAdd": true,
  618 + "enableEdit": false,
  619 + "relAppCode": "cjzza",
  620 + "relFunCode": "hcxsd"
  621 + },
  622 + "fieldType": "REL_MULTI",
  623 + "fieldGroupType": "REL_MULTI"
  624 + },
  625 + {
  626 + "key": "description",
  627 + "code": "description",
  628 + "filedName": "description",
  629 + "name": "描述",
  630 + "extract": {
  631 + "fieldType": "TEXT",
  632 + "fieldKey": "description",
  633 + "widget": "qxInput",
  634 + "required": false,
  635 + "readOnly": false,
  636 + "hidden": false
  637 + },
  638 + "fieldType": "TEXT",
  639 + "fieldGroupType": "TEXT"
  640 + },
  641 + {
  642 + "key": "img_vslcgc",
  643 + "code": "img_vslcgc",
  644 + "filedName": "img_vslcgc",
  645 + "name": "图片",
  646 + "extract": {
  647 + "fieldType": "FILE",
  648 + "fieldKey": "img_vslcgc",
  649 + "widget": "qxUploadImage",
  650 + "required": false,
  651 + "readOnly": false,
  652 + "hidden": false
  653 + },
  654 + "fieldType": "FILE",
  655 + "fieldGroupType": "FILE"
  656 + },
  657 + {
  658 + "key": "num_cagoif",
  659 + "code": "num_cagoif",
  660 + "filedName": "num_cagoif",
  661 + "name": "数值",
  662 + "extract": {
  663 + "fieldType": "DOUBLE",
  664 + "fieldKey": "num_cagoif",
  665 + "widget": "qxNumber",
  666 + "required": false,
  667 + "readOnly": false,
  668 + "hidden": false
  669 + },
  670 + "fieldType": "DOUBLE",
  671 + "fieldGroupType": "NUM"
  672 + },
  673 + {
  674 + "key": "input_fkjlvi",
  675 + "code": "input_fkjlvi",
  676 + "filedName": "input_fkjlvi",
  677 + "name": "文本",
  678 + "extract": {
  679 + "fieldType": "STRING",
  680 + "fieldKey": "input_fkjlvi",
  681 + "widget": "qxInput",
  682 + "required": false,
  683 + "readOnly": false,
  684 + "hidden": false
  685 + },
  686 + "fieldType": "STRING",
  687 + "fieldGroupType": "TEXT"
  688 + },
  689 + {
  690 + "key": "date_uvpapz",
  691 + "code": "date_uvpapz",
  692 + "filedName": "date_uvpapz",
  693 + "name": "日期",
  694 + "extract": {
  695 + "fieldType": "YEAR_SEC",
  696 + "fieldKey": "date_uvpapz",
  697 + "widget": "qxDatetime",
  698 + "required": false,
  699 + "readOnly": false,
  700 + "hidden": false
  701 + },
  702 + "fieldType": "YEAR_SEC",
  703 + "fieldGroupType": "DATE"
  704 + },
  705 + {
  706 + "key": "time_awxdij",
  707 + "code": "time_awxdij",
  708 + "filedName": "time_awxdij",
  709 + "name": "时间",
  710 + "extract": {
  711 + "fieldType": "HOUR_MIN",
  712 + "fieldKey": "time_awxdij",
  713 + "widget": "qxTime",
  714 + "required": false,
  715 + "readOnly": false,
  716 + "hidden": false
  717 + },
  718 + "fieldType": "HOUR_MIN",
  719 + "fieldGroupType": "TIME"
  720 + },
  721 + {
  722 + "key": "switch_qhiokh",
  723 + "code": "switch_qhiokh",
  724 + "filedName": "switch_qhiokh",
  725 + "name": "开关",
  726 + "extract": {
  727 + "fieldType": "BOOL",
  728 + "fieldKey": "switch_qhiokh",
  729 + "widget": "qxSwitch",
  730 + "required": false,
  731 + "readOnly": false,
  732 + "hidden": false
  733 + },
  734 + "fieldType": "BOOL",
  735 + "fieldGroupType": "BOOL"
  736 + },
  737 + {
  738 + "key": "select_m_sahhgm",
  739 + "code": "select_m_sahhgm",
  740 + "filedName": "select_m_sahhgm",
  741 + "name": "多选",
  742 + "extract": {
  743 + "fieldType": "ENUM_MULTI",
  744 + "fieldKey": "select_m_sahhgm",
  745 + "widget": "qxMultiSelect",
  746 + "required": false,
  747 + "readOnly": false,
  748 + "hidden": false
  749 + },
  750 + "fieldType": "ENUM_MULTI",
  751 + "fieldGroupType": "ENUM_MULTI"
  752 + },
  753 + {
  754 + "key": "select_ytsdsm",
  755 + "code": "select_ytsdsm",
  756 + "filedName": "select_ytsdsm",
  757 + "name": "单选",
  758 + "extract": {
  759 + "fieldType": "ENUM",
  760 + "fieldKey": "select_ytsdsm",
  761 + "widget": "qxSelect",
  762 + "required": false,
  763 + "readOnly": false,
  764 + "hidden": false
  765 + },
  766 + "fieldType": "ENUM",
  767 + "fieldGroupType": "ENUM"
  768 + },
  769 + {
  770 + "key": "money_iiixgq",
  771 + "code": "money_iiixgq",
  772 + "filedName": "money_iiixgq",
  773 + "name": "金额",
  774 + "extract": {
  775 + "fieldType": "DECIMAL",
  776 + "fieldKey": "money_iiixgq",
  777 + "widget": "qxMoney",
  778 + "required": false,
  779 + "readOnly": false,
  780 + "hidden": false
  781 + },
  782 + "fieldType": "DECIMAL",
  783 + "fieldGroupType": "NUM"
  784 + },
  785 + {
  786 + "key": "percent_phlubg",
  787 + "code": "percent_phlubg",
  788 + "filedName": "percent_phlubg",
  789 + "name": "百分数",
  790 + "extract": {
  791 + "fieldType": "PERCENT",
  792 + "fieldKey": "percent_phlubg",
  793 + "widget": "qxPercent",
  794 + "required": false,
  795 + "readOnly": false,
  796 + "hidden": false
  797 + },
  798 + "fieldType": "PERCENT",
  799 + "fieldGroupType": "NUM"
  800 + },
  801 + {
  802 + "key": "email_ioccbo",
  803 + "code": "email_ioccbo",
  804 + "filedName": "email_ioccbo",
  805 + "name": "邮箱",
  806 + "extract": {
  807 + "fieldType": "STRING",
  808 + "fieldKey": "email_ioccbo",
  809 + "widget": "qxEmail",
  810 + "required": false,
  811 + "readOnly": false,
  812 + "hidden": false
  813 + },
  814 + "fieldType": "STRING",
  815 + "fieldGroupType": "TEXT"
  816 + },
  817 + {
  818 + "key": "mobile_khosix",
  819 + "code": "mobile_khosix",
  820 + "filedName": "mobile_khosix",
  821 + "name": "手机",
  822 + "extract": {
  823 + "fieldType": "STRING",
  824 + "fieldKey": "mobile_khosix",
  825 + "widget": "qxMobile",
  826 + "required": false,
  827 + "readOnly": false,
  828 + "hidden": false
  829 + },
  830 + "fieldType": "STRING",
  831 + "fieldGroupType": "TEXT"
  832 + },
  833 + {
  834 + "key": "address_tppevj",
  835 + "code": "address_tppevj",
  836 + "filedName": "address_tppevj",
  837 + "name": "地址",
  838 + "extract": {
  839 + "fieldType": "STRING",
  840 + "fieldKey": "address_tppevj",
  841 + "widget": "qxAddress",
  842 + "required": false,
  843 + "readOnly": false,
  844 + "hidden": false
  845 + },
  846 + "fieldType": "STRING",
  847 + "fieldGroupType": "TEXT"
  848 + },
  849 + {
  850 + "key": "file_giiptw",
  851 + "code": "file_giiptw",
  852 + "filedName": "file_giiptw",
  853 + "name": "附件",
  854 + "extract": {
  855 + "fieldType": "FILE",
  856 + "fieldKey": "file_giiptw",
  857 + "widget": "qxUpload",
  858 + "required": false,
  859 + "readOnly": false,
  860 + "hidden": false
  861 + },
  862 + "fieldType": "FILE",
  863 + "fieldGroupType": "FILE"
  864 + },
  865 + {
  866 + "key": "user_wdeiip",
  867 + "code": "user_wdeiip",
  868 + "filedName": "user_wdeiip",
  869 + "name": "选人员",
  870 + "extract": {
  871 + "fieldType": "USER",
  872 + "fieldKey": "user_wdeiip",
  873 + "widget": "userSelector",
  874 + "required": false,
  875 + "readOnly": false,
  876 + "hidden": false,
  877 + "relId": "user"
  878 + },
  879 + "fieldType": "USER",
  880 + "fieldGroupType": "USER"
  881 + },
  882 + {
  883 + "key": "org_mayygw",
  884 + "code": "org_mayygw",
  885 + "filedName": "org_mayygw",
  886 + "name": "选部门",
  887 + "extract": {
  888 + "fieldType": "ORG",
  889 + "fieldKey": "org_mayygw",
  890 + "widget": "orgSelector",
  891 + "required": false,
  892 + "readOnly": false,
  893 + "hidden": false,
  894 + "relId": "org"
  895 + },
  896 + "fieldType": "ORG",
  897 + "fieldGroupType": "ORG"
  898 + },
  899 + {
  900 + "key": "userSelector_vieygh",
  901 + "code": "userSelector_vieygh",
  902 + "filedName": "userSelector_vieygh",
  903 + "name": "选人员-多",
  904 + "extract": {
  905 + "fieldType": "USER_MULTI",
  906 + "fieldKey": "userSelector_vieygh",
  907 + "widget": "userSelector",
  908 + "required": false,
  909 + "readOnly": false,
  910 + "hidden": false,
  911 + "relId": "user"
  912 + },
  913 + "fieldType": "USER_MULTI",
  914 + "fieldGroupType": "USER"
  915 + },
  916 + {
  917 + "key": "orgSelector_zqgyfg",
  918 + "code": "orgSelector_zqgyfg",
  919 + "filedName": "orgSelector_zqgyfg",
  920 + "name": "选部门-多",
  921 + "extract": {
  922 + "fieldType": "ORG_MULTI",
  923 + "fieldKey": "orgSelector_zqgyfg",
  924 + "widget": "orgSelector",
  925 + "required": false,
  926 + "readOnly": false,
  927 + "hidden": false,
  928 + "relId": "org"
  929 + },
  930 + "fieldType": "ORG_MULTI",
  931 + "fieldGroupType": "ORG"
  932 + },
  933 + {
  934 + "key": "created_by",
  935 + "code": "created_by",
  936 + "filedName": "created_by",
  937 + "name": "创建人",
  938 + "extract": {
  939 + "fieldType": "USER",
  940 + "fieldKey": "created_by",
  941 + "widget": "userSelector",
  942 + "required": false,
  943 + "readOnly": false,
  944 + "hidden": false,
  945 + "relId": "user",
  946 + "$base": true
  947 + },
  948 + "fieldType": "USER",
  949 + "fieldGroupType": "USER"
  950 + },
  951 + {
  952 + "key": "created_at2222",
  953 + "code": "created_at2222",
  954 + "filedName": "created_at2222",
  955 + "name": "创建时间",
  956 + "extract": {
  957 + "fieldType": "STRING",
  958 + "fieldKey": "created_at2222",
  959 + "widget": "createdAt",
  960 + "required": false,
  961 + "readOnly": false,
  962 + "hidden": false
  963 + },
  964 + "fieldType": "STRING",
  965 + "fieldGroupType": "TEXT"
  966 + },
  967 + {
  968 + "key": "updated_by",
  969 + "code": "updated_by",
  970 + "filedName": "updated_by",
  971 + "name": "更新人",
  972 + "extract": {
  973 + "fieldType": "USER",
  974 + "fieldKey": "updated_by",
  975 + "widget": "userSelector",
  976 + "required": false,
  977 + "readOnly": false,
  978 + "hidden": false,
  979 + "relId": "user",
  980 + "$base": true
  981 + },
  982 + "fieldType": "USER",
  983 + "fieldGroupType": "USER"
  984 + },
  985 + {
  986 + "key": "updated_at",
  987 + "code": "updated_at",
  988 + "filedName": "updated_at",
  989 + "name": "更新时间",
  990 + "extract": {
  991 + "fieldType": "YEAR_SEC",
  992 + "fieldKey": "updated_at",
  993 + "widget": "qxDatetime",
  994 + "required": false,
  995 + "readOnly": false,
  996 + "hidden": false,
  997 + "$base": true
  998 + },
  999 + "fieldType": "YEAR_SEC",
  1000 + "fieldGroupType": "DATE"
  1001 + },
  1002 + {
  1003 + "key": "fx_jdfqnd",
  1004 + "code": "fx_jdfqnd",
  1005 + "filedName": "fx_jdfqnd",
  1006 + "name": "公式",
  1007 + "extract": {
  1008 + "fieldType": "FORMULA",
  1009 + "fieldKey": "fx_jdfqnd",
  1010 + "widget": "qxFormula",
  1011 + "required": false,
  1012 + "readOnly": false,
  1013 + "hidden": false
  1014 + },
  1015 + "fieldType": "FORMULA",
  1016 + "fieldGroupType": "NUM"
  1017 + },
  1018 + {
  1019 + "key": "no_ilgtbb",
  1020 + "code": "no_ilgtbb",
  1021 + "filedName": "no_ilgtbb",
  1022 + "name": "流水号",
  1023 + "extract": {
  1024 + "fieldType": "STRING",
  1025 + "fieldKey": "no_ilgtbb",
  1026 + "widget": "qxBizNo",
  1027 + "required": false,
  1028 + "readOnly": true,
  1029 + "hidden": false
  1030 + },
  1031 + "fieldType": "STRING",
  1032 + "fieldGroupType": "TEXT"
  1033 + },
  1034 + {
  1035 + "key": "p_id",
  1036 + "code": "p_id",
  1037 + "filedName": "p_id",
  1038 + "name": "树形关联",
  1039 + "extract": {
  1040 + "fieldType": "TREE",
  1041 + "fieldKey": "p_id",
  1042 + "widget": "qxTree",
  1043 + "required": true,
  1044 + "readOnly": false,
  1045 + "hidden": false,
  1046 + "relId": "EsDhRXIo0OVRQol54PR"
  1047 + },
  1048 + "fieldType": "TREE",
  1049 + "fieldGroupType": "TREE"
  1050 + },
  1051 + {
  1052 + "key": "sub_zyycui",
  1053 + "code": "sub_zyycui",
  1054 + "filedName": "sub_zyycui",
  1055 + "name": "子表",
  1056 + "extract": {
  1057 + "fieldType": "TABLE",
  1058 + "fieldKey": "sub_zyycui",
  1059 + "widget": "subform",
  1060 + "required": false,
  1061 + "readOnly": false,
  1062 + "hidden": false,
  1063 + "relId": "oJHol3pBmfwKd6SULhX"
  1064 + },
  1065 + "fieldType": "TABLE",
  1066 + "fieldGroupType": "TABLE"
  1067 + },
  1068 + {
  1069 + "key": "rel_xaxqec",
  1070 + "code": "rel_xaxqec",
  1071 + "filedName": "rel_xaxqec",
  1072 + "name": "关联记录-简单统计2",
  1073 + "extract": {
  1074 + "fieldType": "REL_MULTI",
  1075 + "fieldKey": "rel_xaxqec",
  1076 + "widget": "relSelector",
  1077 + "required": false,
  1078 + "readOnly": false,
  1079 + "hidden": false,
  1080 + "relId": "olfkD8dExv49R0FAiIW",
  1081 + "allowSelect": true,
  1082 + "allowAdd": true,
  1083 + "enableEdit": false,
  1084 + "relAppCode": "cjzza",
  1085 + "relFunCode": "hkzf8"
  1086 + },
  1087 + "fieldType": "REL_MULTI",
  1088 + "fieldGroupType": "REL_MULTI"
  1089 + },
  1090 + {
  1091 + "key": "rel_ulqhzt",
  1092 + "code": "rel_ulqhzt",
  1093 + "filedName": "rel_ulqhzt",
  1094 + "name": "关联1-1",
  1095 + "extract": {
  1096 + "fieldType": "REL_MULTI",
  1097 + "fieldKey": "rel_ulqhzt",
  1098 + "widget": "relSelector",
  1099 + "required": false,
  1100 + "readOnly": false,
  1101 + "hidden": false,
  1102 + "relId": "pJMTmcXEH9Dq9mnq6wV",
  1103 + "allowSelect": true,
  1104 + "allowAdd": true,
  1105 + "enableEdit": false,
  1106 + "relAppCode": "cjzza",
  1107 + "relFunCode": "8xcmq"
  1108 + },
  1109 + "fieldType": "REL_MULTI",
  1110 + "fieldGroupType": "REL_MULTI"
  1111 + },
  1112 + {
  1113 + "key": "rel_nofdmy",
  1114 + "code": "rel_nofdmy",
  1115 + "filedName": "rel_nofdmy",
  1116 + "name": "关联1",
  1117 + "extract": {
  1118 + "fieldType": "REL_MULTI",
  1119 + "fieldKey": "rel_nofdmy",
  1120 + "widget": "relSelector",
  1121 + "required": false,
  1122 + "readOnly": false,
  1123 + "hidden": false,
  1124 + "relId": "duvtdNb0dbuBaDceWav",
  1125 + "allowSelect": true,
  1126 + "allowAdd": true,
  1127 + "enableEdit": false,
  1128 + "relAppCode": "cjzza",
  1129 + "relFunCode": "hi76x"
  1130 + },
  1131 + "fieldType": "REL_MULTI",
  1132 + "fieldGroupType": "REL_MULTI"
  1133 + }
  1134 +];
... ...
... ... @@ -13,7 +13,7 @@ interface QxFieldPopoverProp {
13 13 data: OptionField[];
14 14 widgets?: string[]; //需要展示的widgets
15 15 exclude?: string[]; //排除的字段
16   - width?: string; //pop 宽度
  16 + width?: string | number;//pop 宽度
17 17 trigger?: 'click' | 'hover' | undefined;
18 18 onSelect?: (field: OptionField) => void;
19 19 disabled?: boolean;
... ... @@ -21,7 +21,7 @@ interface QxFieldPopoverProp {
21 21 popFooter?: ReactElement;
22 22 }
23 23
24   -type FieldsCheckboxGroupProps = {
  24 +interface FieldsCheckboxGroupProps {
25 25 fields: OptionField[];
26 26 values?: string[];
27 27 onChange: (
... ... @@ -30,27 +30,36 @@ type FieldsCheckboxGroupProps = {
30 30 selectedKey: string,
31 31 isChecked: boolean,
32 32 ) => void;
33   -};
  33 + width?: string | number; //pop 宽度
  34 +}
34 35
35 36 const FieldsCheckboxGroup: FC<FieldsCheckboxGroupProps> = (props) => {
36 37 const { fields, values, onChange } = props;
37 38 const [keyword, setKey] = useState('');
38 39
39 40 return (
40   - <>
41   - <Input
42   - className={'qx-selector-sub-search'}
43   - placeholder={'请输入字段名'}
44   - allowClear
45   - prefix={<QxBaseIcon type={'icon-app-search-line'} />}
46   - onChange={(e) => {
47   - setKey(e.target.value.trim());
  41 + <div style={{ width: props.width || '240px' }}>
  42 + <div
  43 + onMouseDown={(e) => {
  44 + e.preventDefault();
48 45 }}
49   - />
  46 + >
  47 + <Input
  48 + bordered={false}
  49 + value={keyword}
  50 + className={'qx-fields-popover__search'}
  51 + placeholder={'搜索'}
  52 + allowClear
  53 + prefix={<QxBaseIcon type={'icon-app-search-line'} />}
  54 + onChange={(e) => {
  55 + setKey(e.target.value.trim());
  56 + }}
  57 + />
  58 + </div>
50 59 <Divider style={{ margin: 0 }} />
51 60 <ul
52 61 className={'qx-setting-fields'}
53   - style={{ padding: '10px', maxHeight: '200px', overflow: 'auto' }}
  62 + style={{ maxHeight: '200px', overflow: 'auto' }}
54 63 >
55 64 {fields.map((item) => {
56 65 return (
... ... @@ -59,6 +68,7 @@ const FieldsCheckboxGroup: FC<FieldsCheckboxGroupProps> = (props) => {
59 68 key={item.code}
60 69 >
61 70 <Checkbox
  71 + className={'qx-setting-fields__checkbox'}
62 72 checked={(values || []).indexOf(item.code) > -1}
63 73 onChange={(e) => {
64 74 const index = (values || []).indexOf(item.code);
... ... @@ -72,13 +82,15 @@ const FieldsCheckboxGroup: FC<FieldsCheckboxGroupProps> = (props) => {
72 82 }}
73 83 disabled={item.disabled}
74 84 >
75   - <QxFieldItem widget={item?.extract?.widget || ''} name={item.name} />
  85 + <div className={'qx-setting-fields__checkbox-text'}>
  86 + <QxFieldItem widget={item?.extract?.widget || ''} name={item.name} />
  87 + </div>
76 88 </Checkbox>
77 89 </li>
78 90 );
79 91 })}
80 92 </ul>
81   - </>
  93 + </div>
82 94 );
83 95 };
84 96
... ... @@ -132,7 +144,7 @@ const QxCheckboxFieldPopover: React.FC<QxCheckboxFieldPopoverProp> = (props) =>
132 144 <FieldsCheckboxGroup fields={fields} onChange={props.onChange} values={props.values} />
133 145 }
134 146 placement={'bottomRight'}
135   - trigger={props.disabled ? undefined : props.trigger || 'hover'}
  147 + trigger={props.disabled ? undefined : props.trigger || 'click'}
136 148 open={visible}
137 149 onOpenChange={(v) => {
138 150 setVisible(v);
... ...
... ... @@ -114,7 +114,7 @@ const QxFieldPopover: React.FC<QxFieldPopoverProp> = (props) => {
114 114 setKeyword(_keyword.trim());
115 115 };
116 116 return (
117   - <div style={{ width: props.width || '192px' }}>
  117 + <div style={{ width: props.width || '240px' }}>
118 118 {fields.length === 0 ? (
119 119 <div
120 120 className={'ant-empty-normal'}
... ... @@ -265,7 +265,7 @@ const QxFieldPopover: React.FC<QxFieldPopoverProp> = (props) => {
265 265 // getPopupContainer={(triggerNode) => triggerNode}
266 266 content={fieldsPopContent()}
267 267 placement={'bottomRight'}
268   - trigger={props.disabled ? undefined : props.trigger || 'hover'}
  268 + trigger={props.disabled ? undefined : props.trigger || 'click'}
269 269 open={visible}
270 270 onOpenChange={(v) => {
271 271 if (!v) {
... ...
... ... @@ -91,3 +91,59 @@
91 91 padding-left: 24px;
92 92 border-top: 1px solid @N4;
93 93 }
  94 +
  95 +
  96 +ul.qx-setting-fields {
  97 + list-style: none;
  98 + padding: 0 12px;
  99 + margin: 0;
  100 +
  101 + > li {
  102 + list-style: none;
  103 + padding: 0;
  104 + margin: 0;
  105 + width: 100%;
  106 + height: 36px;
  107 + display: inline-flex;
  108 + align-items: center;
  109 + justify-content: flex-start;
  110 + overflow: hidden;
  111 + text-overflow: ellipsis;
  112 + }
  113 +
  114 + .qx-setting-fields__checkbox {
  115 + width: 100%;
  116 + max-width: 100%;
  117 +
  118 + .ant-checkbox {
  119 + flex-shrink: 0;
  120 + }
  121 +
  122 + .ant-checkbox + span {
  123 + flex-shrink: 1;
  124 + width: calc(100% - 16px);
  125 + }
  126 +
  127 + &-text {
  128 + width: 100%;
  129 + height: 36px;
  130 + display: inline-flex;
  131 + align-items: center;
  132 + justify-content: flex-start;
  133 +
  134 + .ant-typography {
  135 + .anticon {
  136 + font-size: 16px;
  137 + }
  138 +
  139 + & + span {
  140 + max-width: calc(100% - 24px);
  141 + white-space: nowrap;
  142 + overflow: hidden;
  143 + text-overflow: ellipsis;
  144 + }
  145 + }
  146 +
  147 + }
  148 + }
  149 +}
... ...