plain-design 1.0.0-beta.12 → 1.0.0-beta.121

package/src/pages/data/mock.database.js

@@ -1,43 +0,0 @@
-/*
-const fs = require('fs')
-const path = require('path')
-const mock = require('mockjs').mock
-
-const createGeneratoe = (options) => {
-    const {length} = options
-    return () => {
-        return options[Math.floor(Math.random() * length)]
-    }
-}
-
-const nextFlag = createGeneratoe(['Y', 'N'])
-const nextSelect = createGeneratoe(['potential', 'store', 'consumer'])
-
-function generate() {
-    const data = (mock({
-        [`array|${100}`]: [
-            {
-                id: '@guid',
-                created_at: '@datetime',
-                created_by: '@first',
-                updated_at: '@datetime',
-                updated_by: '@first',
-                normal_text: '@first',
-                long_text: '@paragraph',
-                'number_val|1-100': 100,
-                flag: nextFlag,
-                select_val: nextSelect,
-                color_val: '@color',
-                date_val: '@datetime',
-                time_val: '@time',
-                parent_id: '',
-                image_id: '',
-            }
-        ]
-    })).array;
-
-    fs.writeFileSync(path.resolve(__dirname, `./demo.json`), JSON.stringify(data, null, 2,))
-}
-
-generate()
-*/

package/src/pages/data/mock.js

@@ -1,141 +0,0 @@
-const fs = require('fs');
-const path = require('path');
-const { mock, Random } = require('mockjs');
-
-function generate() {
-  [
-    { file: 'data-50.json', num: 50 },
-    // { file: 'data-200.json', num: 200 },
-    // { file: 'data-2000.json', num: 2000 },
-  ].forEach((item) => {
-
-    const statusOptions = ['primary', 'success', 'warn', 'error', 'secondary'];
-
-    const getRandomStatusList = () => {
-      const count = Math.ceil(Math.random() * 3);
-      const array = [];
-      while (array.length < count) {
-        const index = parseInt(Math.random() * statusOptions.length - 1);
-        const item = statusOptions[index];
-        if (array.indexOf(item) === -1) {
-          array.push(item);
-        }
-      }
-      return array;
-    };
-
-    const getRandomDateList = () => {
-      const count = Math.ceil(Math.random() * 3);
-      const array = [];
-      while (array.length < count) {
-        const value = Random.date();
-        if (array.indexOf(value) === -1) {
-          array.push(value);
-        }
-      }
-      return array;
-    };
-
-    fs.writeFileSync(path.resolve(__dirname, `./${item.file}`), JSON.stringify(
-      (() => {
-        const { array } = (mock({
-          [`array|${item.num}`]: [
-            {
-              "id|+1": 0,
-              color: '@color',
-              name: '@first',
-              "star|0-10": 5,
-              "flag": () => Math.random() > 0.5 ? 'Y' : 'N',
-              "size|40-80": 60,
-              addr: '@county(true)',
-              url: '@url',
-              domain: '@domain',
-              protocol: '@protocol',
-              email: '@email',
-              ip: '@ip',
-
-              tel: (() => {
-                const prefix = ['139', '136', '132', '181', '172', '191'];
-                const getNumber = () => {
-                  let arr = [];
-                  while (arr.length < 8) {
-                    arr.push(parseInt(Math.random() * 9));
-                  }
-                  return arr.join('');
-                };
-                return () => {
-                  let randomPrefix = Math.min(Math.floor(Math.random() * prefix.length), prefix.length - 1);
-                  return prefix[randomPrefix] + getNumber();
-                };
-              })(),
-              'num|0-999999': 0,
-              'float|0-1000.2': 0,
-              'percent|0.4': 0,
-
-              status: () => statusOptions[parseInt(Math.random() * statusOptions.length - 1)],
-              statusList: getRandomStatusList,
-              statusArrayJson: () => JSON.stringify(getRandomStatusList()),
-              statusArrayString: () => getRandomStatusList().join(','),
-
-              date: '@date',
-              dateList: getRandomDateList,
-              dateArrayJson: () => JSON.stringify(getRandomDateList()),
-              dateArrayString: () => getRandomDateList().join(','),
-            }
-          ]
-        }));
-        array.forEach(item => {
-          /*dateNumber测试值格式化*/
-          item.dateNumber = item.date.replace(/-/g, '');
-
-          /*startDate以及endDate测试日期范围*/
-          const startDate = Random.date();
-          let endDateObj = new Date(new Date(startDate.replace(/-/g, '/')).getTime() + (24 * 60 * 60 * 1000) * (parseInt(Math.random() * 500)));
-          const endDate = `${endDateObj.getFullYear()}-${String(endDateObj.getMonth() + 1).padStart(2, '0')}-${String(endDateObj.getDate()).padStart(2, '0')}`;
-          item.startDate = startDate;
-          item.endDate = endDate;
-
-          /*startDatetime以及endDatetime测试日期时间范围*/
-          const startDatetime = `${Random.date()} ${Random.time()}`;
-          endDateObj = new Date(new Date(startDatetime.replace(/-/g, '/')).getTime() + parseInt(Math.random() * 864000000));
-          item.startDatetime = startDatetime;
-          item.endDatetime = [
-            endDateObj.getFullYear(),
-            endDateObj.getMonth() + 1,
-            endDateObj.getDate(),
-          ].map(i => String(i).padStart(2, '0')).join('-') + ' ' + [
-            endDateObj.getHours(),
-            endDateObj.getMinutes(),
-            endDateObj.getSeconds(),
-          ].map(i => String(i).padStart(2, '0')).join(':');
-
-          /*测试time*/
-          item.time = Random.time();
-          item.timeNumber = item.time.replace(/:/g, '');
-
-          /*startTime以及endTime测试时间范围*/
-          let dateObj = new Date();
-          const [hour, minute, second] = item.time.split(':');
-          dateObj.setHours(hour);
-          dateObj.setMinutes(minute);
-          dateObj.setSeconds(second);
-          const startTimestamp = dateObj.getTime();
-          dateObj.setHours(23);
-          dateObj.setMinutes(59);
-          dateObj.setSeconds(59);
-          const endTimestamp = dateObj.getTime();
-          item.startTime = item.time;
-          dateObj = new Date((Math.random() * (endTimestamp - startTimestamp)) + startTimestamp);
-          item.endTime = [dateObj.getHours(), dateObj.getMinutes(), dateObj.getSeconds()].map(i => String(i).padStart(2, '0')).join(':');
-
-        });
-        return array;
-      })(),
-      null,
-      2,
-    ))
-    ;
-  });
-}
-
-generate();

