@lx-frontend/wrap-element-ui 0.4.6-beta.1 → 1.0.0-beta

package/packages/LxTable/src/LxTable.vue

@@ -1,296 +0,0 @@
-<!--
-  @row-click="handleRowClick" 当某一行被点击时会触发该事件
-  @cell-click="handleCellClick" 当某个单元格被点击时会触发该事件
-  @sort-change="sortChange" 排序触发事件
-  sortable 配置排序
-  default-sort: prop默认字段 order排序方式
-  slot='key_header' scopeHeader 支持表头可自定义
-  highlightCurrentRow 单行选中状态
--->
-<template>
-  <div class="table-content">
-    <el-table
-      v-loading="loading"
-      ref="lxTableRef"
-      v-bind="$attrs"
-      :data="tableData"
-      :empty-text="(customConfig || {}).emptyText || ''"
-      @selection-change="handleSelectionChange"
-      @row-click="handleRowClick"
-      @cell-click="handleCellClick"
-      @sort-change="sortChange"
-      :highlight-current-row="highlightCurrentRow"
-      :row-class-name="tableRowClassName"
-      :default-sort="(customConfig || {}).sortValue"
-    >
-      <ElTableColumn
-        v-if="
-          customConfig &&
-            customConfig.selection &&
-            customConfig.selection.isOpenSelection
-        "
-        type="selection"
-        :width="customConfig.selection.width"
-      >
-      </ElTableColumn>
-      <ElTableColumn
-        v-for="(item, index) in cloumns"
-        :key="`${item}_${index}`"
-        :label="item"
-        :prop="keys[index]"
-        :sortable="getFieldFromConfig(keys[index], 'sortable')"
-        :width="getFieldFromConfig(keys[index], 'width')"
-        :min-width="getFieldFromConfig(keys[index], 'minWidth')"
-        :fixed="getFieldFromConfig(keys[index], 'fixed')"
-      >
-        <template #header="scope">
-          <slot
-            template
-            :name="`${keys[index]}_header`"
-            :keys="keys[index]"
-            :row="returnSelf(scope.row)"
-            :lable="scope.column"
-            :column="scope.$index"
-            v-if="getFieldFromConfig(keys[index], 'scopeHeader')"
-          >
-          </slot>
-          <span v-else>
-            {{ item }}
-          </span>
-        </template>
-        <template #default="scope">
-          <!-- 支持keys字段为'car.id'或者'id' -->
-          <!-- @vue-expect-error 这里判断完是数组应该不报ts错误 -->
-          <div
-            v-if="Array.isArray(keys[index]) && keys[index].indexOf('.') != -1"
-          >
-            <!-- 一个td需要展示多个字段名 -->
-            <div v-if="Array.isArray(keys[index])">
-              <div v-for="(array, i) in keys[index]" :key="i">
-                {{ scope.row[array] }}
-              </div>
-            </div>
-            <!-- 字段formatters存在,数据过滤-->
-            <span v-else-if="getFieldFromConfig(keys[index], 'formatters')">
-              <!-- @vue-expect-error 这里判断完是数组应该不报ts错误 -->
-              {{
-                formatterMethods(
-                  scope.row[keys[index].split(".")[0]][
-                    keys[index].split(".")[1]
-                  ],
-                  customConfig[keys[index]].formatters
-                )
-              }}
-            </span>
-            <!-- 复杂情况需要自定义---当前keys存在于customConfig.template数据定义中，传入slot的name作为唯一标识符 -->
-            <slot
-              template
-              :name="keys[index]"
-              :keys="keys[index]"
-              :row="returnSelf(scope.row)"
-              :lable="scope.column"
-              :column="scope.$index"
-              v-else-if="getFieldFromConfig(keys[index], 'template')"
-            >
-            </slot>
-            <div v-else>
-              <!-- 传入不需要截取的列 -->
-              <span v-if="getFieldFromConfig(keys[index], 'templateCutOut')">
-                <!-- @vue-expect-error 忽略ts错误不改动-->
-                {{
-                  formateValue(
-                    scope.row[keys[index].split(".")[0]][
-                      keys[index].split(".")[1]
-                    ]
-                  )
-                }}
-              </span>
-              <!-- @vue-expect-error 忽略ts错误不改动-->
-              <Ellipsis
-                v-else
-                :popoverName="popoverName"
-                :lineCount="getFieldFromConfig(keys[index], 'lineCount')"
-                :content="
-                  formateValue([
-                    `${
-                      scope.row[keys[index].split('.')[0]][
-                        keys[index].split('.')[1]
-                      ]
-                    }`,
-                  ])
-                "
-              >
-                <template #popover>
-                  <div>
-                    <!-- @vue-expect-error 忽略ts错误不改动-->
-                    {{
-                      formateValue(
-                        scope.row[keys[index].split(".")[0]][
-                          keys[index].split(".")[1]
-                        ]
-                      )
-                    }}
-                  </div>
-                </template>
-              </Ellipsis>
-            </div>
-          </div>
-          <div v-else>
-            <!-- 一个td需要展示多个字段名 -->
-            <div v-if="Array.isArray(keys[index])">
-              <div v-for="(array, i) in keys[index]" :key="i">
-                {{ scope.row[array] }}
-              </div>
-            </div>
-            <!-- 字段formatters存在,数据过滤-->
-            <span v-else-if="getFieldFromConfig(keys[index], 'formatters')">
-              <!-- @vue-expect-error 忽略ts错误不改动-->
-              {{
-                formatterMethods(
-                  scope.row[keys[index]],
-                  customConfig[keys[index]].formatters
-                )
-              }}
-            </span>
-            <!-- 复杂情况需要自定义---当前keys存在于customConfig.template数据定义中，传入slot的name作为唯一标识符 -->
-            <slot
-              template
-              :name="keys[index]"
-              :keys="keys[index]"
-              :row="returnSelf(scope.row)"
-              :lable="scope.column"
-              :column="scope.$index"
-              v-else-if="getFieldFromConfig(keys[index], 'template')"
-            >
-            </slot>
-            <div v-else>
-              <!-- 传入不需要截取的列 -->
-              <span v-if="getFieldFromConfig(keys[index], 'templateCutOut')">
-                {{ formateValue(scope.row[keys[index]]) }}
-              </span>
-                   <!-- @vue-expect-error 忽略ts错误不改动-->
-              <Ellipsis
-                v-else
-                :popoverName="popoverName"
-                :lineCount="getFieldFromConfig(keys[index], 'lineCount')"
-                :content="formateValue([`${scope.row[keys[index]]}`])"
-              >
-                <template #popover>
-                  <div>{{ formateValue(scope.row[keys[index]]) }}</div>
-                </template>
-              </Ellipsis>
-            </div>
-          </div>
-        </template>
-      </ElTableColumn>
-    </el-table>
-    <ElPagination
-      @current-change="handleCurrentChange"
-      :background="background"
-      :current-page="currentPage"
-      :page-size="pageSize"
-      :total="totals"
-      layout="total, prev, pager, next, jumper, slot"
-      v-if="currentPage"
-    >
-    </ElPagination>
-  </div>
-</template>
-<script
-  lang="ts"
-  setup
-  generic="K extends (string | number) | (string | number)[], TableData = Record<string, any>"
->
-import Ellipsis from "../../Ellipsis";
-
-const $emit = defineEmits([
-  "handleCurrentChange",
-  "handleSelectionChange",
-  "handleRowClick",
-  "handleCellClick",
-  "sortChange",
-]);
-const props = withDefaults(
-  defineProps<{
-    tableData: TableData[];
-    cloumns: any[];
-    keys: K[];
-    customConfig?: Record<string, any>;
-    stripe?: boolean;
-    loading?: boolean;
-    background?: boolean;
-    totals?: number;
-    pageSize?: number;
-    currentPage?: number;
-    popoverName?: string;
-    highlightCurrentRow?: boolean;
-    tableRowClassName?: Record<string, any>;
-  }>(),
-  {
-    tableData: () => [],
-    cloumns: () => [],
-    keys: () => [],
-    customConfig: () => ({}),
-    stripe: true,
-    loading: true,
-    background: true,
-    highlightCurrentRow: true,
-    tableRowClassName: () => ({}),
-  }
-);
-function returnSelf(data: TableData): TableData {
-  return data;
-}
-const handleCurrentChange = (val: any) => {
-  $emit("handleCurrentChange", val);
-};
-const handleSelectionChange = (val: any) => {
-  $emit("handleSelectionChange", val);
-};
-const handleRowClick = (row: any, column: any, cell: any, event: any) => {
-  $emit("handleRowClick", row, column, cell, event);
-};
-const handleCellClick = (row: any, column: any, cell: any, event: any) => {
-  $emit("handleCellClick", row, column, cell, event);
-};
-const sortChange = (column: any, prop: any, order: any) => {
-  $emit("sortChange", column, prop, order);
-};
-const formatterMethods = (
-  key: number,
-  keyData: { [x: string]: any; unit: string }
-) => {
-  // 返回数据，可类型转换; 可添加单位;
-  let value = "--";
-  if (key || key === 0) {
-    const keyValue = keyData[key] || key;
-    const unit = keyData.unit || "";
-    value = `${keyValue}${unit}`;
-  }
-  return value;
-};
-const formateValue = (val: string | number | string[]) => {
-  if (Array.isArray(val) && (val[0] === "null" || val[0] === "")) {
-    val = "";
-  }
-  return val || val === 0 ? val : "--";
-};
-const getFieldFromConfig = (
-  index: (string | number) | (string | number)[],
-  name: string | number
-) => {
-  if (Array.isArray(index)) return;
-
-  return (
-    props.customConfig &&
-    props.customConfig[index] &&
-    props.customConfig[index][name]
-  );
-};
-</script>
-<style type="scss">
-.table-content .el-pagination {
-  text-align: right;
-  padding: 14px 0;
-}
-</style>

