@bdsoft/element 1.1.9 → 1.1.11

package/src/components/layout/banner.vue

@@ -1,412 +0,0 @@
-<!--
-* @FileDescription:  首页大banner展示
-* @Author: 李兵泉
-* @Date: 2021-06-08 09 时
-* @LastEditors: 最后更新作者
-* @LastEditTime: 最后更新时间
--->
-<script setup>
-import { ref, reactive, computed, watch, onMounted } from "vue";
-const props = defineProps({
-    waprstyle: {
-        type: Object,
-        default: () => { }
-    },
-    title1: {
-        type: String,
-        default: '综合研究成果管理平台'
-    },
-    title2: {
-        type: String,
-        default: '面向勘探开发研究院的成果管理及共享平台'
-    },
-})
-</script>
-<template>
-    <div class="banner" :style="waprstyle">
-        <div class="banner-center">
-            <div class="banner-text">
-                <h3>{{ title1 }}</h3>
-                <h4>{{ title2 }}</h4>
-
-            </div>
-            <div class="banner-img">
-                <img src="../../assets/images/po-i.png" alt="" class="pos">
-                <span class="po1">
-                    <img src="../../assets/images/po1-i1.png" alt="" class="po1-i1">
-                    <img src="../../assets/images/po1-i2.png" alt="" class="po1-i2">
-                    <img src="../../assets/images/po1-i3.png" alt="" class="po1-i3">
-                    <img src="../../assets/images/po1-i4.png" alt="" class="po1-i4">
-                    <img src="../../assets/images/po1-i5.png" alt="" class="po1-i5">
-                    <img src="../../assets/images/po1-i6.png" alt="" class="po1-i6">
-                    <img src="../../assets/images/po1-i7.png" alt="" class="po1-i7">
-                    <img src="../../assets/images/po1-i8.png" alt="" class="po1-i8 i1">
-                    <img src="../../assets/images/po1-i8.png" alt="" class="po1-i8 i2">
-                    <img src="../../assets/images/po1-i8.png" alt="" class="po1-i8 i3">
-                    <img src="../../assets/images/po1-i8.png" alt="" class="po1-i8 i4">
-                    <img src="../../assets/images/po1-i8.png" alt="" class="po1-i8 i5">
-                    <img src="../../assets/images/po1-i8.png" alt="" class="po1-i8 i6">
-                    <img src="../../assets/images/po1-i8.png" alt="" class="po1-i8 i7">
-                    <img src="../../assets/images/po1-i8.png" alt="" class="po1-i8 i8">
-                </span>
-                <span class="po2">
-                    <img src="../../assets/images/po2-i1.png" alt="" class="po2-i1">
-                    <img src="../../assets/images/po2-i2.png" alt="" class="po2-i2">
-                </span>
-                <img src="../../assets/images/po3-i1.png" alt="" class="po3">
-                <span class="po4">
-                    <img src="../../assets/images/po4-i1.png" alt="" class="po4-i1">
-                    <img src="../../assets/images/po4-i2.png" alt="" class="po4-i2">
-                </span>
-                <img src="../../assets/images/po5-i1.png" alt="" class="po5">
-                <span class="po6">
-                    <img src="../../assets/images/po6-i2.png" alt="" class="po6-i2">
-                    <img src="../../assets/images/po6-i1.png" alt="" class="po6-i1">
-                </span>
-                <span class="po6 po62">
-                    <img src="../../assets/images/po6-i2.png" alt="" class="po6-i2">
-                    <img src="../../assets/images/po6-i1.png" alt="" class="po6-i1">
-                </span>
-                <img src="../../assets/images/po7-i1.png" alt="" class="po7">
-            </div>
-        </div>
-    </div>
-</template>
-
-<style lang="scss" scoped>
-.banner {
-    background: url(../../assets/images/images/banner.png);
-    background-position: center center;
-    background-repeat: no-repeat;
-    background-color: #3186FB;
-    height: 574px;
-
-    .banner-center {
-        position: relative;
-        margin: 0 auto;
-        max-width: 1200px;
-        height: 100%;
-        // clear: both;
-
-        .banner-text {
-            position: absolute;
-            width: 43%;
-            color: #fff;
-            left: 30px;
-            top: 50%;
-            transform: translate(0, -50%);
-
-            h3 {
-                font-size: 24px;
-                margin-bottom: 25px;
-            }
-
-            h4 {
-                font-size: 19px;
-                margin-bottom: 17px;
-                font-weight: normal;
-            }
-        }
-
-        .banner-img {
-            width: 540px;
-            height: 335px;
-            position: absolute;
-            right: 30px;
-            top: 50%;
-            transform: translate(0, -50%);
-
-            img,
-            span {
-                position: absolute;
-            }
-
-            .pos {
-                width: 100%;
-                height: 91.77%;
-                bottom: 0;
-                right: 0;
-            }
-
-            .po1 {
-                width: 12.55%;
-                height: 32.94%;
-                left: 41%;
-                top: 8%;
-
-                .po1-i1 {
-                    width: 79.07%;
-                    height: 28.57%;
-                    left: 15%;
-                    bottom: 0;
-                    animation: topOp2 2s linear infinite;
-                    opacity: 0;
-                }
-
-                .po1-i2 {
-                    width: 61.62%;
-                    height: 22.14%;
-                    left: 23%;
-                    bottom: 19%;
-                    animation: topOp2 2s linear infinite;
-                    opacity: 0;
-                }
-
-                .po1-i3 {
-                    width: 45.45%;
-                    height: 16.43%;
-                    left: 31%;
-                    bottom: 33%;
-                    animation: topOp2 2s linear infinite;
-                    opacity: 0;
-                }
-
-                .po1-i4 {
-                    width: 36.05%;
-                    height: 12.86%;
-                    left: 36%;
-                    bottom: 45%;
-                    animation: topOp2 2s linear infinite;
-                    opacity: 0;
-                }
-
-                .po1-i5 {
-                    width: 4.65%;
-                    height: 2.86%;
-                    left: 15%;
-                    bottom: 35%;
-                }
-
-                .po1-i6 {
-                    width: 10.46%;
-                    height: 6.43%;
-                    left: 27%;
-                    bottom: -2%;
-                }
-
-                .po1-i7 {
-                    width: 8.14%;
-                    height: 5%;
-                    left: 91%;
-                    bottom: 24%;
-                }
-
-                .po1-i8 {
-                    width: 3.49%;
-                    height: 20.71%;
-                }
-
-                .po1-i8.i1 {
-                    left: 85%;
-                    top: 28%;
-                    animation: topOp 1s linear infinite;
-                    opacity: 0;
-                }
-
-                .po1-i8.i2 {
-                    left: 54%;
-                    top: 48%;
-                    animation: topOp 1s linear 0.2s infinite;
-                    opacity: 0;
-                }
-
-                .po1-i8.i3 {
-                    left: 38%;
-                    top: 23%;
-                    animation: topOp 1s linear 0.6s infinite;
-                    opacity: 0;
-                }
-
-                .po1-i8.i4 {
-                    left: 49%;
-                    top: 11%;
-                    animation: topOp 1s linear 0.3s infinite;
-                    opacity: 0;
-                }
-
-                .po1-i8.i5 {
-                    left: 43%;
-                    top: 57%;
-                    animation: topOp 1s linear 0.1s infinite;
-                    opacity: 0;
-                }
-
-                .po1-i8.i6 {
-                    left: 23%;
-                    top: 34%;
-                    animation: topOp 1s linear 0.7s infinite;
-                    opacity: 0;
-                }
-
-                .po1-i8.i7 {
-                    left: 68%;
-                    top: 7%;
-                    animation: topOp 1s linear 0.4s infinite;
-                    opacity: 0;
-                }
-
-                .po1-i8.i8 {
-                    left: 64%;
-                    top: 32%;
-                    animation: topOp 1s linear 0.5s infinite;
-                    opacity: 0;
-                }
-            }
-
-            .po2 {
-                width: 18.98%;
-                height: 22.82%;
-                left: 3%;
-                top: 45%;
-
-                .po2-i1 {
-                    width: 46.15%;
-                    height: 100%;
-                    left: 0;
-                    top: 0;
-                    animation: topDown1 3s linear infinite;
-                }
-
-                .po2-i2 {
-                    width: 22.31%;
-                    height: 42.27%;
-                    right: 0;
-                    top: 21%;
-                }
-            }
-
-            .po3 {
-                width: 15.33%;
-                height: 27.53%;
-                left: 14%;
-                top: 15%;
-                animation: topDown1 3.5s linear infinite;
-            }
-
-            .po4 {
-                width: 18.1%;
-                height: 20.7%;
-                right: 13%;
-                top: 14%;
-
-                .po4-i1 {
-                    width: 43.6%;
-                    height: 100%;
-                    right: 0;
-                    top: 0;
-                    animation: topDown1 2.1s linear infinite;
-                }
-
-                .po4-i2 {
-                    width: 23%;
-                    height: 46.6%;
-                    left: 0;
-                    top: 36%;
-                }
-            }
-
-            .po5 {
-                width: 9.05%;
-                height: 22.89%;
-                right: 22.8%;
-                top: 49%;
-            }
-
-            .po6,
-            .po62 {
-                width: 4.53%;
-                height: 15.29%;
-                right: 39%;
-                top: -1%;
-
-                .po6-i1 {
-                    width: 100%;
-                    height: 90.77%;
-                    left: 0;
-                    bottom: 0;
-                    animation: huoMiao2 2s linear infinite;
-                }
-
-                .po6-i2 {
-                    width: 83.87%;
-                    height: 80%;
-                    left: 8%;
-                    top: 0%;
-                    animation: topDown1 2.5s linear infinite;
-                }
-            }
-
-            .po62 {
-                right: 49.5%;
-                top: 68%;
-            }
-
-            .po7 {
-                width: 8.75%;
-                height: 16.71%;
-                left: -22.8%;
-                bottom: 0;
-            }
-        }
-    }
-}
-
-@keyframes topOp {
-    0% {
-        transform: translate(0px, 0px);
-        -webkit-transform: translate(0px, 0px);
-        opacity: 1;
-    }
-
-    100% {
-        transform: translate(0, -35px);
-        -webkit-transform: translate(0, -35px);
-        opacity: 0;
-    }
-}
-
-@keyframes topOp2 {
-    0% {
-        transform: translate(0px, 0px);
-        -webkit-transform: translate(0px, 0px);
-        opacity: 0;
-    }
-
-    100% {
-        transform: translate(0, -10px);
-        -webkit-transform: translate(0, -10px);
-        opacity: 1;
-    }
-}
-
-@keyframes topDown1 {
-    0% {
-        transform: translate(0px, 0px);
-        -webkit-transform: translate(0px, 0px);
-    }
-
-    50% {
-        transform: translate(0, -8px);
-        -webkit-transform: translate(0, -8px);
-    }
-
-    100% {
-        transform: translate(0px, 0px);
-        -webkit-transform: translate(0px, 0px);
-    }
-}
-
-@keyframes huoMiao2 {
-    0% {
-        height: 75%;
-    }
-
-    50% {
-        height: 100%;
-    }
-
-    100% {
-        height: 75%;
-    }
-}
-</style>