package/src/pages/data/tree.data.json

@@ -1,87 +0,0 @@
-[
-  {
-    "id": "1",
-    "name": "浙江省 1",
-    "subs": [
-      {
-        "id": "1-1",
-        "name": "杭州市 1-1",
-        "subs": [
-          {
-            "id": "1-1-1",
-            "name": "西湖区 1-1-1"
-          }
-        ]
-      },
-      {
-        "id": "1-2",
-        "name": "宁波市 1-2",
-        "subs": []
-      },
-      {
-        "id": "1-3",
-        "name": "温州市 1-3"
-      }
-    ]
-  },
-  {
-    "id": "2",
-    "name": "福建省 2",
-    "subs": [
-      {
-        "id": "2-1",
-        "name": "厦门市 2-1",
-        "subs": [
-          {
-            "id": "2-1-1",
-            "name": "思明区 2-1-1"
-          }
-        ]
-      },
-      {
-        "id": "2-2",
-        "name": "宁德市 2-2",
-        "subs": [
-          {
-            "id": "2-2-1",
-            "name": "蕉城区 2-2-1"
-          },
-          {
-            "id": "2-2-2",
-            "name": "古田县 2-2-2"
-          }
-        ]
-      }
-    ]
-  },
-  {
-    "id": "3",
-    "name": "四川省 3",
-    "subs": [
-      {
-        "id": "3-1",
-        "name": "成都市 3-1",
-        "subs": [
-          {
-            "id": "3-1-1",
-            "name": "武侯区 3-1-1"
-          },
-          {
-            "id": "3-1-2",
-            "name": "都江堰市 3-1-2"
-          }
-        ]
-      },
-      {
-        "id": "3-2",
-        "name": "泸州市 3-2",
-        "subs": [
-          {
-            "id": "3-2-1",
-            "name": "泸县 3-2-1"
-          }
-        ]
-      }
-    ]
-  }
-]

