@ajaxjs/ui 1.0.7 → 1.1.2

package/src/components/list/attachment-picture-list.ts

@@ -1,57 +0,0 @@
-// interface AttachmentPictureList extends Ajax {
-//     delImgUrl: string;
-//     pics: BaseObject[];
-// }
-
-// /**
-//  * 相册列表
-//  */
-// Vue.component('aj-attachment-picture-list', {
-//     template: `
-//         <table>
-//             <tr>
-//                 <td>
-//                     <div class="label">相册图：</div>
-//                     <ul>
-//                         <li v-for="pic in pics" style="float:left;margin-right:1%;text-align:center;">
-//                             <a :href="picCtx + pic.path" target="_blank"><img :src="picCtx + pic.path" style="max-width: 100px;max-height: 100px;" /></a><br />
-//                             <a href="###" @click="delPic(pic.id);">删 除</a>
-//                         </li>
-//                     </ul>
-//                 </td> 
-//                 <td>
-//                     <aj-xhr-upload ref="attachmentPictureUpload" :action="uploadUrl" :is-img-upload="true" :img-place="blankBg"></aj-xhr-upload>
-//                 </td>
-//             </tr>
-//         </table>
-//     `,
-//     props: {
-//         picCtx: String,
-//         uploadUrl: String,
-//         blankBg: String,
-//         delImgUrl: String,
-//         apiUrl: String
-//     },
-//     data() {
-//         return {
-//             pics: []
-//         };
-//     },
-//     mounted(): void {
-//         this.getData();
-//         this.$refs.attachmentPictureUpload.uploadOk_callback = this.getData;
-//     },
-//     methods: {
-//         getData(this: AttachmentPictureList): void {
-//             aj.xhr.get(this.apiUrl, (j: RepsonseResult) => this.pics = j.result);
-//         },
-//         delPic(this: AttachmentPictureList, picId: string): void {
-//             aj.showConfirm("确定删除相册图片？", () => {
-//                 aj.xhr.dele(this.delImgUrl + picId + "/", (j: RepsonseResult) => {
-//                     if (j.isOk)
-//                         this.getData();// 刷新
-//                 });
-//             });
-//         }
-//     }
-// });

package/src/components/list/list.js

