uni-oaview 1.0.2 → 1.0.4

package/components/oa-helloworld/oa-helloworld.vue

@@ -1,8 +1,12 @@
 <template>
-  <div>hello world</div>
+  <div>hello world{{ a }}</div>
 </template>
 
 <script lang="ts" setup>
+  import { ref } from 'vue';
+  import { getAsk } from '../../src';
+
   console.log('hello world');
+  const a = ref(getAsk());
 </script>
 <style scoped lang="scss"></style>

package/components/oa-image/oa-image.vue

@@ -0,0 +1,9 @@
+<template>
+  <div ></div>
+</template>
+
+<script lang='ts' setup>
+
+</script>
+<style scoped lang='scss'>
+</style>

package/components/oa-login/oa-login.vue

@@ -0,0 +1,119 @@
+<template>
+  <view style="padding: 0 45px">
+    <uni-forms :modelValue="formData" ref="formRef" :rules="rules">
+      <uni-forms-item required label="用户名" name="username">
+        <uni-easyinput type="text" v-model="formData.username" placeholder="请输入用户名" />
+      </uni-forms-item>
+      <uni-forms-item required name="password" label="密码">
+        <uni-easyinput type="password" v-model="formData.password" placeholder="请输入用户名" />
+      </uni-forms-item>
+      <uni-forms-item name="verificationCode" label="验证码">
+        <uni-easyinput type="text" v-model="formData.verificationCode" placeholder="请输入验证码" />
+      </uni-forms-item>
+      <view style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px">
+        <img :src="imageSrc" alt="" />
+        <button @click="refresh" type="primary" size="mini" style="margin: 0">刷新</button>
+      </view>
+    </uni-forms>
+    <button @click="submitForm" type="primary">登录</button>
+  </view>
+</template>
+
+<script setup lang="ts">
+  import { requestInstance } from '@/requests';
+  import { ref, reactive } from 'vue';
+  const formRef = ref();
+  const formData = reactive({
+    username: 'lixd',
+    password:
+      'f0d5937ddef983a4fbf56eec5c84ab78e7402fd6b55b8b7271f75f676b57bae1afe09a476702f414c12b5259899db3790ab1d8915827f2f956f48c8ab4af7541',
+    verificationCode: 88,
+  });
+  const rules = ref({
+    username: [
+      {
+        required: true,
+        errorMessage: '请输入姓名',
+      },
+    ],
+    password: [
+      {
+        required: true,
+        errorMessage: '请输入密码',
+      },
+    ],
+  });
+  const imageSrc = ref('');
+  const ppid = ref();
+  let baseUrl = '';
+  /** 在真机模拟调试的时候运行 */
+  // #ifndef H5
+  baseUrl = uni.getStorageSync('baseUrl');
+  // #endif
+  const refresh = () => {
+    uni.request({
+      url: `${baseUrl}/api/auth/verification/get?t=${Date.now()}`,
+      method: 'POST',
+      success: (res: any) => {
+        const { pid, image } = res.data.data;
+        imageSrc.value = image;
+        ppid.value = pid;
+      },
+    });
+  };
+  refresh();
+  const submitForm = () => {
+    uni.showLoading({
+      title: '加载中',
+      mask: true,
+    });
+    uni.request({
+      url: `${baseUrl}/api/auth/user/login?t=${Date.now()}`,
+      method: 'POST',
+      data: {
+        username: formData.username,
+        password: formData.password,
+        verification: {
+          code: formData.verificationCode,
+          pid: ppid.value,
+        },
+      },
+      success: (res: any) => {
+        const { uuid: id, email, ...otherParams } = res.data.data;
+        const opinions = uni.getStorageSync('opinions');
+        opinions.userInfo = {
+          ...opinions.userInfo,
+          id,
+          email,
+          ...otherParams,
+          department: '这是一个很长很长的部门部门321312321312',
+          position: '这是一个很长很长的职位321312312321321312',
+        };
+        uni.setStorageSync('opinions', opinions);
+        uni.request({
+          url: `${baseUrl}/api/gatewayproxy/routing/getToken?t=${Date.now()}`,
+          method: 'POST',
+          success: (res: any) => {
+            uni.hideLoading();
+            uni.setStorageSync('token', res.data.data);
+            requestInstance.setParams({ token: res.data.data });
+            uni.showToast({
+              title: '登录成功',
+            });
+            const currentPages = getCurrentPages();
+            let page = currentPages.pop();
+            while (currentPages.length && page?.route === 'pages/mock/index') {
+              page = currentPages.pop();
+            }
+            uni.redirectTo({
+              url: '/pages/qiandao/index',
+            });
+          },
+        });
+      },
+      complete: () => {
+        uni.hideLoading();
+      },
+    });
+  };
+</script>