package/src/pages/env/config/local.js

@@ -1,3 +0,0 @@
-module.exports = {
-  baseURL: 'http://localhost:7001',
-};

package/src/pages/env/config/prod.js

@@ -1,3 +0,0 @@
-module.exports = {
-  baseURL: 'http://1.116.13.72:7001',
-};

package/src/pages/env/config/undefined.js

@@ -1 +0,0 @@
-module.exports = {};

package/src/pages/env/env.d.ts

@@ -1,4 +0,0 @@
-declare const APP_ENV: {
-  baseURL: string,
-  secret_key: string,
-};

package/src/pages/env/index.ts

@@ -1 +0,0 @@
-export const env = APP_ENV;

package/src/pages/history/createHistory.ts

@@ -1,94 +0,0 @@
-import qs from 'qs';
-import {HistoryUtils, iChangeListener, iHistoryConfig, iHistoryHandler, iHistoryMeta} from "./history.utils";
-
-export function createHistoryCreator(handler: iHistoryHandler) {
-  return ({ base }: iHistoryConfig) => {
-
-    if (!base) {base = '/';}
-    if (base.charAt(0) !== '/') {base = `/${base}`;}
-
-    const utils = {
-      getMeta: (url: string): iHistoryMeta => {
-        url = handler.getPath(url);
-        if (url.charAt(0) !== '/') {url = `/${url}`;}
-        if (url.indexOf(base) === 0) {url = url.slice(base.length);}
-        return HistoryUtils.decodePath(url);
-      }
-    };
-
-    const historyState = { route: utils.getMeta(HistoryUtils.getLocationMeta().fullPath), };
-
-    const methods = {
-      push: (path: string, query?: Record<string, any>, hash?: string) => {
-        let url = path;
-        if (!!query) {
-          url += '?' + qs.stringify(query);
-        }
-        if (!!hash) {
-          url += '#' + hash;
-        }
-        handler.push(HistoryUtils.pathJoin(base, url));
-      },
-      back: () => {window.history.back();},
-      onPathChange: (() => {
-
-        let listeners: iChangeListener[] = [];
-
-        const oldPushState = window.history.pushState;
-
-        function newPushState(state: any, title: string, path: string) {
-          const meta = utils.getMeta(path);
-          if (meta.fullPath === historyState.route.fullPath) {return; }
-          historyState.route = meta;
-          listeners.forEach(fn => fn(meta));
-          return oldPushState.apply(window.history, [state, title, path]);
-        }
-
-        window.history.pushState = newPushState;
-
-        window.addEventListener('popstate', () => {
-          const meta = utils.getMeta(HistoryUtils.getLocationMeta().fullPath);
-          historyState.route = meta;
-          listeners.forEach(fn => fn(meta));
-        });
-
-        return (listener: iChangeListener) => {
-          listeners.push(listener);
-          return () => {
-            const index = listeners.indexOf(listener);
-            index > -1 && listeners.splice(index, 1);
-          };
-        };
-      })(),
-    };
-
-    return {
-      state: historyState,
-      ...methods,
-    };
-  };
-}
-
-export const createHashHistory = createHistoryCreator(({
-  getPath: (path: string) => {
-    const separatorIndex = path.indexOf('#');
-    if (separatorIndex === -1) {
-      return "";
-    }
-    return path.slice(separatorIndex + 1);
-  },
-  push: (path) => {
-    const url = new URL(window.location.href);
-    url.hash = path;
-    window.history.pushState({}, '', `${url.pathname}${url.search}${url.hash}`);
-  },
-}));
-
-export const createBrowserHistory = createHistoryCreator(({
-  getPath: (path: string) => {
-    return path;
-  },
-  push: (path) => {
-    window.history.pushState({}, '', path);
-  },
-}));

package/src/pages/history/history.utils.ts

