vue2-client 1.18.12 → 1.18.14

package/src/components/NumberInfo/index.less

@@ -1,55 +1,55 @@
-@import "../index";
-
-@numberInfo-prefix-cls: ~"@{ant-pro-prefix}-number-info";
-
-.@{numberInfo-prefix-cls} {
-
-  .ant-pro-number-info-subtitle {
-    color: @text-color-secondary;
-    font-size: @font-size-base;
-    height: 22px;
-    line-height: 22px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
-    white-space: nowrap;
-  }
-
-  .number-info-value {
-    margin-top: 4px;
-    font-size: 0;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
-    white-space: nowrap;
-
-    & > span {
-      color: @heading-color;
-      display: inline-block;
-      line-height: 32px;
-      height: 32px;
-      font-size: 24px;
-      margin-right: 32px;
-    }
-
-    .sub-total {
-      color: @text-color-secondary;
-      font-size: @font-size-lg;
-      vertical-align: top;
-      margin-right: 0;
-      i {
-        font-size: 12px;
-        transform: scale(0.82);
-        margin-left: 4px;
-      }
-      :global {
-        .anticon-caret-up {
-          color: @red-6;
-        }
-        .anticon-caret-down {
-          color: @green-6;
-        }
-      }
-    }
-  }
+@import "../index";
+
+@numberInfo-prefix-cls: ~"@{ant-pro-prefix}-number-info";
+
+.@{numberInfo-prefix-cls} {
+
+  .ant-pro-number-info-subtitle {
+    color: @text-color-secondary;
+    font-size: @font-size-base;
+    height: 22px;
+    line-height: 22px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    word-break: break-all;
+    white-space: nowrap;
+  }
+
+  .number-info-value {
+    margin-top: 4px;
+    font-size: 0;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    word-break: break-all;
+    white-space: nowrap;
+
+    & > span {
+      color: @heading-color;
+      display: inline-block;
+      line-height: 32px;
+      height: 32px;
+      font-size: 24px;
+      margin-right: 32px;
+    }
+
+    .sub-total {
+      color: @text-color-secondary;
+      font-size: @font-size-lg;
+      vertical-align: top;
+      margin-right: 0;
+      i {
+        font-size: 12px;
+        transform: scale(0.82);
+        margin-left: 4px;
+      }
+      :global {
+        .anticon-caret-up {
+          color: @red-6;
+        }
+        .anticon-caret-down {
+          color: @green-6;
+        }
+      }
+    }
+  }
 }

package/src/components/NumberInfo/index.md

@@ -1,43 +1,43 @@
-# NumberInfo 数据文本
-
-常用在数据卡片中，用于突出展示某个业务数据。
-
-
-
-引用方式：
-
-```javascript
-import NumberInfo from '@vue2-client/components/NumberInfo'
-
-export default {
-    components: {
-        NumberInfo
-    }
-}
-```
-
-
-
-## 代码演示  [demo](https://pro.loacg.com/test/home)
-
-```html
-<number-info
-    :sub-title="() => { return 'Visits this week' }"
-    :total="12321"
-    status="up"
-    :sub-total="17.1"></number-info>
-```
-
-
-
-## API
-
-| 参数       | 说明               | 类型         | 默认值     |
-|----------|------------------|------------|---------|
-| title    | 标题               | ReactNode\ | string  | -
-| subTitle | 子标题              | ReactNode\ | string  | -
-| total    | 总量               | ReactNode\ | string  | -
-| subTotal | 子总量              | ReactNode\ | string  | -
-| status   | 增加状态             | 'up \      | down'   | -
-| theme    | 状态样式             | string     | 'light' |
-| gap      | 设置数字和描述之间的间距（像素） | number     | 8       |
+# NumberInfo 数据文本
+
+常用在数据卡片中，用于突出展示某个业务数据。
+
+
+
+引用方式：
+
+```javascript
+import NumberInfo from '@vue2-client/components/NumberInfo'
+
+export default {
+    components: {
+        NumberInfo
+    }
+}
+```
+
+
+
+## 代码演示  [demo](https://pro.loacg.com/test/home)
+
+```html
+<number-info
+    :sub-title="() => { return 'Visits this week' }"
+    :total="12321"
+    status="up"
+    :sub-total="17.1"></number-info>
+```
+
+
+
+## API
+
+| 参数       | 说明               | 类型         | 默认值     |
+|----------|------------------|------------|---------|
+| title    | 标题               | ReactNode\ | string  | -
+| subTitle | 子标题              | ReactNode\ | string  | -
+| total    | 总量               | ReactNode\ | string  | -
+| subTotal | 子总量              | ReactNode\ | string  | -
+| status   | 增加状态             | 'up \      | down'   | -
+| theme    | 状态样式             | string     | 'light' |
+| gap      | 设置数字和描述之间的间距（像素） | number     | 8       |

package/src/components/card/ChartCard.vue

@@ -1,79 +1,79 @@
-<template>
-  <a-card :loading="loading" :body-style="{padding: '20px 24px 8px'}" :bordered="false">
-    <div class="chart-card-header">
-      <div class="meta">
-        <span class="chart-card-title">{{ title }}</span>
-        <span class="chart-card-action">
-          <slot name="action"></slot>
-        </span>
-      </div>
-      <div class="total"><span>{{ total }}</span></div>
-    </div>
-    <div class="chart-card-content">
-      <div class="content-fix">
-        <slot></slot>
-      </div>
-    </div>
-    <div class="chart-card-footer">
-      <slot name="footer"></slot>
-    </div>
-  </a-card>
-</template>
-
-<script>
-export default {
-  name: 'ChartCard',
-  // eslint-disable-next-line vue/require-prop-types
-  props: ['title', 'total', 'loading']
-}
-</script>
-
-<style scoped lang="less">
-  .chart-card-header{
-    position: relative;
-    overflow: hidden;
-    width: 100%;
-  }
-  .chart-card-header .meta{
-    position: relative;
-    overflow: hidden;
-    width: 100%;
-    color: @text-color-second;
-    font-size: 14px;
-    line-height: 22px;
-  }
-  .chart-card-action{
-    cursor: pointer;
-    position: absolute;
-    top: 0;
-    right: 0;
-  }
-  .total {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    word-break: break-all;
-    white-space: nowrap;
-    margin-top: 4px;
-    margin-bottom: 0;
-    font-size: 30px;
-    line-height: 38px;
-    height: 38px;
-  }
-  .chart-card-footer{
-    border-top: 1px solid @border-color-base;
-    padding-top: 9px;
-    margin-top: 8px;
-  }
-  .chart-card-content{
-    margin-bottom: 12px;
-    position: relative;
-    height: 46px;
-    width: 100%;
-  }
-  .chart-card-content .content-fix{
-    position: absolute;
-    left: 0;
-    bottom: 0;
-    width: 100%;
-  }
-</style>
+<template>
+  <a-card :loading="loading" :body-style="{padding: '20px 24px 8px'}" :bordered="false">
+    <div class="chart-card-header">
+      <div class="meta">
+        <span class="chart-card-title">{{ title }}</span>
+        <span class="chart-card-action">
+          <slot name="action"></slot>
+        </span>
+      </div>
+      <div class="total"><span>{{ total }}</span></div>
+    </div>
+    <div class="chart-card-content">
+      <div class="content-fix">
+        <slot></slot>
+      </div>
+    </div>
+    <div class="chart-card-footer">
+      <slot name="footer"></slot>
+    </div>
+  </a-card>
+</template>
+
+<script>
+export default {
+  name: 'ChartCard',
+  // eslint-disable-next-line vue/require-prop-types
+  props: ['title', 'total', 'loading']
+}
+</script>
+
+<style scoped lang="less">
+  .chart-card-header{
+    position: relative;
+    overflow: hidden;
+    width: 100%;
+  }
+  .chart-card-header .meta{
+    position: relative;
+    overflow: hidden;
+    width: 100%;
+    color: @text-color-second;
+    font-size: 14px;
+    line-height: 22px;
+  }
+  .chart-card-action{
+    cursor: pointer;
+    position: absolute;
+    top: 0;
+    right: 0;
+  }
+  .total {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    word-break: break-all;
+    white-space: nowrap;
+    margin-top: 4px;
+    margin-bottom: 0;
+    font-size: 30px;
+    line-height: 38px;
+    height: 38px;
+  }
+  .chart-card-footer{
+    border-top: 1px solid @border-color-base;
+    padding-top: 9px;
+    margin-top: 8px;
+  }
+  .chart-card-content{
+    margin-bottom: 12px;
+    position: relative;
+    height: 46px;
+    width: 100%;
+  }
+  .chart-card-content .content-fix{
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    width: 100%;
+  }
+</style>

package/src/components/chart/Bar.vue

@@ -1,60 +1,60 @@
-<template>
-  <div class="bar">
-    <h4>{{ title }}</h4>
-    <div class="chart">
-      <v-chart :force-fit="true" height="312" :data="data" :padding="[24, 0, 0, 0]">
-        <v-tooltip />
-        <v-axis />
-        <v-bar position="x*y"/>
-      </v-chart>
-    </div>
-  </div>
-</template>
-
-<script>
-
-const data = []
-for (let i = 0; i < 12; i += 1) {
-  data.push({
-    x: `${i + 1}月`,
-    y: Math.floor(Math.random() * 1000) + 200
-  })
-}
-const tooltip = [
-  'x*y',
-  (x, y) => ({
-    name: x,
-    value: y
-  })
-]
-
-const scale = [{
-  dataKey: 'x',
-  min: 2
-}, {
-  dataKey: 'y',
-  title: '时间',
-  min: 1,
-  max: 22
-}]
-export default {
-  name: 'Bar',
-  // eslint-disable-next-line vue/require-prop-types
-  props: ['title'],
-  data () {
-    return {
-      data,
-      scale,
-      tooltip
-    }
-  }
-}
-</script>
-
-<style scoped lang="less">
-  .bar{
-    position: relative;
-    .chart{
-    }
-  }
-</style>
+<template>
+  <div class="bar">
+    <h4>{{ title }}</h4>
+    <div class="chart">
+      <v-chart :force-fit="true" height="312" :data="data" :padding="[24, 0, 0, 0]">
+        <v-tooltip />
+        <v-axis />
+        <v-bar position="x*y"/>
+      </v-chart>
+    </div>
+  </div>
+</template>
+
+<script>
+
+const data = []
+for (let i = 0; i < 12; i += 1) {
+  data.push({
+    x: `${i + 1}月`,
+    y: Math.floor(Math.random() * 1000) + 200
+  })
+}
+const tooltip = [
+  'x*y',
+  (x, y) => ({
+    name: x,
+    value: y
+  })
+]
+
+const scale = [{
+  dataKey: 'x',
+  min: 2
+}, {
+  dataKey: 'y',
+  title: '时间',
+  min: 1,
+  max: 22
+}]
+export default {
+  name: 'Bar',
+  // eslint-disable-next-line vue/require-prop-types
+  props: ['title'],
+  data () {
+    return {
+      data,
+      scale,
+      tooltip
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+  .bar{
+    position: relative;
+    .chart{
+    }
+  }
+</style>

package/src/components/chart/MiniArea.vue

@@ -1,67 +1,67 @@
-<template>
-  <div class="mini-chart">
-    <div class="chart-content" :style="{height: 46}">
-      <v-chart :force-fit="true" :height="height" :data="data" :padding="[36, 5, 18, 5]">
-        <v-tooltip />
-        <v-smooth-area position="x*y" />
-      </v-chart>
-    </div>
-  </div>
-</template>
-
-<script>
-import { format } from 'date-fns'
-
-const data = []
-const beginDay = new Date().getTime()
-
-const fakeY = [7, 5, 4, 2, 4, 7, 5, 6, 5, 9, 6, 3, 1, 5, 3, 6, 5]
-for (let i = 0; i < fakeY.length; i += 1) {
-  data.push({
-    x: format(new Date(beginDay + 1000 * 60 * 60 * 24 * i), 'yyyy-MM-dd'),
-    y: fakeY[i]
-  })
-}
-
-const tooltip = [
-  'x*y',
-  (x, y) => ({
-    name: x,
-    value: y
-  })
-]
-
-const scale = [{
-  dataKey: 'x',
-  min: 2
-}, {
-  dataKey: 'y',
-  title: '时间',
-  min: 1,
-  max: 22
-}]
-
-export default {
-  name: 'MiniArea',
-  data () {
-    return {
-      data,
-      scale,
-      tooltip,
-      height: 100
-    }
-  }
-}
-</script>
-
-<style scoped>
-  .mini-chart {
-    position: relative;
-    width: 100%
-  }
-  .mini-chart .chart-content{
-    position: absolute;
-    bottom: -28px;
-    width: 100%;
-  }
-</style>
+<template>
+  <div class="mini-chart">
+    <div class="chart-content" :style="{height: 46}">
+      <v-chart :force-fit="true" :height="height" :data="data" :padding="[36, 5, 18, 5]">
+        <v-tooltip />
+        <v-smooth-area position="x*y" />
+      </v-chart>
+    </div>
+  </div>
+</template>
+
+<script>
+import { format } from 'date-fns'
+
+const data = []
+const beginDay = new Date().getTime()
+
+const fakeY = [7, 5, 4, 2, 4, 7, 5, 6, 5, 9, 6, 3, 1, 5, 3, 6, 5]
+for (let i = 0; i < fakeY.length; i += 1) {
+  data.push({
+    x: format(new Date(beginDay + 1000 * 60 * 60 * 24 * i), 'yyyy-MM-dd'),
+    y: fakeY[i]
+  })
+}
+
+const tooltip = [
+  'x*y',
+  (x, y) => ({
+    name: x,
+    value: y
+  })
+]
+
+const scale = [{
+  dataKey: 'x',
+  min: 2
+}, {
+  dataKey: 'y',
+  title: '时间',
+  min: 1,
+  max: 22
+}]
+
+export default {
+  name: 'MiniArea',
+  data () {
+    return {
+      data,
+      scale,
+      tooltip,
+      height: 100
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .mini-chart {
+    position: relative;
+    width: 100%
+  }
+  .mini-chart .chart-content{
+    position: absolute;
+    bottom: -28px;
+    width: 100%;
+  }
+</style>