@ohu-mobile/core/lib-rem/TreeSelect/TreeSelect.stories.js

Mobile UI Toolkit

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.Basic = void 0;
var _vue = _interopRequireDefault(require("vue"));
var _Card = _interopRequireDefault(require("../Card"));
require("../Card/style");
var _Toast = _interopRequireDefault(require("../Toast"));
require("../Toast/style");
var _index = _interopRequireDefault(require("./index"));
require("./style");
var _Skeleton = _interopRequireDefault(require("../Skeleton"));
require("../Skeleton/style");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = exports.default = {
  title: 'Components/Form/TreeSelect',
  parameters: {
    component: _index.default,
    options: {
      showPanel: true
    }
  }
};
var Basic = exports.Basic = function Basic() {
  return _vue.default.extend({
    data: function data() {
      return {
        value: '材料类',
        treeData: [{
          key: '法学',
          title: '法学',
          value: '法学',
          hasChildren: true
        }, {
          title: '工学',
          value: '工学',
          key: '工学',
          children: [{
            key: '兵器类',
            title: '兵器类',
            value: '兵器类',
            isLeaf: true
          }, {
            key: '材料类',
            title: '材料类',
            value: '材料类',
            isLeaf: true
          }, {
            key: '测绘类',
            title: '测绘类',
            value: '测绘类',
            isLeaf: true
          }]
        }, {
          key: '管理学',
          title: '管理学',
          value: '管理学',
          hasChildren: true
        }, {
          key: '理学',
          title: '理学',
          value: '理学',
          hasChildren: true
        }]
      };
    },
    methods: {
      loadData: function loadData(node) {
        return new Promise(function (resolve, reject) {
          if (node.key === '法学') {
            return resolve([{
              key: '法学类',
              title: '法学类',
              value: '法学类',
              hasChildren: true
            }, {
              key: '公安学类',
              title: '公安学类',
              value: '公安学类'
            }, {
              key: '马克思主义理论类',
              title: '马克思主义理论类',
              value: '马克思主义理论类'
            }, {
              key: '社会学类',
              title: '社会学类',
              value: '社会学类'
            }, {
              key: '民族学类',
              title: '民族学类',
              value: '民族学类',
              isLeaf: true
            }, {
              key: '政治学类',
              title: '政治学类',
              value: '政治学类'
            }]);
          }
          if (node.key === '法学2' || node.key === '政治') {
            return setTimeout(function () {
              resolve([{
                key: '刑法',
                title: '刑法',
                value: '刑法',
                isLeaf: true
              }]);
            }, 2000);
          }
          if (node.key === '管理学') {
            return setTimeout(function () {
              resolve([{
                key: '政治',
                title: '政治',
                value: '政治',
                hasChildren: true
              }]);
            }, 1400);
          }
          var random = Math.random() * 10;
          if (random > 8) {
            return reject('失败了，请重新点击');
          }
          setTimeout(function () {
            resolve([{
              key: '法学2',
              title: '法学2',
              value: '法学2',
              hasChildren: true
            }, {
              key: '监狱学',
              title: '监狱学',
              value: '监狱学',
              isLeaf: true
            }]);
          }, 1200);
        });
      }
    },
    render: function render() {
      var h = arguments[0];
      return h("div", {
        "class": "demo"
      }, [h(_Card.default, {
        "attrs": {
          "shadow": true,
          "padding": false
        }
      }, [h(_Card.default.Header, ["Basic (", this.value, ")"]), h(_index.default, {
        "style": "height: 500px",
        "attrs": {
          "value": "刑法",
          "keyPath": ['管理学', '政治', '刑法'],
          "loadData": this.loadData,
          "treeData": this.treeData
        },
        "on": {
          "loadError": function loadError(error) {
            _Toast.default.fail(error.toString());
          }
        }
      }, [h(_Skeleton.default, {
        "slot": "loading",
        "style": {
          padding: '10px'
        },
        "attrs": {
          "row": true,
          "rows": 3,
          "rowWidth": ['100%', '100%', '100%']
        }
      })])]), h(_Card.default, {
        "attrs": {
          "shadow": true,
          "padding": false
        }
      }, [h(_Card.default.Header, ["Multiple"]), h(_index.default, {
        "attrs": {
          "value": ['监狱学', '兵器类'],
          "keyPath": ['法学', '法学类', '监狱学'],
          "loadData": this.loadData,
          "multiple": true,
          "max": 2,
          "treeData": this.treeData
        },
        "on": {
          "change": function change(values, params) {
            console.log(values, params);
          }
        },
        "style": "height: 500px"
      })]), h(_Card.default, {
        "attrs": {
          "shadow": true,
          "padding": false
        }
      }, [h(_Card.default.Header, ["Icon"]), h(_index.default, {
        "style": "height: 200px",
        "attrs": {
          "keyPath": ['法学', '法学类', '法学2', '刑法'],
          "value": "民族学类",
          "unCheckedIcon": null,
          "loadData": this.loadData,
          "treeData": this.treeData
        }
      })])]);
    }
  });
};