@@ -1,64 +0,0 @@
-import qs from "qs";
-
-export const HistoryUtils = (() => {
-
-  const pathJoin = (...paths: (string | null | undefined)[]) => {
-    let ret = paths.map((path, index) => {
-      if (!path) {return index === 0 ? paths.length > 0 ? '' : '/' : '';}
-      if (path.charAt(0) !== '/' && path.indexOf('http') !== 0) {path = '/' + path;}
-      if (path.charAt(path.length - 1) == '/') {path = path.slice(0, -1);}
-      return path;
-    }).join('');
-    if (!ret) {
-      ret = '/';
-    }
-    return ret;
-  };
-
-  const decodePath = (url: string): { fullPath: string, path: string, hash: string, query: any } => {
-    if (url.charAt(0) !== '/') {url = `/${url}`;}
-    let path = "";
-    let hash = "";
-    let queryString = "";
-    const [leftPart1, rightPart1] = url.split('?');
-    path = leftPart1;
-    if (!!rightPart1) {
-      const [leftPart2, rightPart2] = rightPart1.split('#');
-      queryString = leftPart2;
-      hash = decodeURIComponent(rightPart2);
-    }
-    return { fullPath: decodeURIComponent(url), path, hash, query: !queryString ? {} : qs.parse(queryString) };
-  };
-
-  const getLocationMeta = () => {
-    const { pathname, search, hash } = new URL(window.location.href);
-    const fullPath = `${pathname}${search}${hash}`;
-    return { pathname, search, hash, fullPath };
-  };
-
-  return {
-    pathJoin,
-    decodePath,
-    getLocationMeta,
-  };
-})();
-
-export interface iHistoryConfig {
-  base: string,                     // publicPath部署路径
-}
-
-export interface iHistoryMeta {
-  fullPath: string,                 // 全路径地址
-  path: string,                     // 当前路径
-  hash?: string,                    // 哈希值
-  query?: Record<string, any>,      // 查询参数
-}
-
-export interface iHistoryHandler {
-  getPath: (path: string) => string;// 从全路径中取出来需要解析成meta的字符串。hash路由解析的时候仅需要全路径中的hash
-  push: (url: string) => void,      // 具体的push动作
-}
-
-export interface iChangeListener {
-  (meta: iHistoryMeta): void;       // 监听器函数类型
-}

package/src/pages/index/App.tsx

@@ -1,17 +0,0 @@
-import {designPage} from 'plain-design-composition';
-import './app.scss';
-import {AppHome} from "./home/AppHome";
-import {DemoRowController} from "./Demo/DemoRowController";
-import {Application, ClientZoom, PageThemeUtils} from "../../packages";
-
-PageThemeUtils.state.zoom != null && ClientZoom.set(PageThemeUtils.state.zoom);
-
-export const App = designPage(() => {
-  return () => (
-    <DemoRowController>
-      <Application configuration={PageThemeUtils.configuration.value}>
-        <AppHome/>
-      </Application>
-    </DemoRowController>
-  );
-});

package/src/pages/index/Demo/DemoLine.tsx

@@ -1,23 +0,0 @@
-import {designComponent} from "plain-design-composition";
-
-export const DemoLine = designComponent({
-  name: 'demo-line',
-  props: {
-    title: { type: String },
-    labelWidth: { type: String },
-  },
-  slots: ['default'],
-  setup({ props, slots }) {
-
-    return {
-      render: () => (
-        <div className="demo-line">
-          {!!props.title && <div className="demo-line-title"><span>{props.title}</span></div>}
-          <div className="demo-line-content">
-            {slots.default()}
-          </div>
-        </div>
-      )
-    };
-  },
-});

package/src/pages/index/Demo/DemoRow.scss

