|
@@ -0,0 +1,58 @@
|
|
|
+<template>
|
|
|
+ <section class="all-useCase">
|
|
|
+ <div class="control-pages">
|
|
|
+ <span class="control-item" :class="{'is-active':isActive === 1}" @click="isActive=1">需求用例</span>
|
|
|
+ <span class="control-item" :class="{'is-active':isActive === 2}" @click="isActive=2">老版用例</span>
|
|
|
+ </div>
|
|
|
+ <keep-alive>
|
|
|
+ <requirement-case v-if="isActive === 1" />
|
|
|
+ <test-use-case v-if="isActive === 2" />
|
|
|
+ </keep-alive>
|
|
|
+ </section>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import requirementCase from '@/views/useCase/components/requirementCase'
|
|
|
+import testUseCase from '@/views/Platform/useCasePage'
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ requirementCase,
|
|
|
+ testUseCase
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ isActive: 1
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ isActive: {
|
|
|
+ handler(newV) {
|
|
|
+ newV > 0
|
|
|
+ ? this.$router.replace({ path: this.$route.path, query: { ...this.$route.query, page: newV }})
|
|
|
+ : this.$router.replace({ path: this.$route.path, query: { ...this.$route.query, page: 1 }})
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.isActive = this.$route.query.page ? Number(this.$route.query.page) : 1
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style scoped lang="scss">
|
|
|
+.control-pages {
|
|
|
+ margin: 10px 10px 0 10px;
|
|
|
+ padding: 10px 20px 10px 20px;
|
|
|
+ border-radius: 4px;
|
|
|
+ background-color: #ffffff;
|
|
|
+ .control-item {
|
|
|
+ margin-right: 30px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .is-active {
|
|
|
+ color:#4099ff;
|
|
|
+ border-bottom: 1px solid #4099ff;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|