package/src/components/layout/bar.vue

@@ -1,43 +0,0 @@
-<!--
-* @FileDescription:  
-* @Author: 李兵泉
-* @Date: 2021-06-08 09 时
-* @LastEditors: 最后更新作者
-* @LastEditTime: 最后更新时间
--->
-<script setup>
-import { ref, useAttrs, computed, watch, onMounted } from "vue";
-const props = defineProps({
-    innerHeight: {
-        type: String,
-        default: '50px'
-    },
-    paddingTop: {
-        type: String,
-        default: '15px'
-    },
-    paddingLeft: {
-        type: String,
-        default: '0px'
-    }
-});
-let attrs = useAttrs();
-const style = attrs.style;
-
-</script>
-<template>
-    <div class="headwarp" :style="{ style }">
-        <div class="headwarp-top" :style="{ height: innerHeight }">
-            <div class="headwarp-bottom" :style="{ paddingTop: paddingTop,paddingLeft: paddingLeft }">
-                <slot></slot>
-            </div>
-        </div>
-    </div>
-</template>
-
-<style lang="scss" scoped>
-.headwarp-bottom {
-    line-height: 100% !important;
-    height: 100% !important;
-}
-</style>

package/src/components/layout/layout1.vue

@@ -1,60 +0,0 @@
-<script setup>
-import { computed } from 'vue';
-
-// 项目中引入base.scss文件(去掉下面的样式)或者 不引入公共文件 添加下面的style样式
-// 左右布局
-const props = defineProps({
-  title: {
-    type: String,
-    default: '左侧菜单栏'
-  },
-  // 左侧宽度
-  leftWidth: {
-    type: String,
-    default: '200px'
-  },
-  // 左侧样式配置
-  leftStyles: {
-    type: Object,
-    default: () => {
-      return {
-        padding: '0px',
-        margin: '0px 10px 0px 0px'
-      }
-    }
-  },
-  // 右侧样式配置
-  rightStyles: {
-    type: Object,
-    default: () => {
-      return {
-        padding: '0px',
-        margin: '10px 10px 0px 0px'
-      }
-    }
-  }
-
-});
-// 是否显示标题栏
-const showLeftTop = computed(() => {
-  return props.title ? true : false
-})
-</script>
-
-<template>
-  <el-container class="containerBg">
-    <el-aside :width="leftWidth" :style="{ ...leftStyles }">
-      <div class="top" v-if="showLeftTop">
-        <div class="topin">{{ title }}</div>
-      </div>
-      <!-- 左侧区域 -->
-      <slot name="left"></slot>
-    </el-aside>
-    <el-main class="containerRight" :style="{ ...rightStyles }">
-      <!-- 侧区域 -->
-      <slot></slot>
-    </el-main>
-  </el-container>
-</template>
-
-<style scoped></style>