@@ -1,128 +0,0 @@
-.demo-row {
-
-  border-bottom: dashed 1px var(--app-border-color);
-  padding-bottom: 40px;
-
-  & + .demo-row {
-    margin-top: 40px;
-  }
-
-  .demo-row-title {
-    font-size: 14px;
-    color: plv(text-2);
-    padding-bottom: 40px;
-    position: relative;
-
-    span {
-      cursor: pointer;
-    }
-
-    .demo-row-icon-expand {
-      position: absolute;
-      color: var(--primary-6);
-      right: calc(100% + 12px);
-      height: 1em;
-      line-height: 1em;
-    }
-  }
-
-  .demo-row-content {
-    font-size: 14px;
-    color: plv(text-2);
-
-    & > *:not(.demo-line) {
-      margin-right: 8px;
-    }
-  }
-
-  &:not(.demo-row-show) {
-    padding-bottom: 0;
-  }
-
-  &.demo-row-group {
-    background-color: plv(background-color);
-    box-shadow: none;
-
-    & > .demo-row-title {
-      background-color: plv(background-color);
-    }
-
-    & > .demo-row-content {
-      padding: 8px 12px;
-    }
-  }
-}
-
-.demo-line {
-  margin-bottom: 6px;
-
-  .demo-line-title {
-    display: block;
-    font-size: 12px;
-    color: #606266;
-    padding: 8px 9px 8px 0;
-    position: relative;
-
-    &:after {
-      position: absolute;
-      bottom: 50%;
-      border-top: 1px dashed plv(border-color);
-      content: '';
-      left: 0;
-      right: 0;
-    }
-
-    span {
-      background: plv(background-lite);
-      position: relative;
-      z-index: 1;
-      padding: 0 12px;
-      font-weight: bold;
-      text-transform: uppercase;
-    }
-  }
-
-  .demo-line-content {
-    display: inline-block;
-
-    & > * {
-      margin-right: 8px !important;
-    }
-  }
-}
-
-.demo-row-collector-operator {
-  position: fixed;
-  bottom: 20px;
-  right: 20px;
-  display: flex;
-  align-items: center;
-
-  & > div {
-    padding: 8px 16px;
-    background-color: plv(background-color);
-    border: solid 1px var(--app-border-color);
-    font-size: 12px;
-    cursor: pointer;
-    color: plv(text-2);
-
-    &:first-child {
-      border-right: none;
-      border-bottom-left-radius: 2px;
-      border-top-left-radius: 2px;
-    }
-
-    &:last-child {
-      border-bottom-right-radius: 2px;
-      border-top-right-radius: 2px;
-    }
-
-    & > span {
-      margin-right: 6px;
-    }
-
-    &:active {
-      background-color: plv(background-hover);
-    }
-  }
-}

package/src/pages/index/Demo/DemoRow.tsx

@@ -1,71 +0,0 @@
-import {designComponent, reactive, useClasses} from "plain-design-composition";
-import './DemoRow.scss';
-import {DemoRowCollector} from "./DemoRowController";
-import {DemoRowCache} from "./DemoRow.utils";
-import {$nav} from "../nav/$nav";
-import {Icon} from "../../../packages";
-
-export const DemoRow = designComponent({
-  name: 'demo-row',
-  props: {
-    title: { type: String },
-    group: { type: Boolean },
-  },
-  emits: {
-    change: (val: boolean) => true
-  },
-  slots: ['default'],
-  provideRefer: true,
-  setup({ props, slots, event }) {
-
-    DemoRowCollector.child();
-
-    const demoRow = DemoRow.use.inject(null) as { props: { title?: string } } | null;
-
-    const id = [$nav.state.route.path, !!demoRow ? demoRow.props.title : '', props.title].filter(Boolean).join(' >> ');
-
-    const state = reactive({
-      show: DemoRowCache.get(id),
-    });
-
-    const methods = {
-      set(val: boolean) {
-        state.show = val;
-        DemoRowCache.set(id, state.show);
-        event.emit.change(state.show);
-      },
-    };
-
-    const handler = {
-      clickTitle: () => {
-        methods.set(!state.show);
-      }
-    };
-
-    const classes = useClasses(() => ['demo-row', { 'demo-row-show': state.show, 'demo-row-group': props.group }]);
-
-    return {
-      refer: {
-        id,
-        state,
-        methods,
-        props,
-      },
-      render: () => (
-        <div className={classes.value}>
-          {!!props.title && (
-            <div className="demo-row-title">
-              <Icon icon={state.show ? 'pi-caret-down' : 'pi-caret-right'} className="demo-row-icon-expand"/>
-              <span onClick={handler.clickTitle}>{props.title}</span>
-            </div>
-          )}
-          {state.show && (
-            <div className="demo-row-content">
-              {slots.default()}
-            </div>
-          )}
-        </div>
-      )
-    };
-  },
-});