package/components/oa-single-select/oa-single-select.vue

@@ -0,0 +1,127 @@
+<template>
+  <view>
+    <u-popup :show="modelValue" mode="bottom" @close="closeHandler" :closeOnClickOverlay="false">
+      <view class="button-box">
+        <view class="button-box-left" @click="closeHandler">取消</view>
+        <view class="button-box-center">{{ title }}</view>
+        <view class="button-box-right" @click="submit">确定</view>
+      </view>
+      <view class="search-box">
+        <view class="search-box-item">
+          <picker-view :indicator-style="indicatorStyle" :value="indexList" @change="bindChange" class="picker-view">
+            <picker-view-column>
+              <view class="item" v-for="(item, index) in columns" :key="index">{{ item[labelKey ?? 'label'] }}</view>
+            </picker-view-column>
+          </picker-view>
+        </view>
+      </view>
+    </u-popup>
+  </view>
+</template>
+<script lang="ts" setup>
+  import { createDebounceFn } from '../../src/index';
+  import { ref, nextTick, watch, watchEffect } from 'vue';
+  const props = defineProps<{
+    title?: string;
+    value?: string;
+    modelValue: boolean;
+    columns: Array<string>;
+    labelKey?: string;
+    valueKey?: string;
+  }>();
+  const title = ref(props.title);
+  const indicatorStyle = `height: 40px;`;
+  const emit = defineEmits(['updateValue', 'close', 'update:modelValue']);
+  const indexList = ref<number[]>([]);
+  let currentValue: string;
+  watchEffect(() => {
+    currentValue = props.value as string;
+  });
+  const init = () => {
+    const index = Math.max(
+      0,
+      props.columns.findIndex((item) => item[props.valueKey ?? 'value'] === currentValue),
+    );
+    indexList.value = [index];
+  };
+  init();
+  const bindChange = createDebounceFn((e: any) => {
+    const val = e.detail.value;
+    nextTick(() => {
+      indexList.value = val;
+    });
+  }, 200);
+  const submit = () => {
+    const val = indexList.value;
+    const newValue = props.columns[val[0]];
+    currentValue = newValue[props.valueKey ?? 'value'];
+    emit('updateValue', newValue);
+    emit('update:modelValue', false);
+    emit('close');
+  };
+  const closeHandler = () => {
+    emit('update:modelValue', false);
+    emit('close');
+  };
+  watch(
+    () => props.modelValue,
+    () => {
+      if (props.modelValue) {
+        init();
+      }
+    },
+  );
+</script>
+<style lang="scss" scoped>
+  .button-box {
+    display: flex;
+    justify-content: space-between;
+    font-size: 28rpx;
+    height: 58px;
+    text-align: center;
+    line-height: 36px;
+    margin: 20rpx 20rpx 0 20rpx;
+    &-left {
+      height: 36px;
+      font-size: 16px;
+      color: #909193;
+    }
+    &-center {
+      height: 36px;
+      font-size: 16px;
+      color: #19242c;
+    }
+    &-right {
+      height: 36px;
+      font-size: 16px;
+      color: #119af5;
+    }
+  }
+  .search-box {
+    padding: 24rpx 24rpx 0;
+    &-item {
+      margin: 12rpx;
+      overflow: hidden;
+      &-title {
+        height: 40rpx;
+        line-height: 40rpx;
+        font-size: 28rpx;
+        color: #333333;
+      }
+      .picker-view {
+        width: 100%;
+        height: 400rpx;
+        .flex-two {
+          flex: 2;
+        }
+      }
+      .item {
+        height: 40px;
+        line-height: 40px;
+        align-items: center;
+        justify-content: center;
+        text-align: center;
+      }
+    }
+  }
+</style>

package/components/oa-skeleton/oa-skeleton.scss