@@ -1,227 +0,0 @@
-// namespace aj.list {
-// 	/**
-// 	 * 分页列表专用的结果数据
-// 	 */
-// 	interface PageListRepsonseResult extends RepsonseResult {
-// 		/**
-// 		 * 结果总数
-// 		 */
-// 		total: number;
-// 	}
-// 	/**
-// 	 * 列表数据
-// 	 */
-// 	interface DataStore extends Ajax {
-// 		/**
-// 		 * 是否分页，false=读取所有数据
-// 		 */
-// 		isPage: boolean;
-// 		pageStart: number;
-// 		pageSize: number;
-// 		initPageSize: number;
-// 		total: number;
-// 		/**
-// 		 * 请求结果
-// 		 */
-// 		result: BaseObject[];
-// 		totalPage: number;
-// 		currentPage: number;
-// 		/**
-// 		 * 默认的分页参数其名字
-// 		 */
-// 		pageParamNames: string[];
-// 		/**
-// 		 * 计算分页
-// 		 */
-// 		count(): void;
-// 	}
-// 	/**
-// 	 * 本地数据仓库
-// 	 * 一般情况下不会单独使用这个组件
-// 	 */
-// 	export var datastore = {
-// 		props: {
-// 			apiUrl: { type: String, required: true },                       // JSON 接口地址
-// 			isPage: { type: Boolean, default: true },
-// 			initPageSize: { type: Number, required: false, default: 9 },
-// 			isAutoLoad: { type: Boolean, default: true },
-// 			baseParam: { type: Object, default() { return {}; } },
-// 			pageParamNames: { type: Array, default() { return ['start', 'limit']; } }, 	// 默认的分页参数其名字
-// 			onLoad: Function
-// 		},
-// 		data(this: DataStore) {
-// 			return {
-// 				result: [],
-// 				extraParam: {},	                // 与 baseParam 合并后每次请求可发送的，可以修改的
-// 				pageSize: this.initPageSize,
-// 				total: 0,
-// 				totalPage: 0,
-// 				pageStart: 0,
-// 				currentPage: 0
-// 			};
-// 		},
-// 		methods: {
-// 			/**
-// 			 * 分页，跳到第几页，下拉控件传入指定的页码
-// 			 * 
-// 			 * @param this 
-// 			 * @param ev 
-// 			 */
-// 			jumpPageBySelect(this: DataStore, ev: Event): void {
-// 				let selectEl: HTMLSelectElement = <HTMLSelectElement>ev.target;
-// 				let currentPage: string = selectEl.options[selectEl.selectedIndex].value;
-// 				this.pageStart = (Number(currentPage) - 1) * this.pageSize;
-// 				this.getData();
-// 			},
-// 			/**
-// 			 * PageSize 改变时候重新分页
-// 			 * 
-// 			 * @param this 
-// 			 * @param ev 
-// 			 */
-// 			onPageSizeChange(this: DataStore, ev: Event): void {
-// 				this.pageSize = Number((<HTMLInputElement>ev.target).value);
-// 				this.count();
-// 				this.getData();
-// 			},
-// 			count(this: DataStore): void {
-// 				let totalPage: number = this.total / this.pageSize, yushu: number = this.total % this.pageSize;
-// 				this.totalPage = parseInt(String(yushu == 0 ? totalPage : totalPage + 1));
-// 				//@ts-ignore
-// 				this.currentPage = parseInt((this.pageStart / this.pageSize) + 1);
-// 			},
-// 			/**
-// 			 * 前一页
-// 			 * 
-// 			 * @param this 
-// 			 */
-// 			previousPage(this: DataStore): void {
-// 				this.pageStart -= this.pageSize;
-// 				//@ts-ignore
-// 				this.currentPage = parseInt((this.pageStart / this.pageSize) + 1);
-// 				this.getData();
-// 			},
-// 			/**
-// 			 * 下一页
-// 			 * 
-// 			 * @param this
-// 			 */
-// 			nextPage(this: DataStore): void {
-// 				this.pageStart += this.pageSize;
-// 				this.currentPage = (this.pageStart / this.pageSize) + 1;
-// 				this.getData();
-// 			}
-// 		}
-// 	};
-// 	/**
-// 	 * 列表控件
-// 	 */
-// 	interface List extends DataStore, Vue {
-// 		/**
-// 		 * 数据分页是否追加模式，默认不追加 = false。 App 一般采用追加模式
-// 		 */
-// 		isDataAppend: boolean;
-// 		/**
-// 		 * 到达底部是否自动加载下一页，通常在 移动端使用，这个应该是元素的 CSS Selector
-// 		 */
-// 		autoLoadWhenReachedBottom: boolean;
-// 	}
-// 	Vue.component('aj-list', {
-// 		mixins: [datastore],
-// 		template: html`
-// 			<div class="aj-list">
-// 				<slot name="header" v-if="total != 0"></slot>
-// 				<ul v-if="showDefaultUi && (total != 0)">
-// 					<li v-for="(item, index) in result">
-// 						<slot v-bind="item">
-// 							<a href="#" @click="show(item.id, index, $event)" :id="item.id">{{item.name}}</a>
-// 						</slot>
-// 					</li>
-// 				</ul>
-// 				<div class="no-data" v-show="isPage && total == 0">未有任何数据</div>
-// 				<footer v-if="isPage" class="pager">
-// 					<a v-if="pageStart > 0" href="#" @click="previousPage">上一页</a>
-// 					<a v-if="(pageStart > 0 ) && (pageStart + pageSize < total)" style="text-decoration: none;">&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;</a>
-// 					<a v-if="pageStart + pageSize < total" href="#" @click="nextPage">下一页</a>
-// 					<a href="javascript:;" @click="getData"><i class="fa fa-refresh" aria-hidden="true"></i> 刷新</a>
-// 					<input type="hidden" name="start" :value="pageStart" />
-// 					页数：{{currentPage}}/{{totalPage}} 记录数：{{pageStart}}/{{total}}
-// 					每页记录数： <input size="2" title="输入一个数字确定每页记录数" type="text" :value="pageSize" @change="onPageSizeChange" />
-// 					跳转：
-// 					<select @change="jumpPageBySelect">
-// 						<option :value="n" v-for="n in totalPage">{{n}}</option>
-// 					</select>
-// 				</footer>
-// 				<div v-show="!!autoLoadWhenReachedBottom" class="buttom"></div>
-// 			</div>
-// 		`,
-// 		props: {
-// 			showDefaultUi: { type: Boolean, default: true },		 // 如果只是单纯作为分页组件，那么则不需要 UI
-// 			isShowFooter: { type: Boolean, default: true },			 // 是否显示分页 UI
-// 			hrefStr: { type: String, required: false },
-// 			autoLoadWhenReachedBottom: { type: String, default: '' },
-// 			isDataAppend: { type: Boolean, default: false }
-// 		},
-// 		mounted(this: List): void {
-// 			this.isAutoLoad && this.getData();
-// 			// this.BUS.$on('base-param-change', this.onExtraParamChange.bind(this));
-// 			if (!!this.autoLoadWhenReachedBottom) {
-// 				// var scrollSpy = new aj.scrollSpy({ scrollInElement: aj(this.autoLoadWhenReachedBottom), spyOn: thish.$el.$('.buttom') });
-// 				// scrollSpy.onScrollSpyBackInSight = e => this.nextPage();
-// 			}
-// 		},
-// 		methods: {
-// 			getData(this: List): void {
-// 				this.lastRequestParam = {};
-// 				aj.apply(this.lastRequestParam, this.baseParam);
-// 				aj.apply(this.lastRequestParam, this.extraParam);
-// 				initPageParams.call(this);
-// 				xhr.get(this.apiUrl, this.onLoad || ((j: PageListRepsonseResult) => {
-// 					if (j.result) {
-// 						if (this.isPage && j.total === undefined)
-// 							aj.alert('JSON 缺少 total 字段');
-// 						if (j.total == 0 || j.result.length == 0)
-// 							aj.alert('没有找到任何记录');
-// 						this.result = j.result;
-// 						if (this.isPage) {
-// 							this.total = j.total;
-// 							this.count();
-// 						}
-// 					}
-// 					this.$emit('pager-result', this.result);
-// 				}), this.lastRequestParam);
-// 			},
-// 			/**
-// 			 * 复位
-// 			 * 
-// 			 * @param this 
-// 			 */
-// 			reset(this: List): void {
-// 				this.total = this.totalPage = this.pageStart = this.currentPage = 0;
-// 				this.pageSize = this.initPageSize;
-// 			},
-// 			onExtraParamChange(this: List, params: JsonParam): void {
-// 				aj.apply(this.extraParam, params);
-// 				this.pageStart = 0; // 每次 extraParam 被改变，都是从第一笔开始
-// 				this.getData();
-// 			}
-// 		},
-// 		watch: {
-// 			extraParam(this: List): void {
-// 				this.getData();
-// 			}
-// 		}
-// 	});
-// 	/**
-// 	 * 生成分页参数的名字
-// 	 * 
-// 	 * @param this 
-// 	 */
-// 	function initPageParams(this: List) {
-// 		let params: { [key: string]: number } = {};
-// 		params[this.pageParamNames[0]] = this.pageStart;
-// 		params[this.pageParamNames[1]] = this.pageSize;
-// 		this.isPage && aj.apply(this.lastRequestParam, params);
-// 	}
-// }
-//# sourceMappingURL=list.js.map

