@ohu-mobile/core
Version:
168 lines (167 loc) • 4.25 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.SelfDefined = exports.NoAnimate = exports.Loading = exports.Duration = exports.BlinkAnimate = exports.Basic = void 0;
var _vue = _interopRequireDefault(require("vue"));
var _index = _interopRequireDefault(require("./index"));
require("./style");
var _Card = _interopRequireDefault(require("../Card"));
require("../Card/style");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var _default = exports.default = {
title: 'Components/DataDisplay/Skeleton',
parameters: {
component: _index.default,
options: {
showPanel: true
}
}
};
var Basic = exports.Basic = function Basic() {
return {
render: function render() {
var h = arguments[0];
return h(_Card.default, [h(_index.default, {
"attrs": {
"rows": 3
}
})]);
}
};
};
var BlinkAnimate = exports.BlinkAnimate = function BlinkAnimate() {
return {
render: function render() {
var h = arguments[0];
return h(_Card.default, [h(_index.default, {
"attrs": {
"avatar": true,
"title": true,
"rows": 6,
"rowWidth": ['100%', '50%'],
"animate": "blink"
}
})]);
}
};
};
var NoAnimate = exports.NoAnimate = function NoAnimate() {
return {
render: function render() {
var h = arguments[0];
return h(_Card.default, [h(_index.default, {
"attrs": {
"avatar": true,
"avatarSize": "100px",
"title": true,
"titleWidth": "90%",
"rows": 3,
"animateDisable": true
}
})]);
}
};
};
var Loading = exports.Loading = function Loading() {
return _vue.default.extend({
data: function data() {
return {
loading: true,
id: -1
};
},
mounted: function mounted() {
var _this = this;
this.id = setInterval(function () {
_this.loading = !_this.loading;
}, 2000);
},
beforeDestroy: function beforeDestroy() {
if (this.id >= 0) {
clearInterval(this.id);
}
},
render: function render() {
var h = arguments[0];
return h(_Card.default, [h(_Card.default.Header, [this.loading ? 'show content in 2s' : 'loading in 2s']), h(_index.default, {
"attrs": {
"avatar": true,
"title": true,
"rows": 3,
"loading": this.loading
}
}, ["This is Ohu-Mobile UI Kit"])]);
}
});
};
var SelfDefined = exports.SelfDefined = function SelfDefined() {
return _vue.default.extend({
render: function render() {
var h = arguments[0];
return h(_Card.default, [h(_Card.default, [h(_index.default, {
"attrs": {
"title": true,
"rows": 3
}
}, [h(_index.default, {
"style": "width: 120px; height: 72px;",
"slot": "left"
}), h("div", {
"slot": "content"
}, [h(_index.default, {
"attrs": {
"row": true
}
}), h(_index.default, {
"attrs": {
"row": true
}
}), h(_index.default, {
"attrs": {
"row": true,
"rowWidth": "30%"
}
})])])]), h(_Card.default, [h(_index.default, {
"attrs": {
"title": true,
"rows": 3
}
}, [h(_index.default, {
"attrs": {
"shape": "circle"
},
"style": "width: 72px; height: 72px;",
"slot": "left"
}), h("div", {
"slot": "content"
}, [h(_index.default, {
"attrs": {
"row": true
}
}), h(_index.default, {
"attrs": {
"row": true
}
}), h(_index.default, {
"attrs": {
"row": true,
"rowWidth": "30%"
}
})])])])]);
}
});
};
var Duration = exports.Duration = function Duration() {
return _vue.default.extend({
render: function render() {
var h = arguments[0];
return h(_Card.default, [h(_index.default, {
"attrs": {
"rows": 3,
"duration": 3000
}
})]);
}
});
};