package/packages/PopoverForm/index.js

@@ -1,7 +0,0 @@
-import PopoverForm from './src/PopoverForm.vue'
-
-PopoverForm.install = function (Vue) {
-  Vue.component(PopoverForm.name, PopoverForm)
-}
-
-export default PopoverForm

package/packages/SearchForm/index.js

@@ -1,7 +0,0 @@
-import SearchForm from './src/SearchForm.vue'
-
-SearchForm.install = function (Vue) {
-  Vue.component(SearchForm.name, SearchForm)
-}
-
-export default SearchForm

package/packages/SearchSelect/index.js

@@ -1,7 +0,0 @@
-import SearchSelect from './src/SearchSelect.vue'
-
-SearchSelect.install = function (Vue) {
-  Vue.component(SearchSelect.name, SearchSelect)
-}
-
-export default SearchSelect

package/packages/index.js

@@ -1,59 +0,0 @@
-/**
- * @author Vic
- * Date: 19/03/14
- */
-import DemoComponent from './DemoComponent/index'
-import AuditSteps from './AuditSteps/index'
-import Ellipsis from './Ellipsis/index'
-import SearchForm from './SearchForm/index'
-import LxTable from './LxTable/index'
-import SearchSelect from './SearchSelect/index'
-import AddMembers from './AddMembers/index'
-import PopoverForm from './PopoverForm/index'
-
-
-const components = [
-  DemoComponent,
-  AuditSteps,
-  Ellipsis,
-  SearchForm,
-  LxTable,
-  SearchSelect,
-  AddMembers,
-  PopoverForm
-]
-
-const install = function (Vue) {
-  if (install.installed) return
-  components.map(function(component) {
-    Vue.component(component.name, component)
-  })
-}
-
-if (typeof window !== 'undefined' && window.Vue) {
-  install(window.Vue)
-}
-
-export {
-  install,
-  DemoComponent,
-  AuditSteps,
-  Ellipsis,
-  SearchForm,
-  LxTable,
-  SearchSelect,
-  AddMembers,
-  PopoverForm
-}
-
-export default {
-  install,
-  DemoComponent,
-  AuditSteps,
-  Ellipsis,
-  SearchForm,
-  LxTable,
-  SearchSelect,
-  AddMembers,
-  PopoverForm
-}

