@10yun/cv-mobile-ui 0.5.53 → 0.5.55

package/uview-plus/components/u-datetime-picker/u-datetime-picker.vue

@@ -498,5 +498,30 @@ export default {
 };
 </script>
 <style scoped>
-@import './style.css';
+.u-datetime-picker {
+  flex: 1;
+}
+.u-datetime-picker__has-input {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  /* #ifndef APP-NVUE */
+  width: 100%;
+  /* #endif */
+}
+.u-datetime-picker__has-input .input-cover {
+  opacity: 0;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  border-radius: 4px;
+  border: 1px solid #eee;
+  padding: 0 10px;
+}
 </style>

package/uview-plus/components/u-divider/u-divider.vue

@@ -74,5 +74,21 @@ export default {
 };
 </script>
 <style scoped>
-@import './style.css';
+.u-divider {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  flex-direction: row;
+  flex-direction: row;
+  align-items: center;
+  margin: 15px 0;
+}
+.u-divider__text {
+  margin: 0 15px;
+}
+.u-divider__dot {
+  font-size: 12px;
+  margin: 0 12px;
+  color: #c0c4cc;
+}
 </style>

package/uview-plus/components/u-dragsort/u-dragsort.vue

@@ -306,5 +306,44 @@ export default {
 };
 </script>
 <style scoped>
-@import './style.css';
+.u-dragsort {
+  width: 100%;
+}
+.u-dragsort .u-dragsort-area {
+  width: 100%;
+  position: relative;
+}
+.u-dragsort .u-dragsort-item {
+  position: absolute;
+  width: 100%;
+}
+.u-dragsort .u-dragsort-item.dragging {
+  z-index: 1000;
+  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
+}
+.u-dragsort .u-dragsort-item .u-dragsort-item-content {
+  padding: 0px;
+  text-align: center;
+  box-sizing: border-box;
+  padding-bottom: 6px;
+  border-radius: 8rpx;
+  transition: all 0.3s ease;
+}
+.u-dragsort.u-dragsort--horizontal .u-dragsort-area {
+  display: flex;
+  white-space: nowrap;
+  height: auto;
+}
+.u-dragsort.u-dragsort--horizontal .u-dragsort-item {
+  display: flex;
+  width: auto;
+  height: 100%;
+}
+.u-dragsort.u-dragsort--all .u-dragsort-area {
+  height: auto;
+}
+.u-dragsort.u-dragsort--all .u-dragsort-item {
+  width: auto;
+  height: auto;
+}
 </style>

package/uview-plus/components/u-dropdown/u-dropdown.vue

@@ -212,5 +212,70 @@ export default {
 };
 </script>
 <style scoped>
-@import './style.css';
+.u-dropdown {
+  flex: 1;
+  width: 100%;
+  position: relative;
+}
+.u-dropdown__menu {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  flex-direction: row;
+  position: relative;
+  z-index: 11;
+  height: 80rpx;
+}
+.u-dropdown__menu__item {
+  flex: 1;
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+}
+.u-dropdown__menu__item .u-flex-row {
+  flex-direction: row;
+}
+.u-dropdown__menu__item__text {
+  font-size: 28rpx;
+  color: var(--u-content-color);
+}
+.u-dropdown__menu__item__arrow {
+  margin-left: 6rpx;
+  transition: transform 0.3s;
+  align-items: center;
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  flex-direction: row;
+}
+.u-dropdown__menu__item__arrow--rotate {
+  transform: rotate(180deg);
+}
+.u-dropdown__content {
+  position: absolute;
+  z-index: 8;
+  width: 100%;
+  left: 0px;
+  bottom: 0;
+  overflow: hidden;
+}
+.u-dropdown__content__mask {
+  position: absolute;
+  z-index: 9;
+  background: rgba(0, 0, 0, 0.3);
+  width: 100%;
+  left: 0;
+  top: 0;
+  bottom: 0;
+}
+.u-dropdown__content__popup {
+  position: relative;
+  z-index: 10;
+  transition: transform 0.3s;
+  transform: translate3D(0, -100%, 0);
+  overflow: hidden;
+}
 </style>