package/src/components/list/list.ts

@@ -1,261 +0,0 @@
-
-
-// namespace aj.list {
-// 	/**
-// 	 * 分页列表专用的结果数据
-// 	 */
-// 	interface PageListRepsonseResult extends RepsonseResult {
-// 		/**
-// 		 * 结果总数
-// 		 */
-// 		total: number;
-// 	}
-
-// 	/**
-// 	 * 列表数据
-// 	 */
-// 	interface DataStore extends Ajax {
-// 		/**
-// 		 * 是否分页，false=读取所有数据
-// 		 */
-// 		isPage: boolean;
-
-// 		pageStart: number;
-
-// 		pageSize: number;
-
-// 		initPageSize: number;
-
-// 		total: number;
-
-// 		/**
-// 		 * 请求结果
-// 		 */
-// 		result: BaseObject[];
-
-// 		totalPage: number;
-
-// 		currentPage: number;
-
-// 		/**
-// 		 * 默认的分页参数其名字
-// 		 */
-// 		pageParamNames: string[];
-
-// 		/**
-// 		 * 计算分页
-// 		 */
-// 		count(): void;
-// 	}
-
-// 	/**
-// 	 * 本地数据仓库
-// 	 * 一般情况下不会单独使用这个组件
-// 	 */
-// 	export var datastore = {
-// 		props: {
-// 			apiUrl: { type: String, required: true },                       // JSON 接口地址
-// 			isPage: { type: Boolean, default: true },
-// 			initPageSize: { type: Number, required: false, default: 9 },
-// 			isAutoLoad: { type: Boolean, default: true },
-// 			baseParam: { type: Object, default() { return {}; } },
-// 			pageParamNames: { type: Array, default() { return ['start', 'limit']; } }, 	// 默认的分页参数其名字
-// 			onLoad: Function
-// 		},
-// 		data(this: DataStore) {
-// 			return {
-// 				result: [],
-// 				extraParam: {},	                // 与 baseParam 合并后每次请求可发送的，可以修改的
-// 				pageSize: this.initPageSize,
-// 				total: 0,
-// 				totalPage: 0,
-// 				pageStart: 0,
-// 				currentPage: 0
-// 			};
-// 		},
-
-// 		methods: {
-// 			/**
-// 			 * 分页，跳到第几页，下拉控件传入指定的页码
-// 			 * 
-// 			 * @param this 
-// 			 * @param ev 
-// 			 */
-// 			jumpPageBySelect(this: DataStore, ev: Event): void {
-// 				let selectEl: HTMLSelectElement = <HTMLSelectElement>ev.target;
-// 				let currentPage: string = selectEl.options[selectEl.selectedIndex].value;
-
-// 				this.pageStart = (Number(currentPage) - 1) * this.pageSize;
-// 				this.getData();
-// 			},
-
-// 			/**
-// 			 * PageSize 改变时候重新分页
-// 			 * 
-// 			 * @param this 
-// 			 * @param ev 
-// 			 */
-// 			onPageSizeChange(this: DataStore, ev: Event): void {
-// 				this.pageSize = Number((<HTMLInputElement>ev.target).value);
-// 				this.count();
-// 				this.getData();
-// 			},
-
-// 			count(this: DataStore): void {
-// 				let totalPage: number = this.total / this.pageSize, yushu: number = this.total % this.pageSize;
-// 				this.totalPage = parseInt(String(yushu == 0 ? totalPage : totalPage + 1));
-// 				//@ts-ignore
-// 				this.currentPage = parseInt((this.pageStart / this.pageSize) + 1);
-// 			},
-
-// 			/**
-// 			 * 前一页
-// 			 * 
-// 			 * @param this 
-// 			 */
-// 			previousPage(this: DataStore): void {
-// 				this.pageStart -= this.pageSize;
-// 				//@ts-ignore
-// 				this.currentPage = parseInt((this.pageStart / this.pageSize) + 1);
-
-// 				this.getData();
-// 			},
-
-// 			/**
-// 			 * 下一页
-// 			 * 
-// 			 * @param this
-// 			 */
-// 			nextPage(this: DataStore): void {
-// 				this.pageStart += this.pageSize;
-// 				this.currentPage = (this.pageStart / this.pageSize) + 1;
-
-// 				this.getData();
-// 			}
-// 		}
-// 	};
-
-// 	/**
-// 	 * 列表控件
-// 	 */
-// 	interface List extends DataStore, Vue {
-// 		/**
-// 		 * 数据分页是否追加模式，默认不追加 = false。 App 一般采用追加模式
-// 		 */
-// 		isDataAppend: boolean;
-
-// 		/**
-// 		 * 到达底部是否自动加载下一页，通常在 移动端使用，这个应该是元素的 CSS Selector
-// 		 */
-// 		autoLoadWhenReachedBottom: boolean;
-// 	}
-
-// 	Vue.component('aj-list', {
-// 		mixins: [datastore],
-// 		template: html`
-// 			<div class="aj-list">
-// 				<slot name="header" v-if="total != 0"></slot>
-// 				<ul v-if="showDefaultUi && (total != 0)">
-// 					<li v-for="(item, index) in result">
-// 						<slot v-bind="item">
-// 							<a href="#" @click="show(item.id, index, $event)" :id="item.id">{{item.name}}</a>
-// 						</slot>
-// 					</li>
-// 				</ul>
-// 				<div class="no-data" v-show="isPage && total == 0">未有任何数据</div>
-// 				<footer v-if="isPage" class="pager">
-// 					<a v-if="pageStart > 0" href="#" @click="previousPage">上一页</a>
-// 					<a v-if="(pageStart > 0 ) && (pageStart + pageSize < total)" style="text-decoration: none;">&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;</a>
-// 					<a v-if="pageStart + pageSize < total" href="#" @click="nextPage">下一页</a>
-// 					<a href="javascript:;" @click="getData"><i class="fa fa-refresh" aria-hidden="true"></i> 刷新</a>
-// 					<input type="hidden" name="start" :value="pageStart" />
-// 					页数：{{currentPage}}/{{totalPage}} 记录数：{{pageStart}}/{{total}}
-// 					每页记录数： <input size="2" title="输入一个数字确定每页记录数" type="text" :value="pageSize" @change="onPageSizeChange" />
-// 					跳转：
-// 					<select @change="jumpPageBySelect">
-// 						<option :value="n" v-for="n in totalPage">{{n}}</option>
-// 					</select>
-// 				</footer>
-// 				<div v-show="!!autoLoadWhenReachedBottom" class="buttom"></div>
-// 			</div>
-// 		`,
-// 		props: {
-// 			showDefaultUi: { type: Boolean, default: true },		 // 如果只是单纯作为分页组件，那么则不需要 UI
-// 			isShowFooter: { type: Boolean, default: true },			 // 是否显示分页 UI
-// 			hrefStr: { type: String, required: false },
-// 			autoLoadWhenReachedBottom: { type: String, default: '' },
-// 			isDataAppend: { type: Boolean, default: false }
-// 		},
-// 		mounted(this: List): void {
-// 			this.isAutoLoad && this.getData();
-
-// 			// this.BUS.$on('base-param-change', this.onExtraParamChange.bind(this));
-// 			if (!!this.autoLoadWhenReachedBottom) {
-// 				// var scrollSpy = new aj.scrollSpy({ scrollInElement: aj(this.autoLoadWhenReachedBottom), spyOn: thish.$el.$('.buttom') });
-// 				// scrollSpy.onScrollSpyBackInSight = e => this.nextPage();
-// 			}
-// 		},
-// 		methods: {
-// 			getData(this: List): void {
-// 				this.lastRequestParam = {};
-// 				aj.apply(this.lastRequestParam, this.baseParam);
-// 				aj.apply(this.lastRequestParam, this.extraParam);
-// 				initPageParams.call(this);
-
-// 				xhr.get(this.apiUrl, this.onLoad || ((j: PageListRepsonseResult) => {
-// 					if (j.result) {
-// 						if (this.isPage && j.total === undefined)
-// 							aj.alert('JSON 缺少 total 字段');
-
-// 						if (j.total == 0 || j.result.length == 0)
-// 							aj.alert('没有找到任何记录');
-
-// 						this.result = j.result;
-
-// 						if (this.isPage) {
-// 							this.total = j.total;
-// 							this.count();
-// 						}
-// 					}
-
-// 					this.$emit('pager-result', this.result);
-// 				}), this.lastRequestParam);
-// 			},
-
-// 			/**
-// 			 * 复位
-// 			 * 
-// 			 * @param this 
-// 			 */
-// 			reset(this: List): void {
-// 				this.total = this.totalPage = this.pageStart = this.currentPage = 0;
-// 				this.pageSize = this.initPageSize;
-// 			},
-
-// 			onExtraParamChange(this: List, params: JsonParam): void {
-// 				aj.apply(this.extraParam, params);
-
-// 				this.pageStart = 0; // 每次 extraParam 被改变，都是从第一笔开始
-// 				this.getData();
-// 			}
-// 		},
-// 		watch: {
-// 			extraParam(this: List): void {
-// 				this.getData();
-// 			}
-// 		}
-// 	});
-
-// 	/**
-// 	 * 生成分页参数的名字
-// 	 * 
-// 	 * @param this 
-// 	 */
-// 	function initPageParams(this: List) {
-// 		let params: { [key: string]: number } = {};
-// 		params[this.pageParamNames[0]] = this.pageStart;
-// 		params[this.pageParamNames[1]] = this.pageSize;
-
-// 		this.isPage && aj.apply(this.lastRequestParam, params);
-// 	}
-// }

