@ohu-mobile/core/lib/ActionBar/ActionBar.stories.js

Mobile UI Toolkit

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.Toolbar = exports.Text = exports.MultiButtons = exports.Basic = void 0;
var _vue = _interopRequireDefault(require("vue"));
var _index = _interopRequireDefault(require("./index"));
require("./style");
var _Dialog = _interopRequireDefault(require("../Dialog"));
require("../Dialog/style");
var _Button = _interopRequireDefault(require("../Button"));
require("../Button/style");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = exports.default = {
  title: 'Components/DataDisplay/ActionBar',
  parameters: {
    component: _index.default,
    options: {
      showPanel: true
    }
  }
};
var Basic = exports.Basic = function Basic() {
  return _vue.default.extend({
    data: function data() {
      return {
        visible: false
      };
    },
    render: function render() {
      var _this = this;
      var h = arguments[0];
      return h("div", {
        "style": "height: 200vh; background: #efefef;"
      }, [h(_Button.default, {
        "on": {
          "click": function click() {
            return _this.visible = !_this.visible;
          }
        }
      }, ["click to show"]), h(_index.default, {
        "attrs": {
          "visible": this.visible,
          "divider": false,
          "actions": [{
            type: 'primary',
            text: '确定'
          }]
        }
      })]);
    }
  });
};
var MultiButtons = exports.MultiButtons = function MultiButtons() {
  return _vue.default.extend({
    render: function render() {
      var h = arguments[0];
      return h("div", {
        "style": "height: 200vh; background: #FFF;"
      }, ["\u5F80\u4E0B\u770B", h(_index.default, {
        "on": {
          "click": function click(option) {
            console.log(option);
          }
        },
        "attrs": {
          "actions": [{
            plain: true,
            text: '删除'
          }, {
            type: 'primary',
            text: '移动'
          }]
        }
      })]);
    }
  });
};
var Text = exports.Text = function Text() {
  return _vue.default.extend({
    render: function render() {
      var h = arguments[0];
      return h("div", {
        "style": "height: 200vh; background: #FFF;"
      }, ["\u5F80\u4E0B\u770B", h(_index.default, {
        "attrs": {
          "actions": [{
            type: 'primary',
            text: '付费升级'
          }]
        }
      }, [h("span", {
        "style": "font-size: 14px;"
      }, ["\uFFE5", h("span", {
        "style": "font-size: 30px;"
      }, ["99"]), "\u5143"])])]);
    }
  });
};
var Toolbar = exports.Toolbar = function Toolbar() {
  return _vue.default.extend({
    render: function render() {
      var h = arguments[0];
      return h("div", {
        "style": "height: 200vh; background: #FFF;"
      }, ["\u5F80\u4E0B\u770B", h(_index.default, {
        "attrs": {
          "toolbar": true,
          "actions": [{
            text: '删除',
            link: true
          }, {
            type: 'primary',
            text: '移动',
            link: true
          }]
        },
        "on": {
          "click": function click(option) {
            _Dialog.default.alert({
              title: JSON.stringify(option)
            });
          }
        }
      })]);
    }
  });
};