package/src/components/layout/layout2.vue

@@ -1,134 +0,0 @@
-<script setup>
-import { ref,computed } from 'vue'
-// 项目中引入base.scss文件(去掉下面的样式)或者 不引入公共文件 添加下面的style样式
-import { Search } from '@element-plus/icons-vue'
-const emits = defineEmits(['searchTable'])
-const props = defineProps({
-  title: {
-    type: String,
-    default: '左侧菜单栏'
-  },
-  leftWidth: {
-    type: String,
-    default: '200px'
-  },
-  leftStyles: {
-    type: Object,
-    default: () => {
-      return {
-        padding: '0px',
-        margin: '0px 10px 0px 0px'
-      }
-    }
-  },
-  // 右侧样式配置
-  rightStyles: {
-    type: Object,
-    default: () => {
-      return {
-        padding: '0px',
-        margin: '0px 0px 10px 0px'
-      }
-    }
-  }
-})
-const searchValue = ref('')
-
-// 是否显示标题栏
-const showLeftTop = computed(() => {
-  return props.title ? true : false
-})
-// 搜索
-const getTableData = () => {
-  emits('searchTable', searchValue.value)
-}
-</script>
-
-<template>
-  <el-container class="containerBg">
-    <el-aside :width="leftWidth" :style="{ ...leftStyles }">
-      <div class="top" v-if="showLeftTop">
-        <div class="topin">{{ title }}</div>
-      </div>
-      <slot name="left"></slot>
-    </el-aside>
-    <el-container
-      style="background-color: #fff; margin: 10px 10px 10px 0; height: calc(100% - 20px); border-radius: 4px">
-      <el-header height="50px" class="headwarp" style="border-bottom: 1px solid #e6e6e6; border-radius: 4px 4px 0 0">
-        <div class="headwarp-top" style="border-radius: 4px">
-          <div class="headwarp-bottom" style="padding-left: 0px;">
-            <slot name="lefttop">
-              <span class="warpmenu" @click="addTable" title="添加">
-                <img class="menuimg" src="../../assets/images/menu/add.png" />
-                添加
-              </span>
-              <span class="warpmenu" @click="editTable" title="编辑"> <img class="menuimg"
-                  src="../../assets/images/menu/edit.png" /> 编辑 </span>
-              <span class="warpmenu" @click="delTable" title="删除"> <img class="menuimg"
-                  src="../../assets/images/menu/del.png" /> 删除</span>
-              <el-divider direction="vertical" />
-            </slot>
-          </div>
-          <div class="top_right" style="width: 200px">
-            <slot name="righttop2">
-              <!-- 报表搜索 righttop-->
-              <el-input v-model="searchValue" placeholder="全局搜索" size="default" @keyup.enter="getTableData(true, true)"
-                clearable @clear="getTableData()" :prefix-icon="Search" class="top_search"> </el-input>
-            </slot>
-          </div>
-        </div>
-      </el-header>
-      <el-main class="main-container" :style="{ ...rightStyles }">
-        <slot></slot>
-      </el-main>
-    </el-container>
-  </el-container>
-</template>
-
-<style lang="scss" scoped>
-.headwarp{
- padding: 0 10px !important ;
-}
-.headwarp-top{
- 
-}
-.headwarp-bottom {
-  display: flex;
-  height: 100%;
-  .warpmenu{
-     display: flex;
-     justify-content: center;
-     align-items: center;
-  }
-}
-
-// 右侧用户信息
-.top_right {
-  position: absolute;
-  right: 10px;
-  top: 0px;
-  height: 100%;
-  /*width:400px;*/
-  color: #fff; // #8c8c8c;
-  font-size: 14px;
-  margin-right: 10px;
-
-  a {
-    color: #fff; // #8c8c8c;
-    margin: 10px 8px 0 5px;
-    cursor: pointer;
-  }
-}
-
-.top_search {
-  border-radius: 30px;
-  width: 180px;
-  float: right;
-  padding-top: 10px;
-  padding-right: 20px;
-
-  :deep(.el-input__wrapper) {
-    border-radius: 20px;
-  }
-}
-</style>