hrp-ui-base 1.4.7 → 1.4.9

package/src/components/annex-upload-weijian/modules/previewMp.vue

@@ -1,54 +1,54 @@
-<!-- 
- * @description: 预览mp3，mp4等
- * @fileName: previewMp.vue 
- * @author: huatuo 
-!-->
-<template>
-  <el-dialog v-model="dialogVisible" :title="dialogTitle" width="50%" size="default" style="min-width: 800px" :destroy-on-close="true">
-    <div style="width: 100%;height: 100%;">
-      <audio controls v-if="fileType === 'mp3'" autoplay>
-        <source :src="fileInfo.url" type="audio/mpeg" style="width: 100%;height: 100%;"> 
-        您浏览器暂不支持该播放器！
-      </audio>
-      <video id="video-element" controls  v-if="fileType === 'mp4'" :src="fileInfo.url" autoplay style="width: 100%;height: 100%;">
-        您浏览器暂不支持该播放器！
-      </video>
-    </div>
-    <template #footer>
-      <el-button @click="closePreview">关闭</el-button>
-    </template>
-  </el-dialog>
-</template>
-<script lang="ts" name="SystemTenantForm" setup>
-import { ref, onMounted, reactive, PropType } from 'vue'
-import { ElMessage } from 'element-plus';
-import FileBaseInfo from "hrp-ui-base/api/bms/file/bo/FileBaseInfo"
-const dialogVisible = ref(false) // 弹窗的是否展示
-const dialogTitle = ref('') // 弹窗的标题
-const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
-/** 文件类型 */
-const fileType = ref<'mp3' | 'mp4'>('mp3')
-/** 文件信息 */
-const fileInfo = ref<FileBaseInfo>(new FileBaseInfo())
-/** 打开弹窗 */
-const open = async (type: 'mp3' | 'mp4', row: FileBaseInfo) => {
-  dialogVisible.value = true
-  dialogTitle.value = '文件预览'
-  fileType.value = type
-  formLoading.value = true
-
-  resetForm()
-  fileInfo.value = row
-  formLoading.value = false
-
-}
-defineExpose({ open }) // 提供 open 方法，用于打开弹窗
-
-/** 重置表单 */
-const resetForm = () => {
-}
-
-const closePreview = () => {
-  dialogVisible.value = false
-}
+<!-- 
+ * @description: 预览mp3，mp4等
+ * @fileName: previewMp.vue 
+ * @author: huatuo 
+!-->
+<template>
+  <el-dialog v-model="dialogVisible" :title="dialogTitle" width="50%" size="default" style="min-width: 800px" :destroy-on-close="true">
+    <div style="width: 100%;height: 100%;">
+      <audio controls v-if="fileType === 'mp3'" autoplay>
+        <source :src="fileInfo.url" type="audio/mpeg" style="width: 100%;height: 100%;"> 
+        您浏览器暂不支持该播放器！
+      </audio>
+      <video id="video-element" controls  v-if="fileType === 'mp4'" :src="fileInfo.url" autoplay style="width: 100%;height: 100%;">
+        您浏览器暂不支持该播放器！
+      </video>
+    </div>
+    <template #footer>
+      <el-button @click="closePreview">关闭</el-button>
+    </template>
+  </el-dialog>
+</template>
+<script lang="ts" name="SystemTenantForm" setup>
+import { ref, onMounted, reactive, PropType } from 'vue'
+import { ElMessage } from 'element-plus';
+import FileBaseInfo from "hrp-ui-base/api/bms/file/bo/FileBaseInfo"
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+/** 文件类型 */
+const fileType = ref<'mp3' | 'mp4'>('mp3')
+/** 文件信息 */
+const fileInfo = ref<FileBaseInfo>(new FileBaseInfo())
+/** 打开弹窗 */
+const open = async (type: 'mp3' | 'mp4', row: FileBaseInfo) => {
+  dialogVisible.value = true
+  dialogTitle.value = '文件预览'
+  fileType.value = type
+  formLoading.value = true
+
+  resetForm()
+  fileInfo.value = row
+  formLoading.value = false
+
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 重置表单 */
+const resetForm = () => {
+}
+
+const closePreview = () => {
+  dialogVisible.value = false
+}
 </script>

package/src/components/base-layout/index.vue

@@ -1,199 +1,199 @@
-<template>
-  <div class="big-box-outer">
-    <el-container id="common-layout">
-      <!-- 顶部导航栏插槽 -->
-      <slot name="header"></slot>
-      <!-- 额外内容插槽（如个性化引导弹窗等） -->
-      <slot name="extra"></slot>
-
-      <!-- 左侧菜单布局 -->
-      <div v-if="isLeftMenu" class="layout-content is-left-menu">
-        <slot name="side-menu"></slot>
-        <div class="layout-main-column">
-          <slot name="tabs"></slot>
-          <transition name="width-change">
-            <el-main
-              class="common-layout-main"
-              style="padding: 6px 10px; background: var(--custom-main-bg-fill)"
-            >
-              <el-main
-                class="common-workbench-main hide-scroll-bar"
-                style="border-radius: 12px"
-              >
-                <slot></slot>
-              </el-main>
-            </el-main>
-          </transition>
-        </div>
-      </div>
-
-      <!-- 顶部菜单布局 -->
-      <template v-else>
-        <slot name="tabs"></slot>
-        <div class="layout-content">
-          <transition name="width-change">
-            <el-main
-              class="common-layout-main"
-              style="padding: 6px 10px; background: var(--custom-main-bg-fill)"
-            >
-              <el-main
-                class="common-workbench-main hide-scroll-bar"
-                style="border-radius: 12px"
-              >
-                <slot></slot>
-              </el-main>
-            </el-main>
-          </transition>
-        </div>
-      </template>
-    </el-container>
-  </div>
-</template>
-
-<script lang="ts" setup>
-defineOptions({
-  name: "BaseLayout",
-});
-
-defineProps({
-  /**
-   * 是否使用左侧菜单布局
-   */
-  isLeftMenu: {
-    type: Boolean,
-    default: false,
-  },
-});
-</script>
-
-<style lang="scss" scoped>
-.big-box-outer {
-  width: 100%;
-  min-width: 850px;
-  overflow: auto;
-  height: 100%;
-}
-
-/** 隐藏滚动条 */
-#common-layout,
-.common-layout-main {
-  overflow: hidden;
-  scrollbar-width: none;
-  -ms-overflow-style: none;
-  background: var(--custom-theme-fill-7);
-}
-
-#common-layout::-webkit-scrollbar,
-.common-layout-main::-webkit-scrollbar {
-  display: none;
-}
-
-#common-layout {
-  height: 100%;
-  width: 100%;
-  min-width: 600px;
-  display: flex;
-  flex-direction: column;
-  flex-wrap: nowrap;
-  flex-grow: 1;
-  flex-shrink: 1;
-
-  .common-layout {
-    .common-layout-header {
-      width: 100%;
-    }
-
-    .common-layout-main {
-      width: 100%;
-      box-sizing: border-box;
-      height: calc(100% - 78px) !important;
-      display: flex;
-      flex-direction: row;
-      justify-content: flex-start;
-      align-items: flex-start;
-      flex-wrap: nowrap;
-      flex-grow: 0;
-      flex-shrink: 0;
-    }
-  }
-}
-
-.layout-content {
-  flex: 1;
-  min-height: 0;
-  display: flex;
-  flex-direction: row;
-  overflow: hidden;
-  background: var(--custom-theme-fill-7);
-
-  .common-layout-main {
-    flex: 1;
-    min-width: 0;
-  }
-}
-
-.layout-main-column {
-  flex: 1;
-  min-width: 0;
-  min-height: 0;
-  display: flex;
-  flex-direction: column;
-}
-
-.layout-content.is-left-menu {
-  .common-workbench-main {
-    border-left: none;
-  }
-
-  .common-layout-main {
-    flex: 1;
-    min-height: 0;
-  }
-}
-
-.common-workbench-main {
-  height: calc(100%);
-  box-sizing: border-box;
-  padding: 0;
-  background: var(--custom-theme-fill-4);
-  border-left: 1px solid var(--el-border-color);
-}
-
-.common-workbench-main-rv {
-  height: calc(100% - 24px);
-  width: 100%;
-}
-
-/* 移动端 */
-@media only screen and (max-device-width: 640px) {
-  .common-layout-header {
-    display: none;
-  }
-
-  #common-layout {
-    height: 100%;
-    width: 100%;
-    min-width: 100%;
-  }
-
-  .common-layout-main {
-    height: 100% !important;
-    display: flex !important;
-    flex-direction: column !important;
-    overflow: hidden;
-  }
-
-  .common-workbench-main {
-    height: 100%;
-    width: 100%;
-  }
-
-  .el-main {
-    padding: 0 !important;
-  }
-}
-
-/* pad端 */
-@media screen and (min-device-width: 640px) and (max-device-width: 1000px) {
-}
-</style>
+<template>
+  <div class="big-box-outer">
+    <el-container id="common-layout">
+      <!-- 顶部导航栏插槽 -->
+      <slot name="header"></slot>
+      <!-- 额外内容插槽（如个性化引导弹窗等） -->
+      <slot name="extra"></slot>
+
+      <!-- 左侧菜单布局 -->
+      <div v-if="isLeftMenu" class="layout-content is-left-menu">
+        <slot name="side-menu"></slot>
+        <div class="layout-main-column">
+          <slot name="tabs"></slot>
+          <transition name="width-change">
+            <el-main
+              class="common-layout-main"
+              style="padding: 6px 10px; background: var(--custom-main-bg-fill)"
+            >
+              <el-main
+                class="common-workbench-main hide-scroll-bar"
+                style="border-radius: 12px"
+              >
+                <slot></slot>
+              </el-main>
+            </el-main>
+          </transition>
+        </div>
+      </div>
+
+      <!-- 顶部菜单布局 -->
+      <template v-else>
+        <slot name="tabs"></slot>
+        <div class="layout-content">
+          <transition name="width-change">
+            <el-main
+              class="common-layout-main"
+              style="padding: 6px 10px; background: var(--custom-main-bg-fill)"
+            >
+              <el-main
+                class="common-workbench-main hide-scroll-bar"
+                style="border-radius: 12px"
+              >
+                <slot></slot>
+              </el-main>
+            </el-main>
+          </transition>
+        </div>
+      </template>
+    </el-container>
+  </div>
+</template>
+
+<script lang="ts" setup>
+defineOptions({
+  name: "BaseLayout",
+});
+
+defineProps({
+  /**
+   * 是否使用左侧菜单布局
+   */
+  isLeftMenu: {
+    type: Boolean,
+    default: false,
+  },
+});
+</script>
+
+<style lang="scss" scoped>
+.big-box-outer {
+  width: 100%;
+  min-width: 850px;
+  overflow: auto;
+  height: 100%;
+}
+
+/** 隐藏滚动条 */
+#common-layout,
+.common-layout-main {
+  overflow: hidden;
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  background: var(--custom-theme-fill-7);
+}
+
+#common-layout::-webkit-scrollbar,
+.common-layout-main::-webkit-scrollbar {
+  display: none;
+}
+
+#common-layout {
+  height: 100%;
+  width: 100%;
+  min-width: 600px;
+  display: flex;
+  flex-direction: column;
+  flex-wrap: nowrap;
+  flex-grow: 1;
+  flex-shrink: 1;
+
+  .common-layout {
+    .common-layout-header {
+      width: 100%;
+    }
+
+    .common-layout-main {
+      width: 100%;
+      box-sizing: border-box;
+      height: calc(100% - 78px) !important;
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      align-items: flex-start;
+      flex-wrap: nowrap;
+      flex-grow: 0;
+      flex-shrink: 0;
+    }
+  }
+}
+
+.layout-content {
+  flex: 1;
+  min-height: 0;
+  display: flex;
+  flex-direction: row;
+  overflow: hidden;
+  background: var(--custom-theme-fill-7);
+
+  .common-layout-main {
+    flex: 1;
+    min-width: 0;
+  }
+}
+
+.layout-main-column {
+  flex: 1;
+  min-width: 0;
+  min-height: 0;
+  display: flex;
+  flex-direction: column;
+}
+
+.layout-content.is-left-menu {
+  .common-workbench-main {
+    border-left: none;
+  }
+
+  .common-layout-main {
+    flex: 1;
+    min-height: 0;
+  }
+}
+
+.common-workbench-main {
+  height: calc(100%);
+  box-sizing: border-box;
+  padding: 0;
+  background: var(--custom-theme-fill-4);
+  border-left: 1px solid var(--el-border-color);
+}
+
+.common-workbench-main-rv {
+  height: calc(100% - 24px);
+  width: 100%;
+}
+
+/* 移动端 */
+@media only screen and (max-device-width: 640px) {
+  .common-layout-header {
+    display: none;
+  }
+
+  #common-layout {
+    height: 100%;
+    width: 100%;
+    min-width: 100%;
+  }
+
+  .common-layout-main {
+    height: 100% !important;
+    display: flex !important;
+    flex-direction: column !important;
+    overflow: hidden;
+  }
+
+  .common-workbench-main {
+    height: 100%;
+    width: 100%;
+  }
+
+  .el-main {
+    padding: 0 !important;
+  }
+}
+
+/* pad端 */
+@media screen and (min-device-width: 640px) and (max-device-width: 1000px) {
+}
+</style>

package/src/components/button.vue

@@ -1,14 +1,14 @@
-<script setup>
-import 'element-plus/dist/index.css'
-import { ElButton } from 'element-plus'
-const a = ref(0)
-</script>
-
-<template>
-  <div>
-    <el-button @click="a+=1">我是 ElButton {{a}}</el-button>
-  </div>
-</template>
-
-<style scoped>
-</style>
+<script setup>
+import 'element-plus/dist/index.css'
+import { ElButton } from 'element-plus'
+const a = ref(0)
+</script>
+
+<template>
+  <div>
+    <el-button @click="a+=1">我是 ElButton {{a}}</el-button>
+  </div>
+</template>
+
+<style scoped>
+</style>