package/src/components/widgets/AccordionMenu.vue

@@ -1,138 +0,0 @@
-<template>
-  <ul class="aj-accordion-menu" @click="onClk">
-    <slot></slot>
-  </ul>
-</template>
-
-<script lang="ts">
-/**
- * 内部子菜单的高亮
- *
- * @param ev
- */
-function highlightSubItem(ev: Event) {
-  let li: Element,
-    el: Element = ev.target as Element;
-
-  if (el.tagName == "A" && el.getAttribute("target")) {
-    li = el.parentNode as Element;
-    li.querySelectorAll("li").forEach((_el: Element) => {
-      if (_el == li) _el.classList.add("selected");
-      else _el.classList.remove("selected");
-    });
-  }
-}
-
-export default {
-  methods: {
-    onClk(ev: Event): void {
-      let children: HTMLCollection = this.$el.children;
-      highlightSubItem(ev);
-      let _btn: Element = ev.target as Element;
-
-      if (
-        _btn &&
-        _btn.tagName == "H3" &&
-        (_btn.parentNode as Element).tagName == "LI"
-      ) {
-        _btn = _btn.parentNode as Element;
-
-        for (let btn, i = 0, j = children.length; i < j; i++) {
-          btn = children[i];
-          let ul = btn.querySelector("ul");
-
-          if (btn == _btn) {
-            if (btn.className.indexOf("pressed") != -1) {
-              btn.classList.remove("pressed"); // 再次点击，隐藏！
-              if (ul) ul.style.height = "0px";
-            } else {
-              if (ul) ul.style.height = ul.scrollHeight + "px";
-              btn.classList.add("pressed");
-            }
-          } else {
-            btn.classList.remove("pressed");
-            if (ul) ul.style.height = "0px";
-          }
-        }
-      } else return;
-    },
-  },
-};
-</script>
-
-<style lang="less" scoped>
-// 折叠菜单 Accordion Menu
-.aj-accordion {
-  & > li h3 {
-    cursor: pointer;
-  }
-
-  .pressed {
-    & h3 {
-      color: black;
-    }
-  }
-
-  & > li > ul {
-    .transition (height .5s cubic-bezier(0, 1, 0.5, 1));;
-    overflow: hidden;
-  }
-
-  ul {
-    height: 0;
-  }
-}
-
-.aj-accordion-menu {
-  .aj-accordion ();
-  overflow: hidden;
-
-  & > li {
-    border-top: 1px solid white;
-    border-bottom: 1px solid lightgray;
-
-    &.pressed {
-      border-top: 0;
-      border-bottom: 1px solid lightgray;
-      box-shadow: inset 0px 10px 15px -15px gray;
-
-      h3 {
-        font-weight: bold;
-      }
-    }
-
-    ul {
-      li {
-        // list-style-type: disc;
-        padding-left: 15%;
-
-        a {
-          width: 100%;
-          display: block;
-        }
-
-        &.selected {
-          a {
-            color: black;
-            font-weight: bold;
-          }
-        }
-      }
-    }
-
-    h3,
-    li {
-      padding: 5px 0 5px 15px;
-      letter-spacing: 2px;
-      line-height: 20px;
-      color: #939da8;
-      font-size: 12px;
-
-      &:hover,
-      a:hover {
-        color: black;
-      }
-    }
-  }
-}
-</style>