添加开始页和结束页判断

guoshilong

2023-03-17 00239519ba9c0561ce7e3490e5cff27b68b5e077

添加开始页和结束页判断

 src/views/modules/function.vue

@@ -24,7 +24,8 @@
        <div class="func">
          <!--列表展示-->
          <div class="list">
            <el-tree v-if="funList.length >0" :data="funList" :props="defaultProps" node-key="id" @node-click="handleNodeClick">
            <el-tree v-if="funList.length >0" :data="funList" :props="defaultProps" node-key="id"
                     @node-click="handleNodeClick">
              <span class="custom-tree-node" slot-scope="{ node, data }">
                <span>{{ data.name }}</span>
                <span>
@@ -73,7 +74,7 @@
              </div>
            </div>

            <div style="height: 100%;width: 100%"  class="view" v-else>
            <div style="height: 100%;width: 100%" class="view" v-if="modelType == '预览'">
              <!--flash-->
              <div  v-if="content.type == 1">

@@ -81,15 +82,19 @@

              <!--图册-->
              <div style="height: 100%;width: 100%"  v-if="content.type == 2">
                <Flipbook class="flipbook" :pages="flipConfig.pages" :startPage="flipConfig.pageNum" v-slot="flipbook" ref="flipbook">
                <flipbook class="flipbook" :pages="flipConfig.pages" :startPage="flipConfig.pageNum" v-slot="flipbook"
                          ref="flipbook">
                  <div class="action-bar">
                    <left-icon class="btn left" :class="{ disabled: !flipbook.canFlipLeft }" @click="flipbook.flipLeft"/>
                    <left-icon class="btn left" :class="{ disabled: !flipbook.canFlipLeft }"
                               @click="flipbook.flipLeft"/>
                    <plus-icon class="btn plus" :class="{ disabled: !flipbook.canZoomIn }" @click="flipbook.zoomIn"/>
                    <span class="page-num">Page {{ flipbook.page }} of {{ flipbook.numPages }}</span>
                    <minus-icon class="btn minus" :class="{ disabled: !flipbook.canZoomOut }" @click="flipbook.zoomOut"/>
                    <right-icon class="btn right" :class="{ disabled: !flipbook.canFlipRight }" @click="flipbook.flipRight"/>
                    <minus-icon class="btn minus" :class="{ disabled: !flipbook.canZoomOut }"
                                @click="flipbook.zoomOut"/>
                    <right-icon class="btn right" :class="{ disabled: !flipbook.canFlipRight }"
                                @click="flipbook.flipRight"/>
                  </div>
                </Flipbook>
                </flipbook>
              </div>

              <!--视频-->
@@ -228,7 +233,7 @@
            type: 'upload',
            limit: 1,
            drag: true,
            loadText: '模板上传中，请稍等',
            loadText: '文件上传中，请稍等',
            accept: 'image/png, image/jpeg',
            propsHttp: {
              res: 'data',
@@ -410,6 +415,24 @@
    },
    handleSubmit(form, done) {
      form.modulesId = this.modules.id
      //限制只能有一个开始页和结束页
      if (form.property == 1 || form.property == 3) {
        let data = this.funList
        let filterArray = data.filter(e => {
          return e.property == form.property
        })
        if (filterArray.length > 0) {
          if (form.property == 1) {
            this.$message.warning("开始页已存在")
            done()
            return
          } else if (form.property == 3) {
            this.$message.warning("结束页已存在")
            done()
            return
          }
        }
      }
      if (!form.id) {
        add(form).then(() => {
          this.getAllFunc()

 src/views/modules/modulesView.vue

@@ -5,9 +5,11 @@
      <!-- 头部左侧按钮模块 -->
      <div class="avue-crud__left">
        <el-button size="small" class="button" icon="el-icon-back" @click="backModules">返回模块列表</el-button>
        <el-button size="small" class="button" icon="el-icon-back" @click="backStartPage">回到开始页</el-button>
      </div>
    </div>
    <div class="content-view">
      <!--开始页-->
      <div v-if="currentIndex==1" class="start">
        <img class="start-img" :src="startPage.fileUrl[0].value">
        <div class="start-button-group">
@@ -17,6 +19,7 @@
        </div>
      </div>

      <!--内容页-->
      <div style="height: 100%;width: 100%"  v-if="currentIndex==2" class="content">

        <!--flash-->
@@ -69,7 +72,6 @@

<script>
import {getAll} from "@/api/modules/function";
// import Flipbook from 'flipbook-vue/vue2'
import LeftIcon from 'vue-material-design-icons/ChevronLeftCircle'
import RightIcon from 'vue-material-design-icons/ChevronRightCircle'
import PlusIcon from 'vue-material-design-icons/PlusCircle'
@@ -98,7 +100,7 @@
      },
    }
  },
  mounted() {
  created() {
    this.getAllFunc()
  },
  methods: {
@@ -133,14 +135,18 @@
      if (data.type == 1) {

      } else if (data.type == 2) {
        let fileArray = data.fileUrl
        fileArray.forEach(e => {
          this.flipConfig.pages.push(e.value)
        })
        // let fileArray = data.fileUrl
        // fileArray.forEach(e => {
        //   this.flipConfig.pages.push(e.value)
        // })
      } else if (data.type == 3) {
        let url = data.fileUrl[0].value
        this.iframePath = 'http://192.168.0.200:8012/onlinePreview?url=' + encodeURIComponent(Base64.encode(url))
      }
    },
    backStartPage(){
      this.currentIndex = 1
      this.content = this.startPage
    }
  }
}