NOTICE: By continued use of this site you understand and agree to the binding Terms of Service and Privacy Policy.
// ==UserScript==
// @name 自动填入预约信息
// @namespace http://tampermonkey.net/
// @version 0.0.2
// @description 实现自动填入工商银行纪念币预约信息
// @author inlinger
// @include https://jnb.icbc.com.cn/*
// @include https://www.icbc.com.cn/*
// @icon https://www.google.com/s2/favicons?domain=icbc.com.cn
// @require https://cdn.jsdelivr.net/npm/vue@2.6.14
// @grant GM_setValue
// @grant GM_getValue
// @license MIT
// ==/UserScript==
(function () {
'use strict';
var storage = {
setItem(key, value) {
(window.GM_setValue ?? localStorage.setItem)(key, JSON.stringify(value));
},
getItem(key, defaultValue) {
const value = (window.GM_getValue ?? localStorage.getItem)(key);
return value ? JSON.parse(value) : defaultValue
}
};
//
var script$2 = {
name: 'update',
props: {
item: Object,
},
data: () => ({
form: {
name: '',
idCard: '',
phone: '',
},
msg: '',
}),
created() {
this.form = this.item;
},
methods: {
save() {
const data = storage.getItem('data', []);
const index = data.findIndex(item => item.idCard === this.form.idCard);
if (~index) {
data[index] = this.form;
} else {
data.push(this.form);
}
storage.setItem('data', data);
this.form = this.$options.data().form;
this.message('保存成功');
},
message(msg) {
this.msg = msg;
setTimeout(() => this.msg = '', 1000);
},
},
};
function normalizeComponent(template, style, script, scopeId, isFunctionalTemplate, moduleIdentifier /* server only */, shadowMode, createInjector, createInjectorSSR, createInjectorShadow) {
if (typeof shadowMode !== 'boolean') {
createInjectorSSR = createInjector;
createInjector = shadowMode;
shadowMode = false;
}
// Vue.extend constructor export interop.
const options = typeof script === 'function' ? script.options : script;
// render functions
if (template && template.render) {
options.render = template.render;
options.staticRenderFns = template.staticRenderFns;
options._compiled = true;
// functional template
if (isFunctionalTemplate) {
options.functional = true;
}
}
// scopedId
if (scopeId) {
options._scopeId = scopeId;
}
let hook;
if (moduleIdentifier) {
// server build
hook = function (context) {
// 2.3 injection
context =
context || // cached call
(this.$vnode && this.$vnode.ssrContext) || // stateful
(this.parent && this.parent.$vnode && this.parent.$vnode.ssrContext); // functional
// 2.2 with runInNewContext: true
if (!context && typeof __VUE_SSR_CONTEXT__ !== 'undefined') {
context = __VUE_SSR_CONTEXT__;
}
// inject component styles
if (style) {
style.call(this, createInjectorSSR(context));
}
// register component module identifier for async chunk inference
if (context && context._registeredComponents) {
context._registeredComponents.add(moduleIdentifier);
}
};
// used by ssr in case component is cached and beforeCreate
// never gets called
options._ssrRegister = hook;
}
else if (style) {
hook = shadowMode
? function (context) {
style.call(this, createInjectorShadow(context, this.$root.$options.shadowRoot));
}
: function (context) {
style.call(this, createInjector(context));
};
}
if (hook) {
if (options.functional) {
// register for functional component in vue file
const originalRender = options.render;
options.render = function renderWithStyleInjection(h, context) {
hook.call(context);
return originalRender(h, context);
};
}
else {
// inject component registration as beforeCreate hook
const existing = options.beforeCreate;
options.beforeCreate = existing ? [].concat(existing, hook) : [hook];
}
}
return script;
}
const isOldIE = typeof navigator !== 'undefined' &&
/msie [6-9]\\b/.test(navigator.userAgent.toLowerCase());
function createInjector(context) {
return (id, style) => addStyle(id, style);
}
let HEAD;
const styles = {};
function addStyle(id, css) {
const group = isOldIE ? css.media || 'default' : id;
const style = styles[group] || (styles[group] = { ids: new Set(), styles: [] });
if (!style.ids.has(id)) {
style.ids.add(id);
let code = css.source;
if (css.map) {
// https://developer.chrome.com/devtools/docs/javascript-debugging
// this makes source maps inside style tags work properly in Chrome
code += '\n/*# sourceURL=' + css.map.sources[0] + ' */';
// http://stackoverflow.com/a/26603875
code +=
'\n/*# sourceMappingURL=data:application/json;base64,' +
btoa(unescape(encodeURIComponent(JSON.stringify(css.map)))) +
' */';
}
if (!style.element) {
style.element = document.createElement('style');
style.element.type = 'text/css';
if (css.media)
style.element.setAttribute('media', css.media);
if (HEAD === undefined) {
HEAD = document.head || document.getElementsByTagName('head')[0];
}
HEAD.appendChild(style.element);
}
if ('styleSheet' in style.element) {
style.styles.push(code);
style.element.styleSheet.cssText = style.styles
.filter(Boolean)
.join('\n');
}
else {
const index = style.ids.size - 1;
const textNode = document.createTextNode(code);
const nodes = style.element.childNodes;
if (nodes[index])
style.element.removeChild(nodes[index]);
if (nodes.length)
style.element.insertBefore(textNode, nodes[index]);
else
style.element.appendChild(textNode);
}
}
}
/* script */
const __vue_script__$2 = script$2;
/* template */
var __vue_render__$2 = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c(
"form",
{
staticClass: "a-form",
on: {
submit: function ($event) {
$event.preventDefault();
return _vm.save.apply(null, arguments)
},
},
},
[
_c("label", { attrs: { for: "name" } }, [_vm._v("客户姓名")]),
_vm._v(" "),
_c("input", {
directives: [
{
name: "model",
rawName: "v-model.trim",
value: _vm.form.name,
expression: "form.name",
modifiers: { trim: true },
},
],
staticClass: "a-form__field",
attrs: { id: "name", type: "text", required: "" },
domProps: { value: _vm.form.name },
on: {
input: function ($event) {
if ($event.target.composing) {
return
}
_vm.$set(_vm.form, "name", $event.target.value.trim());
},
blur: function ($event) {
return _vm.$forceUpdate()
},
},
}),
_vm._v(" "),
_c("label", { attrs: { for: "idCard" } }, [_vm._v("证件号码")]),
_vm._v(" "),
_c("input", {
directives: [
{
name: "model",
rawName: "v-model.trim",
value: _vm.form.idCard,
expression: "form.idCard",
modifiers: { trim: true },
},
],
staticClass: "a-form__field",
attrs: {
id: "idCard",
type: "text",
required: "",
maxlength: "18",
minlength: "18",
},
domProps: { value: _vm.form.idCard },
on: {
input: function ($event) {
if ($event.target.composing) {
return
}
_vm.$set(_vm.form, "idCard", $event.target.value.trim());
},
blur: function ($event) {
return _vm.$forceUpdate()
},
},
}),
_vm._v(" "),
_c("label", { attrs: { for: "phone" } }, [_vm._v("手机号码")]),
_vm._v(" "),
_c("input", {
directives: [
{
name: "model",
rawName: "v-model.trim",
value: _vm.form.phone,
expression: "form.phone",
modifiers: { trim: true },
},
],
staticClass: "a-form__field",
attrs: { id: "phone", type: "text", required: "", maxlength: "11" },
domProps: { value: _vm.form.phone },
on: {
input: function ($event) {
if ($event.target.composing) {
return
}
_vm.$set(_vm.form, "phone", $event.target.value.trim());
},
blur: function ($event) {
return _vm.$forceUpdate()
},
},
}),
_vm._v(" "),
_c("button", { staticClass: "a-btn" }, [_vm._v("保存")]),
_vm._v(" "),
_c("div", { staticClass: "msg" }, [_vm._v(_vm._s(_vm.msg))]),
]
)
};
var __vue_staticRenderFns__$2 = [];
__vue_render__$2._withStripped = true;
/* style */
const __vue_inject_styles__$2 = function (inject) {
if (!inject) return
inject("data-v-626f3c4f_0", { source: ".a-form[data-v-626f3c4f] {\n display: grid;\n margin-top: 10px;\n gap: 5px;\n}\n.a-form__field[data-v-626f3c4f] {\n padding: 5px 10px;\n border: 1px solid black;\n border-radius: 5px;\n}\n.msg[data-v-626f3c4f] {\n text-align: center;\n}\n\n/*# sourceMappingURL=update.vue.map */", map: {"version":3,"sources":["D:\\Project\\appointment-vue\\src\\component\\update.vue","update.vue"],"names":[],"mappings":"AA4DA;EACA,aAAA;EACA,gBAAA;EACA,QAAA;AC3DA;AD6DA;EACA,iBAAA;EACA,uBAAA;EACA,kBAAA;AC3DA;AD+DA;EACA,kBAAA;AC5DA;;AAEA,qCAAqC","file":"update.vue","sourcesContent":["<template>\r\n <form class=\"a-form\" @submit.prevent=\"save\">\r\n <label for=\"name\">客户姓名</label>\r\n <input v-model.trim=\"form.name\" id=\"name\" class=\"a-form__field\" type=\"text\" required/>\r\n <label for=\"idCard\">证件号码</label>\r\n <input v-model.trim=\"form.idCard\" id=\"idCard\" class=\"a-form__field\" type=\"text\" required maxlength=\"18\" minlength=\"18\"/>\r\n <label for=\"phone\">手机号码</label>\r\n <input v-model.trim=\"form.phone\" id=\"phone\" class=\"a-form__field\" type=\"text\" required maxlength=\"11\"/>\r\n <button class=\"a-btn\">保存</button>\r\n <div class=\"msg\">{{ msg }}</div>\r\n </form>\r\n</template>\r\n\r\n<script>\r\nimport storage from '../storage'\r\n\r\nexport default {\r\n name: 'update',\r\n\r\n props: {\r\n item: Object,\r\n },\r\n\r\n data: () => ({\r\n form: {\r\n name: '',\r\n idCard: '',\r\n phone: '',\r\n },\r\n msg: '',\r\n }),\r\n\r\n created() {\r\n this.form = this.item\r\n },\r\n\r\n methods: {\r\n save() {\r\n const data = storage.getItem('data', [])\r\n const index = data.findIndex(item => item.idCard === this.form.idCard)\r\n if (~index) {\r\n data[index] = this.form\r\n } else {\r\n data.push(this.form)\r\n }\r\n\r\n storage.setItem('data', data)\r\n\r\n this.form = this.$options.data().form\r\n this.message('保存成功')\r\n },\r\n message(msg) {\r\n this.msg = msg\r\n setTimeout(() => this.msg = '', 1000)\r\n },\r\n },\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.a-form {\r\n display: grid;\r\n margin-top: 10px;\r\n gap: 5px;\r\n\r\n &__field {\r\n padding: 5px 10px;\r\n border: 1px solid black;\r\n border-radius: 5px;\r\n }\r\n}\r\n\r\n.msg {\r\n text-align: center;\r\n}\r\n</style>\r\n",".a-form {\n display: grid;\n margin-top: 10px;\n gap: 5px;\n}\n.a-form__field {\n padding: 5px 10px;\n border: 1px solid black;\n border-radius: 5px;\n}\n\n.msg {\n text-align: center;\n}\n\n/*# sourceMappingURL=update.vue.map */"]}, media: undefined });
};
/* scoped */
const __vue_scope_id__$2 = "data-v-626f3c4f";
/* module identifier */
const __vue_module_identifier__$2 = undefined;
/* functional template */
const __vue_is_functional_template__$2 = false;
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__$2 = /*#__PURE__*/normalizeComponent(
{ render: __vue_render__$2, staticRenderFns: __vue_staticRenderFns__$2 },
__vue_inject_styles__$2,
__vue_script__$2,
__vue_scope_id__$2,
__vue_is_functional_template__$2,
__vue_module_identifier__$2,
false,
createInjector,
undefined,
undefined
);
//
const forKey = {
'name': 'custName',
'idCard': 'paperNum',
'phone': 'mobileno',
};
var script$1 = {
name: 'list',
data: () => ({
fields: [
'name',
'idCard',
'phone',
],
data: [],
checkedList: [],
}),
computed: {
checkAll() {
return this.checkedList.length === this.data.length
},
},
created() {
this.data = storage.getItem('data', []);
},
methods: {
insert(item) {
Object.entries(item).forEach(([k, v]) => {
this.setValue(forKey[k], v);
});
},
setValue(key, value) {
const label = document.querySelector(`label[for=${key}]`);
if (label) {
const item = label.nextElementSibling.querySelector('.el-input').__vue__;
item.$emit('input', value);
}
},
remove(item, tips = true) {
if (!tips || window.confirm(`确定删除 ${item.name} ?`)) {
const index = this.data.indexOf(item);
const checkIndex = this.checkedList.indexOf(item);
if (~index) this.data.splice(index, 1);
if (~checkIndex) this.checkedList.splice(checkIndex, 1);
storage.setItem('data', this.data);
}
},
removeChecked() {
if (this.checkedList.length > 0 && window.confirm(`确定删除这 ${this.checkedList.length} 条数据吗?`))
[...this.checkedList].forEach((item) => this.remove(item, false));
},
switchCheckAll() {
if (this.checkAll) {
this.checkedList = [];
} else {
this.checkedList = [...this.data];
}
},
switchCheck(item) {
const index = this.checkedList.indexOf(item);
~index
? this.checkedList.splice(index, 1)
: this.checkedList.push(item);
console.log(this.checkedList);
},
update(item) {
this.$emit('update', item);
},
},
};
/* script */
const __vue_script__$1 = script$1;
/* template */
var __vue_render__$1 = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("div", { staticClass: "a-list" }, [
_c("table", { staticClass: "a-list__table" }, [
_c("thead", [
_c("tr", [
_c("th", { staticClass: "check-col" }, [
_c("input", {
attrs: { type: "checkbox" },
domProps: { checked: _vm.checkAll },
on: { click: _vm.switchCheckAll },
}),
]),
_vm._v(" "),
_c("th", [_vm._v("客户姓名")]),
_vm._v(" "),
_c("th", [_vm._v("证件号码")]),
_vm._v(" "),
_c("th", [_vm._v("手机号码")]),
_vm._v(" "),
_c("th", [_vm._v("操作")]),
]),
]),
_vm._v(" "),
_c(
"tbody",
_vm._l(_vm.data, function (item) {
return _c(
"tr",
{ key: item.idCard },
[
_c("td", { staticClass: "check-col" }, [
_c("input", {
attrs: { type: "checkbox" },
domProps: { checked: _vm.checkedList.includes(item) },
on: {
input: function ($event) {
return _vm.switchCheck(item)
},
},
}),
]),
_vm._v(" "),
_vm._l(_vm.fields, function (key) {
return _c("td", { key: key }, [
_vm._v("\n " + _vm._s(item[key]) + "\n "),
])
}),
_vm._v(" "),
_c("td", [
_c(
"button",
{
staticClass: "a-btn a-btn--small",
on: {
click: function ($event) {
return _vm.insert(item)
},
},
},
[_vm._v("填入")]
),
_vm._v(" "),
_c(
"button",
{
staticClass: "a-btn a-btn--small",
on: {
click: function ($event) {
return _vm.update(item)
},
},
},
[_vm._v("编辑")]
),
_vm._v(" "),
_c(
"button",
{
staticClass: "a-btn a-btn--small",
on: {
click: function ($event) {
return _vm.remove(item)
},
},
},
[_vm._v("删除")]
),
]),
],
2
)
}),
0
),
]),
])
};
var __vue_staticRenderFns__$1 = [];
__vue_render__$1._withStripped = true;
/* style */
const __vue_inject_styles__$1 = function (inject) {
if (!inject) return
inject("data-v-879b25de_0", { source: ".a-list .a-list__table th[data-v-879b25de], .a-list .a-list__table td[data-v-879b25de] {\n font-size: inherit;\n padding: 5px 10px;\n}\n.a-list .a-list__table .check-col[data-v-879b25de] {\n padding: 0;\n text-align: center;\n}\n.a-list .a-list__table tbody tr[data-v-879b25de]:nth-child(odd) {\n background-color: #f2f2f2;\n}\n.a-list .a-list__table tbody tr[data-v-879b25de]:hover {\n background-color: #e6e6e6;\n}\n.a-list .a-list__table [type=checkbox][data-v-879b25de] {\n cursor: pointer;\n}\n\n/*# sourceMappingURL=list.vue.map */", map: {"version":3,"sources":["D:\\Project\\appointment-vue\\src\\component\\list.vue","list.vue"],"names":[],"mappings":"AAoHA;EACA,kBAAA;EACA,iBAAA;ACnHA;ADsHA;EACA,UAAA;EACA,kBAAA;ACpHA;ADwHA;EACA,yBAAA;ACtHA;ADyHA;EACA,yBAAA;ACvHA;AD2HA;EACA,eAAA;ACzHA;;AAEA,mCAAmC","file":"list.vue","sourcesContent":["<template>\r\n <div class=\"a-list\">\r\n <table class=\"a-list__table\">\r\n <thead>\r\n <tr>\r\n <th class=\"check-col\">\r\n <input type=\"checkbox\" :checked=\"checkAll\" @click=\"switchCheckAll\">\r\n </th>\r\n <th>客户姓名</th>\r\n <th>证件号码</th>\r\n <th>手机号码</th>\r\n <th>操作</th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr v-for=\"item of data\" :key=\"item.idCard\">\r\n <td class=\"check-col\">\r\n <input type=\"checkbox\" :checked=\"checkedList.includes(item)\" @input=\"switchCheck(item)\"/>\r\n </td>\r\n <td v-for=\"key of fields\" :key=\"key\">\r\n {{ item[key] }}\r\n </td>\r\n <td>\r\n <button class=\"a-btn a-btn--small\" @click=\"insert(item)\">填入</button>\r\n <button class=\"a-btn a-btn--small\" @click=\"update(item)\">编辑</button>\r\n <button class=\"a-btn a-btn--small\" @click=\"remove(item)\">删除</button>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport storage from '../storage'\r\n\r\nconst forKey = {\r\n 'name': 'custName',\r\n 'idCard': 'paperNum',\r\n 'phone': 'mobileno',\r\n}\r\n\r\nexport default {\r\n name: 'list',\r\n\r\n data: () => ({\r\n fields: [\r\n 'name',\r\n 'idCard',\r\n 'phone',\r\n ],\r\n data: [],\r\n checkedList: [],\r\n }),\r\n\r\n computed: {\r\n checkAll() {\r\n return this.checkedList.length === this.data.length\r\n },\r\n },\r\n\r\n created() {\r\n this.data = storage.getItem('data', [])\r\n },\r\n\r\n methods: {\r\n insert(item) {\r\n Object.entries(item).forEach(([k, v]) => {\r\n this.setValue(forKey[k], v)\r\n })\r\n },\r\n setValue(key, value) {\r\n const label = document.querySelector(`label[for=${key}]`)\r\n if (label) {\r\n const input = label.nextElementSibling.querySelector('input')\r\n input.value = value\r\n }\r\n },\r\n remove(item, tips = true) {\r\n if (!tips || window.confirm(`确定删除 ${item.name} ?`)) {\r\n const index = this.data.indexOf(item)\r\n const checkIndex = this.checkedList.indexOf(item)\r\n\r\n if (~index) this.data.splice(index, 1)\r\n if (~checkIndex) this.checkedList.splice(checkIndex, 1)\r\n storage.setItem('data', this.data)\r\n }\r\n },\r\n removeChecked() {\r\n if (this.checkedList.length > 0 && window.confirm(`确定删除这 ${this.checkedList.length} 条数据吗?`))\r\n [...this.checkedList].forEach((item) => this.remove(item, false))\r\n },\r\n switchCheckAll() {\r\n if (this.checkAll) {\r\n this.checkedList = []\r\n } else {\r\n this.checkedList = [...this.data]\r\n }\r\n },\r\n switchCheck(item) {\r\n const index = this.checkedList.indexOf(item)\r\n ~index\r\n ? this.checkedList.splice(index, 1)\r\n : this.checkedList.push(item)\r\n console.log(this.checkedList)\r\n },\r\n update(item) {\r\n this.$emit('update', item)\r\n },\r\n },\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.a-list {\r\n .a-list__table {\r\n th, td {\r\n font-size: inherit;\r\n padding: 5px 10px;\r\n }\r\n\r\n .check-col {\r\n padding: 0;\r\n text-align: center;\r\n }\r\n\r\n tbody {\r\n tr:nth-child(odd) {\r\n background-color: #f2f2f2;\r\n }\r\n\r\n tr:hover {\r\n background-color: #e6e6e6;\r\n }\r\n }\r\n\r\n [type=checkbox] {\r\n cursor: pointer;\r\n }\r\n }\r\n}\r\n</style>\r\n",".a-list .a-list__table th, .a-list .a-list__table td {\n font-size: inherit;\n padding: 5px 10px;\n}\n.a-list .a-list__table .check-col {\n padding: 0;\n text-align: center;\n}\n.a-list .a-list__table tbody tr:nth-child(odd) {\n background-color: #f2f2f2;\n}\n.a-list .a-list__table tbody tr:hover {\n background-color: #e6e6e6;\n}\n.a-list .a-list__table [type=checkbox] {\n cursor: pointer;\n}\n\n/*# sourceMappingURL=list.vue.map */"]}, media: undefined });
};
/* scoped */
const __vue_scope_id__$1 = "data-v-879b25de";
/* module identifier */
const __vue_module_identifier__$1 = undefined;
/* functional template */
const __vue_is_functional_template__$1 = false;
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__$1 = /*#__PURE__*/normalizeComponent(
{ render: __vue_render__$1, staticRenderFns: __vue_staticRenderFns__$1 },
__vue_inject_styles__$1,
__vue_script__$1,
__vue_scope_id__$1,
__vue_is_functional_template__$1,
__vue_module_identifier__$1,
false,
createInjector,
undefined,
undefined
);
//
const PANEL_TYPE = {
list: 0,
update: 1,
};
var script = {
components: {
update: __vue_component__$2,
list: __vue_component__$1,
},
data() {
this.PANEL_TYPE = PANEL_TYPE;
return {
panel: PANEL_TYPE.list,
show: true,
updateItem: {},
}
},
methods: {
update(item) {
this.updateItem = item;
this.panel = PANEL_TYPE.update;
},
removeChecked() {
this.$refs.list.removeChecked();
},
},
};
/* script */
const __vue_script__ = script;
/* template */
var __vue_render__ = function () {
var _vm = this;
var _h = _vm.$createElement;
var _c = _vm._self._c || _h;
return _c("div", { staticClass: "a-dialog" }, [
_c("div", { staticClass: "a-action-bar" }, [
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.show,
expression: "show",
},
],
},
[
_vm.panel === _vm.PANEL_TYPE.list
? [
_c(
"button",
{
staticClass: "a-btn",
on: {
click: function ($event) {
return _vm.update({})
},
},
},
[_vm._v("新增\n ")]
),
_vm._v(" "),
_c(
"button",
{
staticClass: "a-btn",
on: {
click: function ($event) {
return _vm.removeChecked()
},
},
},
[_vm._v("删除所选\n ")]
),
]
: _vm.panel === _vm.PANEL_TYPE.update
? _c(
"button",
{
staticClass: "a-btn",
on: {
click: function ($event) {
_vm.panel = _vm.PANEL_TYPE.list;
},
},
},
[_vm._v("返回\n ")]
)
: _vm._e(),
],
2
),
_vm._v(" "),
_c("div", [
_c(
"button",
{
staticClass: "a-btn",
on: {
click: function ($event) {
_vm.show = !_vm.show;
},
},
},
[_vm._v(_vm._s(_vm.show ? "隐藏" : "显示"))]
),
]),
]),
_vm._v(" "),
_c(
"div",
{
directives: [
{
name: "show",
rawName: "v-show",
value: _vm.show,
expression: "show",
},
],
},
[
_vm.panel === _vm.PANEL_TYPE.list
? _c("list", { ref: "list", on: { update: _vm.update } })
: _vm.panel === _vm.PANEL_TYPE.update
? _c("update", { attrs: { item: _vm.updateItem } })
: _vm._e(),
],
1
),
])
};
var __vue_staticRenderFns__ = [];
__vue_render__._withStripped = true;
/* style */
const __vue_inject_styles__ = function (inject) {
if (!inject) return
inject("data-v-0539de28_0", { source: ".a-dialog[data-v-0539de28] {\n font-size: 14px;\n position: absolute;\n z-index: 1000;\n top: 20px;\n right: 20px;\n padding: 10px;\n border-radius: 10px;\n background-color: white;\n box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);\n}\n.a-action-bar[data-v-0539de28] {\n display: flex;\n justify-content: space-between;\n}\n\n/*# sourceMappingURL=dialog.vue.map */", map: {"version":3,"sources":["D:\\Project\\appointment-vue\\src\\component\\dialog.vue","dialog.vue"],"names":[],"mappings":"AAuEA;EACA,eAAA;EACA,kBAAA;EACA,aAAA;EACA,SAAA;EACA,WAAA;EACA,aAAA;EACA,mBAAA;EACA,uBAAA;EACA,wHAAA;ACtEA;ADyEA;EACA,aAAA;EACA,8BAAA;ACtEA;;AAEA,qCAAqC","file":"dialog.vue","sourcesContent":["<template>\r\n <div class=\"a-dialog\">\r\n <div class=\"a-action-bar\">\r\n <div v-show=\"show\">\r\n <template v-if=\"panel === PANEL_TYPE.list\">\r\n <button\r\n class=\"a-btn\"\r\n @click=\"update({})\"\r\n >新增\r\n </button>\r\n <button\r\n class=\"a-btn\"\r\n @click=\"removeChecked()\"\r\n >删除所选\r\n </button>\r\n </template>\r\n <button\r\n v-else-if=\"panel === PANEL_TYPE.update\"\r\n class=\"a-btn\"\r\n @click=\"panel = PANEL_TYPE.list\"\r\n >返回\r\n </button>\r\n </div>\r\n <div>\r\n <button class=\"a-btn\" @click=\"show = !show\">{{ show ? '隐藏' : '显示' }}</button>\r\n </div>\r\n </div>\r\n <div v-show=\"show\">\r\n <list v-if=\"panel === PANEL_TYPE.list\" ref=\"list\" @update=\"update\"></list>\r\n <update v-else-if=\"panel === PANEL_TYPE.update\" :item=\"updateItem\"></update>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport update from './update.vue'\r\nimport list from './list.vue'\r\n\r\nconst PANEL_TYPE = {\r\n list: 0,\r\n update: 1,\r\n}\r\n\r\nexport default {\r\n components: {\r\n update,\r\n list,\r\n },\r\n\r\n data() {\r\n this.PANEL_TYPE = PANEL_TYPE\r\n return {\r\n panel: PANEL_TYPE.list,\r\n show: true,\r\n updateItem: {},\r\n }\r\n },\r\n\r\n methods: {\r\n update(item) {\r\n this.updateItem = item\r\n this.panel = PANEL_TYPE.update\r\n },\r\n removeChecked() {\r\n this.$refs.list.removeChecked()\r\n },\r\n },\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.a-dialog {\r\n font-size: 14px;\r\n position: absolute;\r\n z-index: 1000;\r\n top: 20px;\r\n right: 20px;\r\n padding: 10px;\r\n border-radius: 10px;\r\n background-color: white;\r\n box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12);\r\n}\r\n\r\n.a-action-bar {\r\n display: flex;\r\n justify-content: space-between;\r\n}\r\n</style>\r\n\r\n<style lang=\"scss\">\r\n.a-dialog {\r\n .a-btn {\r\n padding: 5px 10px;\r\n cursor: pointer;\r\n\r\n &--small {\r\n padding: 2px 5px;\r\n }\r\n }\r\n}\r\n</style>\r\n",".a-dialog {\n font-size: 14px;\n position: absolute;\n z-index: 1000;\n top: 20px;\n right: 20px;\n padding: 10px;\n border-radius: 10px;\n background-color: white;\n box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);\n}\n\n.a-action-bar {\n display: flex;\n justify-content: space-between;\n}\n\n/*# sourceMappingURL=dialog.vue.map */"]}, media: undefined })
,inject("data-v-0539de28_1", { source: ".a-dialog .a-btn {\n padding: 5px 10px;\n cursor: pointer;\n}\n.a-dialog .a-btn--small {\n padding: 2px 5px;\n}\n\n/*# sourceMappingURL=dialog.vue.map */", map: {"version":3,"sources":["D:\\Project\\appointment-vue\\src\\component\\dialog.vue","dialog.vue"],"names":[],"mappings":"AA2FA;EACA,iBAAA;EACA,eAAA;AC1FA;AD4FA;EACA,gBAAA;AC1FA;;AAEA,qCAAqC","file":"dialog.vue","sourcesContent":["<template>\r\n <div class=\"a-dialog\">\r\n <div class=\"a-action-bar\">\r\n <div v-show=\"show\">\r\n <template v-if=\"panel === PANEL_TYPE.list\">\r\n <button\r\n class=\"a-btn\"\r\n @click=\"update({})\"\r\n >新增\r\n </button>\r\n <button\r\n class=\"a-btn\"\r\n @click=\"removeChecked()\"\r\n >删除所选\r\n </button>\r\n </template>\r\n <button\r\n v-else-if=\"panel === PANEL_TYPE.update\"\r\n class=\"a-btn\"\r\n @click=\"panel = PANEL_TYPE.list\"\r\n >返回\r\n </button>\r\n </div>\r\n <div>\r\n <button class=\"a-btn\" @click=\"show = !show\">{{ show ? '隐藏' : '显示' }}</button>\r\n </div>\r\n </div>\r\n <div v-show=\"show\">\r\n <list v-if=\"panel === PANEL_TYPE.list\" ref=\"list\" @update=\"update\"></list>\r\n <update v-else-if=\"panel === PANEL_TYPE.update\" :item=\"updateItem\"></update>\r\n </div>\r\n </div>\r\n</template>\r\n\r\n<script>\r\nimport update from './update.vue'\r\nimport list from './list.vue'\r\n\r\nconst PANEL_TYPE = {\r\n list: 0,\r\n update: 1,\r\n}\r\n\r\nexport default {\r\n components: {\r\n update,\r\n list,\r\n },\r\n\r\n data() {\r\n this.PANEL_TYPE = PANEL_TYPE\r\n return {\r\n panel: PANEL_TYPE.list,\r\n show: true,\r\n updateItem: {},\r\n }\r\n },\r\n\r\n methods: {\r\n update(item) {\r\n this.updateItem = item\r\n this.panel = PANEL_TYPE.update\r\n },\r\n removeChecked() {\r\n this.$refs.list.removeChecked()\r\n },\r\n },\r\n}\r\n</script>\r\n\r\n<style lang=\"scss\" scoped>\r\n.a-dialog {\r\n font-size: 14px;\r\n position: absolute;\r\n z-index: 1000;\r\n top: 20px;\r\n right: 20px;\r\n padding: 10px;\r\n border-radius: 10px;\r\n background-color: white;\r\n box-shadow: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12);\r\n}\r\n\r\n.a-action-bar {\r\n display: flex;\r\n justify-content: space-between;\r\n}\r\n</style>\r\n\r\n<style lang=\"scss\">\r\n.a-dialog {\r\n .a-btn {\r\n padding: 5px 10px;\r\n cursor: pointer;\r\n\r\n &--small {\r\n padding: 2px 5px;\r\n }\r\n }\r\n}\r\n</style>\r\n",".a-dialog .a-btn {\n padding: 5px 10px;\n cursor: pointer;\n}\n.a-dialog .a-btn--small {\n padding: 2px 5px;\n}\n\n/*# sourceMappingURL=dialog.vue.map */"]}, media: undefined });
};
/* scoped */
const __vue_scope_id__ = "data-v-0539de28";
/* module identifier */
const __vue_module_identifier__ = undefined;
/* functional template */
const __vue_is_functional_template__ = false;
/* style inject SSR */
/* style inject shadow dom */
const __vue_component__ = /*#__PURE__*/normalizeComponent(
{ render: __vue_render__, staticRenderFns: __vue_staticRenderFns__ },
__vue_inject_styles__,
__vue_script__,
__vue_scope_id__,
__vue_is_functional_template__,
__vue_module_identifier__,
false,
createInjector,
undefined,
undefined
);
function getVue() {
return new Promise((resolve, reject) => {
if (window && window.Vue) {
resolve(window.Vue);
} else {
const script = document.createElement('script');
script.src = 'https://cdn.jsdelivr.net/npm/vue@2.6.14';
document.body.appendChild(script);
script.onload = () => {
resolve(window.Vue);
};
}
})
}
__vue_component__.install = function initial(Vue) {
const Component = Vue.extend(__vue_component__);
const element = new Component().$mount().$el;
document.body.appendChild(element);
};
getVue()
.then((Vue) => {
Vue.use(__vue_component__);
console.log('=============安装成功=============');
})
.catch(err => {
console.error('=============安装失败=============', err);
});
})();