nubomed-ui 1.0.3 → 1.0.4

package/src/demos/Dialog.vue

@@ -1,255 +0,0 @@
-<!--
- * @Author: chenghuan.dong
- * @Date: 2023-06-30 22:07:34
- * @LastEditors: chenghuan.dong
- * @LastEditTime: 2023-07-04 20:46:16
- * @Description: 
--->
-<template>
-  <div>
-    <div class="demo-box">
-      <div class="demo-box-title">
-        <span class="demo-box-title-name">大尺寸对话框Modal（宽1600px，高900px）</span>
-      </div>
-      <div class="demo-box-content">
-        <nb-button @click="openLarge(1)">打开大对话框</nb-button>
-        <nb-button @click="openLarge(2)">打开大对话框</nb-button>
-        <nb-dialog v-model="largeDialogVisible1" size="large" title="大对话框" show-close @closed="handleClosedLarge(1)"
-          >自定义内容</nb-dialog
-        >
-        <nb-dialog
-          v-model="largeDialogVisible2"
-          size="large"
-          title="大对话框"
-          footerTips="自定义footerTips"
-          :title-center="true"
-          @closed="handleClosedLarge"
-          @cancel="handleClosedLarge(2)"
-          >自定义内容</nb-dialog
-        >
-      </div>
-    </div>
-    <div class="demo-box">
-      <div class="demo-box-title">
-        <span class="demo-box-title-name">中尺寸对话框Modal（宽1000px，高640px）</span>
-      </div>
-      <div class="demo-box-content">
-        <nb-button @click="openLarge(3)">打开对话框</nb-button>
-        <nb-dialog
-          v-model="largeDialogVisible3"
-          size="medium"
-          title="中尺寸对话框Modal"
-          show-close
-          @closed="handleClosedLarge(3)"
-          >自定义内容</nb-dialog
-        >
-      </div>
-    </div>
-    <div class="demo-box">
-      <div class="demo-box-title">
-        <span class="demo-box-title-name">小尺寸对话框Modal（宽720px，高520px）</span>
-      </div>
-      <div class="demo-box-content">
-        <nb-button @click="openMini(1)">打开mini对话框</nb-button>
-        <nb-button @click="openMini(2)">打开mini对话框</nb-button>
-        <nb-dialog
-          v-model="miniDialogVisible1"
-          center
-          size="mini"
-          message="是否确定保存盘点数据"
-          desc="提示哦"
-          @cancel="handleClosedMini(1)"
-          @confirm="handleClosedMini(1)"
-          @closed="handleClosedMini(1)"
-        ></nb-dialog>
-        <nb-dialog
-          v-model="miniDialogVisible2"
-          center
-          size="mini"
-          message="是否确定保存盘点数据"
-          desc="提示哦"
-          cancel-button-text="我知道了"
-          cancel-button-color="#0066E0"
-          :show-confirm-button="false"
-          @cancel="handleClosedMini(2)"
-          @closed="handleClosedMini(2)"
-        >
-          <div v-html="`您有 36 件试剂取用未归还，<br>请及时归还。`" class="nb-dialog__body__message"></div>
-        </nb-dialog>
-        <nb-button @click="openMini(3)">mini-成功</nb-button>
-        <nb-button @click="openMini(4)">mini-异常</nb-button>
-        <nb-button @click="openMini(5)">mini-异常</nb-button>
-        <nb-button @click="openMini(7)">mini-异常</nb-button>
-        <nb-dialog
-          v-model="miniDialogVisible3"
-          center
-          size="mini"
-          icon="success"
-          message="操作成功！"
-          @cancel="handleClosedMini(3)"
-          @confirm="handleClosedMini(3)"
-          @closed="handleClosedMini(3)"
-        />
-        <nb-dialog
-          v-model="miniDialogVisible4"
-          center
-          size="mini"
-          icon="warning-red"
-          message="存在未完成数据，是否确定继续"
-          desc="*跳转后当前业务数据将被清除"
-          desc-color="#00A572"
-          @cancel="handleClosedMini(4)"
-          @confirm="handleClosedMini(4)"
-          @closed="handleClosedMini(4)"
-        />
-        <nb-dialog
-          v-model="miniDialogVisible5"
-          center
-          size="mini"
-          icon="warning-red"
-          message="耗材异常出入库<br>请开柜处理！"
-          cancel-button-text="忽略并删除"
-          cancel-button-color="#E52D3E"
-          confirm-button-text="开柜"
-          @cancel="handleClosedMini(5)"
-          @confirm="handleClosedMini(5)"
-          @closed="handleClosedMini(5)"
-        />
-        <nb-dialog
-          v-model="miniDialogVisible7"
-          center
-          size="mini"
-          icon="warning-yellow"
-          message="60秒后开始自动盘点"
-          cancel-button-text="我知道了"
-          cancel-button-color="#0066E0"
-          :show-confirm-button="false"
-          :cancel-button-time="5"
-          @cancel="handleClosedMini(7)"
-          @closed="handleClosedMini(7)"
-        />
-        <nb-button @click="openMini(6)">mini-表单</nb-button>
-        <nb-dialog
-          v-model="miniDialogVisible6"
-          size="mini"
-          center
-          title="请备注患者信息"
-          @cancel="handleClosedMini(6)"
-          @confirm="handleSubmitForm"
-          @closed="handleClosedMini(6)"
-        >
-          <nb-form ref="formRef">
-            <nb-form-item
-              label="患者号"
-              prop="name"
-              :rules="[
-                { required: true, message: '患者号 is required' },
-                { type: 'number', message: '患者号 must be a number' }
-              ]"
-            >
-              <nb-input v-model="formModel.name" size="large" placeholder="请输入住院号/门诊号" />
-            </nb-form-item>
-            <nb-form-item label="姓名">
-              <nb-input size="large" placeholder="请输入住院号/门诊号" />
-            </nb-form-item>
-          </nb-form>
-        </nb-dialog>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { reactive, ref } from 'vue'
-const largeDialogVisible1 = ref(false)
-const largeDialogVisible2 = ref(false)
-const largeDialogVisible3 = ref(false)
-
-const miniDialogVisible1 = ref(false)
-const miniDialogVisible2 = ref(false)
-
-const miniDialogVisible3 = ref(false)
-const miniDialogVisible4 = ref(false)
-const miniDialogVisible5 = ref(false)
-
-const miniDialogVisible6 = ref(false)
-const miniDialogVisible7 = ref(false)
-
-const formRef = ref()
-const formModel = reactive({
-  name: '',
-  password: ''
-})
-
-const openLarge = (index) => {
-  setLargeVisible(index, true)
-}
-
-const openMini = (index) => {
-  setMiniVisible(index, true)
-}
-
-// 关闭
-const handleClosedLarge = (index) => {
-  console.log('关闭弹框', index)
-  setLargeVisible(index, false)
-}
-
-// 关闭
-const handleClosedMini = (index) => {
-  console.log('关闭弹框', index)
-  setMiniVisible(index, false)
-}
-
-const handleSubmitForm = () => {
-  formRef.value && formRef.value.validate(() => {})
-}
-
-function setLargeVisible(index, visible) {
-  switch (index) {
-    case 1:
-      largeDialogVisible1.value = visible
-      break
-    case 2:
-      largeDialogVisible2.value = visible
-      break
-    case 3:
-      largeDialogVisible3.value = visible
-      break
-  }
-}
-
-function setMiniVisible(index, visible) {
-  switch (index) {
-    case 1:
-      miniDialogVisible1.value = visible
-      break
-    case 2:
-      miniDialogVisible2.value = visible
-      break
-    case 3:
-      miniDialogVisible3.value = visible
-      break
-    case 4:
-      miniDialogVisible4.value = visible
-      break
-    case 5:
-      miniDialogVisible5.value = visible
-      break
-    case 6:
-      miniDialogVisible6.value = visible
-      break
-    case 7:
-      miniDialogVisible7.value = visible
-      break
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.demo-box-content {
-  .nb-button {
-    margin: 0 30px 30px 0;
-  }
-}
-</style>

package/src/demos/Empty.vue

@@ -1,38 +0,0 @@
-<!--
- * @Author: chenghuan.dong
- * @Date: 2023-07-05 15:26:05
- * @LastEditors: chenghuan.dong
- * @LastEditTime: 2023-07-14 17:52:04
- * @Description: 
--->
-<template>
-  <div>
-    <div class="demo-box">
-      <div class="demo-box-title">
-        <span class="demo-box-title-name">Empty 空状态（宽高自适应居中显示）</span>
-        <span class="demo-box-title-desc">空状态时的占位提示。</span>
-      </div>
-      <div class="demo-box-content">
-        <nb-empty />
-        <nb-empty text="未查询到相关数据" />
-        <nb-empty text="未查询到相关数据">
-          <nb-button type="primary" plain size="small" svg-icon="refresh">刷新</nb-button>
-        </nb-empty>
-      </div>
-      <div class="demo-box-content">
-        <nb-empty icon="search" text="未查询到相关数据" />
-        <nb-empty icon="data" text="未检测到出入库数据" />
-        <nb-empty icon="abnormal" text="未检测到出入库数据" />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup></script>
-
-<style lang="scss" scoped>
-.demo-box-content {
-  height: 900px;
-  display: flex;
-}
-</style>

package/src/demos/FooterMenu.vue

@@ -1,49 +0,0 @@
-<!--
- * @Author: chenghuan.dong
- * @Date: 2023-07-04 20:47:56
- * @LastEditors: chenghuan.dong
- * @LastEditTime: 2023-07-06 09:53:04
- * @Description: 
--->
-<template>
-  <div>
-    <div class="demo-box">
-      <div class="demo-box-title">
-        <span class="demo-box-title-name">底部导航（高度96px）</span>
-      </div>
-      <div class="demo-box-content">
-        <nb-menu position="footer" :data="menus" :active="activeMenu" @change="handleChangeMenu" />
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref } from "vue";
-
-const menus = ref(
-  [
-    { text: "修改密码", value: '修改密码' },
-    { text: "工卡绑定", value: '工卡绑定'},
-    { text: "指纹绑定", value: '指纹绑定'},
-    { text: "人脸绑定", value: '人脸绑定', import: true},
-    { text: "取用未归还记录", value: '取用未归还记录', disabled: true },
-    { text: "日清统计", value: '日清统计', badge: 5 },
-  ]
-);
-const activeMenu = ref(menus.value[0].value)
-const handleChangeMenu = (item) => {
-  activeMenu.value = item.value
-}
-</script>
-
-<style lang="scss" scoped>
-.demo-box-content {
-  display: flex;
-  flex-direction: column;
-  .nb-menu {
-    margin-bottom: 30px;
-  }
-}
-
-</style>

package/src/demos/Header.vue

@@ -1,71 +0,0 @@
-<!--
- * @Author: chenghuan.dong
- * @Date: 2023-07-04 20:47:56
- * @LastEditors: chenghuan.dong
- * @LastEditTime: 2023-07-25 15:27:38
- * @Description: 
--->
-<template>
-  <div>
-    <div class="demo-box">
-      <div class="demo-box-title">
-        <span class="demo-box-title-name">标题栏（高度80px）</span>
-      </div>
-      <div class="demo-box-content">
-        <nb-menu position="header" title="取还" @back="handleBack" @logout="handleLogout" />
-        <nb-menu position="header" title="取还详情" :show-back="false" :show-logout="false" />
-        <nb-menu position="header" title="取还详情" backText="返回主页" :show-logout="false" @logout="handleLogout" />
-        <nb-menu position="header" :data="menus" :active="activeMenu" @change="handleChangeMenu" @back="handleBack" @logout="handleLogout" />
-        <nb-menu position="header">
-          <template #left>
-            <div class="header-left">当前用户：管理员</div>
-          </template>
-          <template #title>自定义标题</template>
-          <template #right>
-            <div class="header-right">
-              <span>账盘</span>
-              <strong>4000</strong>
-              <span>实盘</span>
-              <strong>333</strong>
-            </div>
-          </template>
-        </nb-menu>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script setup>
-import { ref } from "vue";
-
-const menus = ref(
-  [
-    { text: "按柜取还", value: '按柜取还' },
-    { text: "自由取还", value: '自由取还'},
-    { text: "检索取还", value: '检索取还'}
-  ]
-);
-const activeMenu = ref(menus.value[0].value)
-const handleChangeMenu = (item) => {
-  activeMenu.value = item.value
-}
-const handleBack = () => {
-  alert('返回')
-}
-const handleLogout = () => {
-  alert('退出登录')
-}
-</script>
-
-<style lang="scss" scoped>
-.demo-box-content {
-  display: flex;
-  flex-direction: column;
-  .nb-menu {
-    margin-bottom: 30px;
-  }
-  .header-left{flex: 1;font-size: 32px;line-height: 42px;margin-left: 16px;}
-  .header-right{flex: 1;display: flex;align-items: center;justify-content: flex-end;text-align: right;font-size: 24px;line-height: 42px;}
-}
-
-</style>