package/packages/theme-default/gulpfile.js

@@ -1,25 +0,0 @@
-'use strict';
-
-var gulp = require('gulp');
-var sass = require('gulp-sass');
-var autoprefixer = require('gulp-autoprefixer');
-var cssmin = require('gulp-cssmin');
-
-gulp.task('compile', function() {
-  return gulp.src('./src/*.scss')
-    .pipe(sass.sync())
-    .pipe(autoprefixer({
-      browsers: ['ie > 9', 'last 2 versions'],
-      cascade: false
-    }))
-    .pipe(cssmin())
-    .pipe(gulp.dest('./lib'));
-});
-
-gulp.task('copyfont', function() {
-  return gulp.src('./src/fonts/**')
-    .pipe(cssmin())
-    .pipe(gulp.dest('./lib/fonts'));
-});
-
-gulp.task('build', ['compile', 'copyfont']);

package/packages/theme-default/lib/AuditSteps.css

@@ -1 +0,0 @@
-.audit-steps{width:612px}.audit-steps .el-step__head{display:none}.audit-steps__step-item{min-height:43px;max-height:43px;margin-bottom:35px}.audit-steps__step-item .el-select{width:400px}.audit-steps__step-item .el-icon-delete{margin-left:10px;font-size:16px;cursor:pointer}.audit-steps__step-order{cursor:default;margin-right:8px;position:relative;display:inline-block;text-align:center;width:20px;height:20px;border-radius:50%;border:1px solid #aaa;background:#aaa;color:#fff}.audit-steps__step-order:not(.first):before{position:absolute;content:'';display:block;width:1px;height:60px;background:#aaa;top:-60px;left:50%}.audit-steps__add{margin-top:-10px}

package/packages/theme-default/lib/DemoComponent.css

@@ -1 +0,0 @@
-.demo-component__input{width:30px;border-color:red}

package/packages/theme-default/lib/index.css

@@ -1 +0,0 @@
-.demo-component__input{width:30px;border-color:red}.audit-steps{width:612px}.audit-steps .el-step__head{display:none}.audit-steps__step-item{min-height:43px;max-height:43px;margin-bottom:35px}.audit-steps__step-item .el-select{width:400px}.audit-steps__step-item .el-icon-delete{margin-left:10px;font-size:16px;cursor:pointer}.audit-steps__step-order{cursor:default;margin-right:8px;position:relative;display:inline-block;text-align:center;width:20px;height:20px;border-radius:50%;border:1px solid #aaa;background:#aaa;color:#fff}.audit-steps__step-order:not(.first):before{position:absolute;content:'';display:block;width:1px;height:60px;background:#aaa;top:-60px;left:50%}.audit-steps__add{margin-top:-10px}

package/packages/theme-default/package.json

@@ -1,23 +0,0 @@
-{
-  "name": "wrap-element-ui-theme-default",
-  "version": "0.0.0",
-  "description": "wrap-element-ui component default theme.",
-  "main": "lib/index.css",
-  "scripts": {
-    "dev": "gulp build && gulp watch",
-    "build": "gulp build"
-  },
-  "keywords": [
-    "wrap-element-ui",
-    "theme"
-  ],
-  "author": "Vic",
-  "license": "MIT",
-  "devDependencies": {
-    "gulp": "^3.9.1",
-    "gulp-cssmin": "^0.1.7",
-    "gulp-postcss": "^6.1.1",
-    "postcss-salad": "^1.0.5"
-  },
-  "dependencies": {}
-}

package/packages/theme-default/src/AuditSteps.scss

@@ -1,52 +0,0 @@
-.audit-steps {
-  width: 612px;
-
-  .el-step__head {
-    display: none;
-  }
-
-  &__step-item {
-    min-height: 43px;
-    max-height: 43px;
-    margin-bottom: 35px;
-
-    .el-select {
-      width: 400px;
-    }
-
-    .el-icon-delete {
-      margin-left: 10px;
-      font-size: 16px;
-      cursor: pointer;
-    }
-  }
-
-  &__step-order {
-    cursor: default;
-    margin-right: 8px;
-    position: relative;
-    display: inline-block;
-    text-align: center;
-    width: 20px;
-    height: 20px;
-    border-radius: 50%;
-    border: 1px solid #aaa;
-    background: #aaa;
-    color: #fff;
-
-    &:not(.first):before{
-      position: absolute;
-      content: '';
-      display: block;
-      width: 1px;
-      height: 60px;
-      background: #aaa;
-      top: -60px;
-      left: 50%;
-    }
-  }
-
-  &__add {
-    margin-top: -10px;
-  }
-}

package/packages/theme-default/src/DemoComponent.scss

@@ -1,9 +0,0 @@
-$--test: 30px;
-
-.demo-component {
-
-  &__input {
-    width: $--test;
-    border-color: red;
-  }
-}

package/packages/theme-default/src/index.css

@@ -1,11 +0,0 @@
-@import "button.css";
-@import "row.css";
-@import "col.css";
-@import "icon.css";
-@import "tag.css";
-@import "transiton.css";
-@import "show-more.css";
-@import "limit-textarea.css";
-@import "alert.css";
-@import "loading-bar.css";
-@import "skeleton.css";

package/packages/theme-default/src/index.scss

@@ -1,2 +0,0 @@
-@import "./DemoComponent.scss";
-@import "./AuditSteps.scss";

package/plugins/wrap.js

@@ -1,22 +0,0 @@
-import Vue from 'vue'
-
-export default {
-  install: function (Vue, options) {
-    /* 数字转千分位（支持添加前缀，如"$"） */
-    Vue.filter('toThousands', (num = 0, prefix = '￥') => {
-      num = num.toString()
-      let result = ''
-      while (num.length > 3) {
-        result = ',' + num.slice(-3) + result
-        num = num.slice(0, num.length - 3)
-      }
-      if (num) { result = num + result; }
-      return prefix + result
-    })
-
-    Vue.filter('fenToYuan', (val) => {
-      return val ? (val / 100).toFixed(2) : '--'
-    })
-  }
-}
-

package/postcss.config.js

@@ -1,5 +0,0 @@
-module.exports = {
-  plugins: {
-    autoprefixer: {}
-  }
-}

package/tsconfig.json

@@ -1,41 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "esnext",
-    "module": "esnext",
-    "strict": true,
-    "jsx": "preserve",
-    "importHelpers": true,
-    "moduleResolution": "node",
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "allowJs": true,
-    "sourceMap": true,
-    "baseUrl": ".",
-    "types": [
-      "webpack-env",
-      "jest"
-    ],
-    "paths": {
-      "@/*": [
-        "src/*"
-      ]
-    },
-    "lib": [
-      "esnext",
-      "dom",
-      "dom.iterable",
-      "scripthost"
-    ]
-  },
-  "include": [
-    "src/**/*.ts",
-    "src/**/*.js",
-    "src/**/*.tsx",
-    "src/**/*.vue",
-    "tests/**/*.ts",
-    "tests/**/*.tsx"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
-}