修改任务设置页面

src/views/renwu/components/pop-add-renwu.vue

@@ -12,18 +12,24 @@
         <el-form-item label="标题" required>
           <el-input v-model="form.title"></el-input>
         </el-form-item>
-        <el-form-item label="是否展示" >
+        <el-form-item label="是否展示">
-          <el-switch v-model="form.shows" :inactive-value="0" :active-value="1"></el-switch>
+          <el-switch
+            v-model="form.shows"
+            :inactive-value="0"
+            :active-value="1"
+          ></el-switch>
         </el-form-item>
-        <el-form-item label="排序" >
+        <el-form-item label="排序">
-          <el-input-number :min="0" :step-strictly="true" :step="1" v-model="form.sort"></el-input-number>
+          <el-input-number
+            :min="0"
+            :step-strictly="true"
+            :step="1"
+            v-model="form.sort"
+          ></el-input-number>
         </el-form-item>
         <el-form-item label="任务类型" required>
           <el-radio-group v-model="form.type">
-            <el-radio :label="3">一次性任务</el-radio>
+            <el-radio :label="value*1" v-for="(item, value) in renType" :key="value" >{{item}}</el-radio>
-            <el-radio :label="1">普通任务</el-radio>
-            <el-radio :label="2">打卡任务</el-radio>
-            <el-radio :label="9">其他</el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="奖励图标">
@@ -40,26 +46,32 @@
             </div>
           </el-upload>
         </el-form-item>
-        <el-form-item label="是否跳转" >
+        <el-form-item label="是否跳转">
           <el-switch v-model="isJump"></el-switch>
         </el-form-item>
-        <el-form-item label="跳转类型" required v-if="isJump">
+        <template v-if="isJump">
-          <el-radio-group v-model="form.jumpType">
+          <el-form-item label="跳转类型" required>
-            <el-radio :label="1">内部路径</el-radio>
+            <el-radio-group v-model="form.jumpType">
-            <el-radio :label="2">外部路径</el-radio>
+            <el-radio :label="value*1" v-for="(item, value) in jumpType" :key="value" >{{item}}</el-radio>
-            <el-radio :label="3">内部tabbar页面</el-radio>
+            </el-radio-group>
-          </el-radio-group>
+          </el-form-item>
-        </el-form-item>
+          <el-form-item label="按钮跳转地址" required>
-        <el-form-item label="按钮跳转地址" required>
+            <el-input v-model="form.buttonUrl"></el-input>
-          <el-input v-model="form.buttonUrl"></el-input>
+          </el-form-item>
-        </el-form-item>
+        </template>
+
         <el-form-item label="达标次数" required v-if="form.type == 2">
-          <el-input-number :min="0" :step-strictly="true" :step="1" v-model="form.number"></el-input-number>
+          <el-input-number
+            :min="0"
+            :step-strictly="true"
+            :step="1"
+            v-model="form.number"
+          ></el-input-number>
         </el-form-item>
         <el-form-item label="详情描述" required>
           <el-input v-model="form.detail"></el-input>
         </el-form-item>
-        <el-form-item label="奖励描述"  required>
+        <el-form-item label="奖励描述" required>
           <el-input v-model="form.rewardDetail"></el-input>
         </el-form-item>
         <el-form-item label="按钮背景色">
@@ -83,16 +95,18 @@
 
 <script>
 import $api from "@/api/renwu.js";
-
+import {$renwuType,$jumpType} from '../data.js'
 export default {
   data() {
     return {
       dialogVisible: false,
+      renType: $renwuType,
+      jumpType: $jumpType,
       title: "",
       rules: {
         title: [{ required: true, message: "请输入任务名称", trigger: "blur" }],
       },
-      isJump:false,
+      isJump: false,
       form: {
         url: "",
         type: 1,
@@ -106,8 +120,8 @@ export default {
         rewardDetail: "",
         rewardImg: "",
         title: "",
-        shows:1,
+        shows: 1,
-        sort:''
+        sort: "",
       },
     };
   },
@@ -123,11 +137,13 @@ export default {
         this.form = {
           ...item,
         };
+        this.isJump = item.jumpType ? true : false;
       }
       this.title = item ? "修改任务" : "新增任务";
     },
     diaClose() {
       this.dialogVisible = false;
+      this.isJump=false;
       this.form = {
         url: "",
         type: 1,
@@ -141,28 +157,27 @@ export default {
         rewardDetail: "",
         rewardImg: "",
         title: "",
-        shows:1,
+        shows: 1,
-        sort:''
+        sort: "",
       };
     },
     async confirm() {
-     
+      if (!this.form.title) {
-      if(!this.form.title){
         return this.$message.error("请输入任务名称");
       }
-      if(!this.form.type){
+      if (!this.form.type) {
         return this.$message.error("请输入任务类型");
       }
-      if(!this.form.buttonUrl){
+      if (this.isJump && !this.form.buttonUrl) {
         return this.$message.error("请输入按钮跳转地址");
       }
-      if(!this.form.detail){
+      if (!this.form.detail) {
-        this.$message.error("请输入详情描述");
+        return this.$message.error("请输入详情描述");
       }
-      if(!this.form.rewardDetail){
+      if (!this.form.rewardDetail) {
-        this.$message.error("请输入奖励描述");
+        return this.$message.error("请输入奖励描述");
       }
-      if(this.form.type == 2 && this.form.number<=0){
+      if (this.form.type == 2 && this.form.number <= 0) {
         return this.$message.error("请输入达标次数");
       }
       this.submit();

src/views/renwu/data.js

@@ -0,0 +1,11 @@
+export const $renwuType={
+    1:'一次性任务',
+    2:'普通任务',
+    3:'打卡任务',
+    9:'其他',
+}
+export const $jumpType={
+    1:'内部路径',
+    2:'外部路径',
+    3:'内部tabbar页面',
+}

src/views/renwu/index.vue

@@ -99,6 +99,7 @@
 import $api from "@/api/renwu.js";
 import addRenwu from "./components/pop-add-renwu.vue";
 import giftList from "./components/pop-gift-list.vue";
+import {$renwuType,$jumpType} from './data.js'
 
 export default {
   components: { addRenwu,giftList },
@@ -108,6 +109,8 @@ export default {
       tableData: [],
       page: 1,
       limit: 10,
+      renType: $renwuType,
+      jumpType: $jumpType,
     };
   },
   methods: {
@@ -133,20 +136,12 @@ export default {
       this.init();
     },
     returnJumpTypeName(type) {
-      const $types = {
+      console.log(type)
-        1: "内部路径",
+      console.log($jumpType[type])
-        2: "外部路径",
+      return $jumpType[type] ? $jumpType[type] : "";
-        3: "内部tabbar页面",
-      };
-      return $types[type] ? $types[type] : "";
     },
     returnTypeName(type) {
-      const $types = {
+      return $renwuType[type] ? $renwuType[type] : "";
-        1: "普通任务",
-        2: "打卡任务",
-        9: "其他",
-      };
-      return $types[type] ? $types[type] : "";
     },
     //数据初始化
     async init() {