@@ -30,6 +30,7 @@ $row-margin-top: 32rpx;
 .skeleton-row-item {
   background-color: $bg-color;
   height: $row-height;
+  margin: 0 auto;
 }
 .skeleton-row-item:not(:first-child) {
   margin-top: $row-margin-top;

package/components/oa-skeleton/oa-skeleton.vue

@@ -2,7 +2,11 @@
   <view>
     <!-- 为了解决H5中v-if导致样式失效的问题，故使用v-show -->
     <view v-show="loading">
-      <view class="skeleton" :class="{ animate: animate }">
+      <view
+        class="skeleton"
+        :style="{ 'padding-top': paddingTop, 'padding-bottom': paddingBottom }"
+        :class="{ animate: animate }"
+      >
         <view
           v-if="displayAvatar"
           class="skeleton-avatar"
@@ -16,7 +20,7 @@
               v-for="(item, index) in rowList"
               :key="index"
               class="skeleton-row-item"
-              :style="{ width: item.width, height: rowHeight }"
+              :style="{ 'width': item.width, 'height': rowHeight, 'border-radius': borderRadius }"
             ></view>
           </view>
         </view>
@@ -56,11 +60,31 @@
       type: String as PropType<'square' | 'round'>,
       default: '',
     },
+    rowWidth: {
+      type: String,
+      default: () => '100%',
+    },
+    lastRowWidth: {
+      type: String,
+      default: () => '100%',
+    },
+    borderRadius: {
+      type: String,
+      default: () => '0',
+    },
+    paddingTop: {
+      type: String,
+      default: () => '16rpx',
+    },
+    paddingBottom: {
+      type: String,
+      default: () => '16rpx',
+    },
   });
   const rowList = computed(() => {
     const arr: Array<any> = [];
     for (let i = 0; i < props.row; i++) {
-      arr.push({ width: i === props.row - 1 && i !== 0 ? DEFAULT_LAST_ROW_WIDTH : DEFAULT_ROW_WIDTH });
+      arr.push({ width: i === props.row - 1 && i !== 0 ? props.lastRowWidth : props.rowWidth });
     }
     return arr;
   });

package/components/oa-vconsole/oa-vconsole.vue

@@ -47,9 +47,14 @@
   import Storage from './storage.vue';
   import Console from './console.vue';
   import System from './system.vue';
-  const whiteUrls = ['http://192.168.12.175:6174', 'http://192.168.10.11:6174'];
+  const whiteUrls = [
+    'http://192.168.11.231:6174',
+    'http://192.168.10.11:6174',
+    'http://dev-oa.ge.cn:6174',
+    'http://test-oa.ge.cn:6174',
+  ];
   const show = ref(false);