package/uview-plus/components/u-dropdown-item/u-dropdown-item.vue

@@ -122,5 +122,7 @@ export default {
 };
 </script>
 <style scoped>
-@import './style.css';
+.u-dropdown-item__scroll {
+  background: #ffffff;
+}
 </style>

package/{ui-fireui → uview-plus}/components/u-dropdown-list/u-dropdown-list.vue

@@ -14,7 +14,7 @@
 
 <script>
 export default {
-  name: 'fuiDropdownList',
+  name: 'upDropdownList',
   props: {
     //控制显示
     show: {

package/uview-plus/components/u-empty/u-empty.vue

@@ -27,7 +27,7 @@ import { props } from './props';
 import { mpMixin } from '../../libs/mixin/mpMixin';
 import { mixin } from '../../libs/mixin/mixin';
 import { addUnit, addStyle, deepMerge } from '../../libs/function/index';
-import { t } from '../../libs/i18n';
+// import { t } from '../../libs/i18n';
 /**
  * empty 内容为空
  * @description 该组件用于需要加载内容，但是加载的第一页数据就为空，提示一个"没有内容"的场景， 我们精心挑选了十几个场景的图标，方便您使用。
@@ -55,36 +55,21 @@ export default {
   data() {
     return {
       icons: {
-        //car: t('up.empty.car'),
-        //page: t('up.empty.page'),
-        //search: t('up.empty.search'),
-        //address: t('up.empty.address'),
-        //wifi: t('up.empty.wifi'),
-        //order: t('up.empty.order'),
-        //coupon: t('up.empty.coupon'),
-        //favor: t('up.empty.favor'),
-        //permission: t('up.empty.permission'),
-        //history: t('up.empty.history'),
-        //news: t('up.empty.news'),
-        //message: t('up.empty.message'),
-        //list: t('up.empty.list'),
-        //data: t('up.empty.data'),
-        //comment: t('up.empty.comment')
-        car: '购物车为空',
-        page: '页面不存在',
-        search: '没有搜索结果',
-        address: '没有收货地址',
-        wifi: '没有WiFi',
-        order: '订单为空',
-        coupon: '没有优惠券',
-        favor: '暂无收藏',
-        permission: '无权限',
-        history: '无历史记录',
-        news: '无新闻列表',
-        message: '消息列表为空',
-        list: '列表为空',
-        data: '数据为空',
-        comment: '暂无评论'
+        car: '购物车为空', // t('up.empty.car'),
+        page: '页面不存在', // t('up.empty.page'),
+        search: '没有搜索结果', // t('up.empty.search'),
+        address: '没有收货地址', // t('up.empty.address'),
+        wifi: '没有WiFi', // t('up.empty.wifi'),
+        order: '订单为空', // t('up.empty.order'),
+        coupon: '没有优惠券', // t('up.empty.coupon'),
+        favor: '暂无收藏', // t('up.empty.favor'),
+        permission: '无权限', // t('up.empty.permission'),
+        history: '无历史记录', // t('up.empty.history'),
+        news: '无新闻列表', // t('up.empty.news'),
+        message: '消息列表为空', // t('up.empty.message'),
+        list: '列表为空', // t('up.empty.list'),
+        data: '数据为空', // t('up.empty.data'),
+        comment: '暂无评论' // t('up.empty.comment')
       }
     };
   },
@@ -139,5 +124,31 @@ export default {
 };
 </script>
 <style scoped>
-@import './style.css';
+.u-empty {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  flex-direction: row;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+.u-empty__text {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  margin-top: 20rpx;
+}
+.u-slot-wrap {
+  /* #ifndef APP-NVUE */
+  display: flex;
+  /* #endif */
+  flex-direction: row;
+  justify-content: center;
+  align-items: center;
+  margin-top: 20rpx;
+}
 </style>

package/{ui-fireui copy/components/u-fab/u-fab.vue → uview-plus/components/u-fab/u-fab.vue}

@@ -52,7 +52,7 @@
 <script>
 //拓展出来的按钮不应多于6个，否则违反了作为悬浮按钮的快速、高效的原则
 export default {
-  name: 'fuiFab',
+  name: 'upFab',
   props: {
     //rpx 为0时值为auto
     left: {

package/uview-plus/components/u-float-button/u-float-button.vue

@@ -160,5 +160,19 @@ export default {
 };
 </script>
 <style scoped>
-@import './style.css';
+.u-float-button {
+  z-index: 999;
+}
+.u-float-button .show-list {
+  transform: rotate(45deg);
+}
+.u-float-button__list {
+  position: absolute;
+  bottom: 0px;
+  display: flex;
+  flex-direction: column;
+}
+.u-float-button__list > view {
+  margin: 5px 0px;
+}
 </style>

package/{ui-fireui → uview-plus}/components/u-footer/u-footer.vue

@@ -29,7 +29,7 @@
 
 <script>
 export default {
-  name: 'fuiFooter',
+  name: 'upFooter',
   props: {
     //type target url delta appid path extradata bindsuccess bindfail text color size
     //链接设置  数据格式对应上面注释的属性值

package/uview-plus/components/u-form-base/form.js

@@ -0,0 +1,22 @@
+/*
+ * @Author       : LQ
+ * @Description  :
+ * @version      : 1.0
+ * @Date         : 2021-08-20 16:44:21
+ * @LastAuthor   : LQ
+ * @lastTime     : 2021-08-20 17:03:49
+ * @FilePath     : /u-view2.0/uview-ui/libs/config/props/form.js
+ */
+export default {
+    // form 组件
+    form: {
+        model: {},
+        rules: {},
+        errorType: 'message',
+        borderBottom: true,
+        labelPosition: 'left',
+        labelWidth: 45,
+        labelAlign: 'left',
+        labelStyle: {}
+    }
+}

package/uview-plus/components/u-form-base/props.js

@@ -0,0 +1,47 @@
+import { defineMixin } from '../../libs/vue';
+import defProps from '../../libs/config/props.js';
+export const props = defineMixin({
+  props: {
+    // 当前form的需要验证字段的集合
+    model: {
+      type: Object,
+      default: () => defProps.form.model
+    },
+    // 验证规则
+    rules: {
+      type: [Object, Function, Array],
+      default: () => defProps.form.rules
+    },
+    // 有错误时的提示方式，message-提示信息，toast-进行toast提示
+    // border-bottom-下边框呈现红色，none-无提示
+    errorType: {
+      type: String,
+      default: () => defProps.form.errorType
+    },
+    // 是否显示表单域的下划线边框
+    borderBottom: {
+      type: Boolean,
+      default: () => defProps.form.borderBottom
+    },
+    // label的位置，left-左边，top-上边
+    labelPosition: {
+      type: String,
+      default: () => defProps.form.labelPosition
+    },
+    // label的宽度，单位px
+    labelWidth: {
+      type: [String, Number],
+      default: () => defProps.form.labelWidth
+    },
+    // lable字体的对齐方式
+    labelAlign: {
+      type: String,
+      default: () => defProps.form.labelAlign
+    },
+    // lable的样式，对象形式
+    labelStyle: {
+      type: Object,
+      default: () => defProps.form.labelStyle
+    }
+  }
+});

package/uview-plus/components/u-form-base/u-form.vue

@@ -0,0 +1,243 @@
+<template>
+  <view class="u-form">
+    <slot />
+  </view>
+</template>
+<script>
+import { props } from './props.js';
+import { mpMixin } from '../../libs/mixin/mpMixin';
+import { mixin } from '../../libs/mixin/mixin';
+import Schema from '../../libs/util/async-validator';
+import { toast, getProperty, setProperty, deepClone, error } from '../../libs/function/index';
+import test from '../../libs/function/test';
+// 去除警告信息
+Schema.warning = function () {};
+/**
+ * Form 表单
+ * @description 此组件一般用于表单场景，可以配置Input输入框，Select弹出框，进行表单验证等。
+ * @tutorial https://uview-plus.jiangruyi.com/components/form.html
+ * @property {Object}						model			当前form的需要验证字段的集合
+ * @property {Object | Function | Array}	rules			验证规则
+ * @property {String}						errorType		错误的提示方式，见上方说明 ( 默认 message )
+ * @property {Boolean}						borderBottom	是否显示表单域的下划线边框   ( 默认 true ）
+ * @property {String}						labelPosition	表单域提示文字的位置，left-左侧，top-上方 ( 默认 'left' ）
+ * @property {String | Number}				labelWidth		提示文字的宽度，单位px  ( 默认 45 ）
+ * @property {String}						labelAlign		lable字体的对齐方式   ( 默认 ‘left' ）
+ * @property {Object}						labelStyle		lable的样式，对象形式
+ * @example <up-form labelPosition="left" :model="model1" :rules="rules" ref="form1"></up-form>
+ */
+export default {
+  name: 'u-form-base',
+  mixins: [mpMixin, mixin, props],
+  provide() {
+    return {
+      uForm: this
+    };
+  },
+  data() {
+    return {
+      formRules: {},
+      // 规则校验器
+      validator: {},
+      // 原始的model快照，用于resetFields方法重置表单时使用
+      originalModel: null
+    };
+  },
+  watch: {
+    // 监听规则的变化
+    rules: {
+      immediate: true,
+      handler(n) {
+        this.setRules(n);
+      }
+    },
+    // 监听属性的变化，通知子组件u-form-item重新获取信息
+    propsChange(n) {
+      if (this.children?.length) {
+        this.children.map((child) => {
+          // 判断子组件(u-form-item)如果有updateParentData方法的话，就就执行(执行的结果是子组件重新从父组件拉取了最新的值)
+          typeof child.updateParentData == 'function' && child.updateParentData();
+        });
+      }
+    },
+    // 监听model的初始值作为重置表单的快照
+    model: {
+      immediate: true,
+      handler(n) {
+        if (!this.originalModel) {
+          this.originalModel = deepClone(n);
+        }
+      }
+    }
+  },
+  computed: {
+    propsChange() {
+      return [this.errorType, this.borderBottom, this.labelPosition, this.labelWidth, this.labelAlign, this.labelStyle];
+    }
+  },
+  created() {
+    // 存储当前form下的所有u-form-item的实例
+    // 不能定义在data中，否则微信小程序会造成循环引用而报错
+    this.children = [];
+  },
+  methods: {
+    // 手动设置校验的规则，如果规则中有函数的话，微信小程序中会过滤掉，所以只能手动调用设置规则
+    setRules(rules) {
+      // 判断是否有规则
+      if (Object.keys(rules).length === 0) return;
+      if (process.env.NODE_ENV === 'development' && Object.keys(this.model).length === 0) {
+        error('设置rules，model必须设置！如果已经设置，请刷新页面。');
+        return;
+      }
+      this.formRules = rules;
+      // 重新将规则赋予Validator
+      this.validator = new Schema(rules);
+    },
+    // 清空所有u-form-item组件的内容，本质上是调用了u-form-item组件中的resetField()方法
+    resetFields() {
+      this.resetModel();
+    },
+    // 重置model为初始值的快照
+    resetModel(obj) {
+      // 历遍所有u-form-item，根据其prop属性，还原model的原始快照
+      this.children.map((child) => {
+        const prop = child?.prop;
+        const value = getProperty(this.originalModel, prop);
+        setProperty(this.model, prop, value);
+      });
+    },
+    // 清空校验结果
+    clearValidate(props) {
+      props = [].concat(props);
+      this.children.map((child) => {
+        // 如果u-form-item的prop在props数组中，则清除对应的校验结果信息
+        if (props[0] === undefined || props.includes(child.prop)) {
+          child.message = null;
+        }
+      });
+    },
+    // 对部分表单字段进行校验
+    async validateField(value, callback, event = null, options) {
+      // $nextTick是必须的，否则model的变更，可能会延后于此方法的执行
+      this.$nextTick(() => {
+        // 校验错误信息，返回给回调方法，用于存放所有form-item的错误信息
+        const errorsRes = [];
+        // 如果为字符串，转为数组
+        value = [].concat(value);
+        // 历遍children所有子form-item
+        let promises = this.children.map((child) => {
+          return new Promise((resolve, reject) => {
+            // 用于存放form-item的错误信息
+            const childErrors = [];
+            if (value.includes(child.prop)) {
+              // 获取对应的属性，通过类似'a.b.c'的形式
+              const propertyVal = getProperty(this.model, child.prop);
+              // 属性链数组
+              const propertyChain = child.prop.split('.');
+              const propertyName = propertyChain[propertyChain.length - 1];
+              let rule = [];
+              if (child.itemRules && child.itemRules.length > 0) {
+                rule = child.itemRules;
+              } else {
+                rule = this.formRules[child.prop];
+              }
+              // 如果不存在对应的规则，直接返回，否则校验器会报错
+              if (!rule) {
+                resolve();
+                return;
+              }
+              // rule规则可为数组形式，也可为对象形式，此处拼接成为数组
+              const rules = [].concat(rule);
+              // 对rules数组进行校验
+              if (!rules.length) {
+                resolve();
+              }
+              for (let i = 0; i < rules.length; i++) {
+                const ruleItem = rules[i];
+                // 将u-form-item的触发器转为数组形式
+                const trigger = [].concat(ruleItem?.trigger);
+                // 如果是有传入触发事件，但是此form-item却没有配置此触发器的话，不执行校验操作
+                if (event && !trigger.includes(event)) {
+                  resolve();
+                  continue;
+                }
+                // 实例化校验对象，传入构造规则
+                const validator = new Schema({
+                  [propertyName]: ruleItem
+                });
+                validator.validate(
+                  {
+                    [propertyName]: propertyVal
+                  },
+                  (errors, fields) => {
+                    if (test.array(errors)) {
+                      errors.forEach((element) => {
+                        element.prop = child.prop;
+                      });
+                      errorsRes.push(...errors);
+                      childErrors.push(...errors);
+                    }
+                    //没有配置，或者配置了showErrorMsg为true时候，才修改子组件message，默认没有配置
+                    if (!options || options?.showErrorMsg == true) {
+                      child.message = childErrors[0]?.message ? childErrors[0].message : null;
+                    }
+                    if (i == rules.length - 1) {
+                      resolve(errorsRes);
+                    }
+                  }
+                );
+              }
+            } else {
+              resolve({});
+            }
+          });
+        });
+        // 使用Promise.all来等待所有Promise完成
+        Promise.all(promises)
+          .then((results) => {
+            // 执行回调函数
+            typeof callback === 'function' && callback(errorsRes);
+          })
+          .catch((error) => {
+            console.error('An error occurred:', error);
+          });
+      });
+    },
+    /**
+     * 校验全部数据
+     * @param {Object} options
+     * @param {Boolean} options.showErrorMsg -是否显示校验信息，
+     */
+    validate(options) {
+      // 开发环境才提示，生产环境不会提示
+      if (process.env.NODE_ENV === 'development' && Object.keys(this.formRules).length === 0) {
+        error('未设置rules，请看文档说明！如果已经设置，请刷新页面。');
+        return;
+      }
+      return new Promise((resolve, reject) => {
+        // $nextTick是必须的，否则model的变更，可能会延后于validate方法
+        this.$nextTick(() => {
+          // 获取所有form-item的prop，交给validateField方法进行校验
+          const formItemProps = this.children.map((item) => item.prop);
+          // console.log(formItemProps)
+          this.validateField(
+            formItemProps,
+            (errors) => {
+              if (errors.length) {
+                // 如果错误提示方式为toast，则进行提示
+                this.errorType === 'toast' && toast(errors[0].message);
+                reject(errors);
+              } else {
+                resolve(true);
+              }
+            },
+            null,
+            options
+          );
+        });
+      });
+    }
+  }
+};
+</script>
+<style scoped></style>