-  const isShowDebugButton = ref(whiteUrls.includes(uni.getStorageSync('baseUrl')));
+  const isShowDebugButton = ref(whiteUrls.includes(uni.getStorageSync('baseUrl')) || !!uni.getStorageSync('isDebug'));
   const list = ref(['console', 'network', 'event', 'error', 'storage', 'system']);
   const current = ref(0);
   const openDebug = () => {

package/dist/index.d.ts

@@ -1,5 +1,14 @@
+/**
+ * 防抖函数
+ * @param callback
+ * @param time
+ * @returns
+ */
+declare function createDebounceFn(callback: (...params: any[]) => void, time: number): (...params: any[]) => void;
+declare function getAsk(): string;
+
 declare const _default: {
     install: (Vue: any) => void;
 };
 
-export { _default as default };
+export { createDebounceFn, _default as default, getAsk };

package/dist/index.umd.mini.js

@@ -4,12 +4,36 @@
   (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global["UNI-OAVIEW"] = {}));
 })(this, (function (exports) { 'use strict';
 
+  /**
+   * 防抖函数
+   * @param callback
+   * @param time
+   * @returns
+   */
+  function createDebounceFn(callback, time) {
+    var timer = null;
+    return function () {
+      for (var _len = arguments.length, params = new Array(_len), _key = 0; _key < _len; _key++) {
+        params[_key] = arguments[_key];
+      }
+      clearTimeout(timer);
+      timer = setTimeout(function () {
+        callback.apply(void 0, params);
+      }, time);
+    };
+  }
+  function getAsk() {
+    return '我是一个until函数';
+  }
+
   var install = function install(Vue) {};
   var index = {
     install: install
   };
 
+  exports.createDebounceFn = createDebounceFn;
   exports["default"] = index;
+  exports.getAsk = getAsk;
 
   Object.defineProperty(exports, '__esModule', { value: true });
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "uni-oaview",
-  "version": "1.0.2",
+  "version": "1.0.4",
   "description": "uniapp小程序组件库",
   "main": "dist/index.umd.js",
   "typings": "dist/index.d.ts",
@@ -34,9 +34,10 @@
     "rollup-plugin-eslint": "^7.0.0",
     "rollup-plugin-terser": "^7.0.2",
     "rollup-plugin-typescript2": "^0.27.2",
+    "rollup-plugin-vue": "^6.0.0",
     "typescript": "^4.0.2"
   },
-  "dependencies": {
+  "peerDependencies": {
     "uniapp-log-sdk": "^1.1.1"
   }
 }

package/components/oa-skeleton/skeleton.scss

@@ -1,52 +0,0 @@
-$bg-color: white;
-$row-height: 32rpx;
-$row-margin-top: 32rpx;
-
-.skeleton {
-  display: flex;
-  padding: 32rpx;
-}
-.skeleton-avatar {
-  flex-shrink: 0;
-  background: $bg-color;
-  margin-right: 16rpx;
-}
-.skeleton-avatar.round {
-  border-radius: 50%;
-}
-
-.skeleton-content {
-  width: 100%;
-}
-
-.skeleton-title {
-  background-color: $bg-color;
-  height: $row-height;
-}
-
-.skeleton-title + .skeleton-rows {
-  margin-top: $row-margin-top;
-}
-.skeleton-row-item {
-  background-color: $bg-color;
-  height: $row-height;
-}
-.skeleton-row-item:not(:first-child) {
-  margin-top: $row-margin-top;
-}
-
-.skeleton.animate {
-  animation: skeleton-blink 1.2s ease-in-out infinite;
-}
-
-@keyframes skeleton-blink {
-  0% {
-    opacity: 1;
-  }
-  50% {
-    opacity: 0.6;
-  }
-  100% {
-    opacity: 1;
-  }
-}

package/components/oa-skeleton/skeleton.vue

@@ -1,104 +0,0 @@
-<template>
-  <view>
-    <!-- 为了解决H5中v-if导致样式失效的问题，故使用v-show -->
-    <view v-show="loading">
-      <view class="skeleton" :class="{ animate: animate }">
-        <view
-          v-if="displayAvatar"
-          class="skeleton-avatar"
-          :class="[displayAvatarShape]"
-          :style="{ width: displayAvatarSize, height: displayAvatarSize }"
-        ></view>
-        <view class="skeleton-content">
-          <view v-if="showTitle" class="skeleton-title" :style="{ width: titleWidth, height: rowHeight }"></view>
-          <view class="skeleton-rows">
-            <view
-              v-for="(item, index) in rowList"
-              :key="index"
-              class="skeleton-row-item"
-              :style="{ width: item.width, height: rowHeight }"
-            ></view>
-          </view>
-        </view>
-      </view>
-    </view>
-    <view v-show="!loading"><slot></slot></view>
-  </view>
-</template>
-
-<script lang="ts">
-  import { computed } from '@mk/composition-api';
-  import Vue from 'vue';
-
-  const DEFAULT_ROW_WIDTH = '100%';
-  const DEFAULT_LAST_ROW_WIDTH = '60%';
-
-  export default Vue.extend({
-    props: {
-      loading: {
-        type: Boolean,
-        default: false,
-      },
-      /** 是否展示图片 */
-      showAvatar: {
-        type: Boolean,
-        default: false,
-      },
-      /** 展示图片的尺寸 */
-      avatarSize: {
-        type: String,
-        default: '',
-      },
-      /** 图片的形状 */
-      avatarShape: {
-        type: String,
-        default: '', // square | round
-      },
-      /** 是否展示标题条 */
-      showTitle: {
-        type: Boolean,
-        default: false,
-      },
-      /** 标题条的宽度 */
-      titleWidth: {
-        type: String,
-        default: '40%',
-      },
-      /** 需要展示几行 */
-      row: {
-        type: Number,
-        default: 3,
-      },
-      /** 行高 */
-      rowHeight: {
-        type: String,
-        default: '32rpx',
-      },
-      /** 是否展示动画 */
-      animate: {
-        type: Boolean,
-        default: true,
-      },
-    },
-    setup(props: any) {
-      const rowList = computed(() => {
-        const arr: Array<any> = [];
-        for (let i = 0; i < props.row; i++) {
-          arr.push({ width: i === props.row - 1 && i !== 0 ? DEFAULT_LAST_ROW_WIDTH : DEFAULT_ROW_WIDTH });
-        }
-        return arr;
-      });
-      const displayAvatar = computed(() => props.avatarShape || props.showAvatar || props.avatarSize);
-      const displayAvatarShape = computed(() => props.avatarShape || 'round');
-      const displayAvatarSize = computed(() => props.avatarSize || '100rpx');
-      return {
-        rowList,
-        displayAvatar,
-        displayAvatarShape,
-        displayAvatarSize,
-      };
-    },
-  });
-</script>
-
-<style lang="scss" scoped src="./skeleton.scss"></style>