增加任务奖励设置

src/api/gift.js

@@ -0,0 +1,42 @@
+import $http from '@/utils/httpRequest'
+function add(data) {
+    return $http({
+        url: 'app/taskCenterReward/insertTaskCenterReward',
+        method: 'post',
+        data: data
+    })
+}
+function del(id) {
+    return $http({
+        url: 'app/taskCenterReward/deleteTaskCenterReward?id='+id,
+        method: 'post',
+        data:{id}
+    })
+}
+function getList(data) {
+    return $http({
+        url: 'app/taskCenterReward/selectTaskCenterReward',
+        method: 'get',
+        params: data
+    })
+}
+function get(id) {
+    return $http({
+        url: 'app/taskCenterReward' + id,
+        method: 'get',
+        params: data
+    })
+}
+function update(data) {
+    return $http({
+        url: 'app/taskCenterReward/updateTaskCenterReward',
+        method: 'post',
+        data: data
+    })
+}
+export default {
+    add
+    , del,
+    get, getList,
+    update
+}

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

@@ -0,0 +1,144 @@
+<template>
+  <el-dialog
+    :title="title"
+    width="800px"
+    top="20px"
+    :visible.sync="dialogVisible"
+    @close="diaClose"
+    :close-on-click-modal="true"
+  >
+    <div style="max-height: 70vh; overflow-y: scroll">
+      <el-form ref="table" :rules="rules" :model="form" label-width="100px">
+        <el-form-item label="奖励名称" required>
+          <el-input v-model="form.name"></el-input>
+        </el-form-item>
+        <el-form-item label="奖励类型" required>
+          <el-radio-group v-model="form.type">
+            <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="数量" required>
+          <el-input-number
+            :min="0"
+            :step="1"
+            :step-strictly="form.type == 9 ? true : false"
+            v-model="form.number"
+          ></el-input-number>
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="dialog-footer">
+      <el-button @click="diaClose">取 消</el-button>
+      <el-button type="primary" @click="confirm">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import $api from "@/api/gift.js";
+
+export default {
+  data() {
+    return {
+      dialogVisible: false,
+      title: "",
+      rules: {
+        title: [{ required: true, message: "请输入任务名称", trigger: "blur" }],
+      },
+      renwu: {},
+      form: {
+        id: "",
+        name: "",
+        number: "",
+        type: "",
+      },
+    };
+  },
+  methods: {
+    uploadSuccess(file) {
+      this.form.rewardImg = file.data;
+      console.log(this.form.rewardImg);
+    },
+    open(item, renwu) {
+      console.log(item);
+      this.dialogVisible = true;
+      this.renwu = renwu;
+      Object.assign(this.form, item);
+      this.title = item ? "修改奖励" : "添加奖励";
+    },
+    diaClose() {
+      this.dialogVisible = false;
+      this.form = {
+        id: "",
+        name: "",
+        number: "",
+        type: "",
+      };
+      this.renwu={}
+    },
+    async confirm() {
+      if (!this.form.name) {
+        return this.$message.error("请输入奖励名称");
+      }
+      if (!this.form.type) {
+        return this.$message.error("请选择奖励类型");
+      }
+      if (this.form.number <= 0) {
+        return this.$message.error("奖励数量不能小于0");
+      }
+
+      this.submit();
+    },
+    async submit() {
+      let res = { data: { code: 1 } };
+      const submitForm = {
+        taskId: this.renwu.id,
+        ...this.form,
+      };
+      if (this.form.id) {
+        res = await $api.update(submitForm);
+      } else {
+        res = await $api.add(submitForm);
+      }
+      console.log(res);
+      const { data } = res;
+      if (data.code == 0) {
+        this.$message.success(this.form.id ? "修改成功" : "添加成功");
+        this.$emit("refresh");
+        this.diaClose();
+      } else {
+        this.$message.error(data.msg);
+      }
+    },
+  },
+};
+</script>
+<style scoped lang="scss">
+.el-form-item__label {
+  text-align: left;
+}
+::v-deep .el-form-item__label {
+  text-align: left;
+}
+.dialog-footer {
+  padding-top: 20px;
+}
+.upload-file-box {
+  border-radius: 6px;
+  width: 148px;
+  height: 148px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  overflow: hidden;
+  border: 1px solid #c0c4cc;
+  img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+}
+</style>

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

@@ -20,6 +20,7 @@
         </el-form-item>
         <el-form-item label="任务类型" required>
           <el-radio-group v-model="form.type">
+            <el-radio :label="3">一次性任务</el-radio>
             <el-radio :label="1">普通任务</el-radio>
             <el-radio :label="2">打卡任务</el-radio>
             <el-radio :label="9">其他</el-radio>
@@ -39,7 +40,10 @@
             </div>
           </el-upload>
         </el-form-item>
-        <el-form-item label="跳转类型" required>
+        <el-form-item label="是否跳转" >
+          <el-switch v-model="isJump"></el-switch>
+        </el-form-item>
+        <el-form-item label="跳转类型" required v-if="isJump">
           <el-radio-group v-model="form.jumpType">
             <el-radio :label="1">内部路径</el-radio>
             <el-radio :label="2">外部路径</el-radio>
@@ -88,6 +92,7 @@ export default {
       rules: {
         title: [{ required: true, message: "请输入任务名称", trigger: "blur" }],
       },
+      isJump:false,
       form: {
         url: "",
         type: 1,
@@ -145,6 +150,9 @@ export default {
       if(!this.form.title){
         return this.$message.error("请输入任务名称");
       }
+      if(!this.form.type){
+        return this.$message.error("请输入任务类型");
+      }
       if(!this.form.buttonUrl){
         return this.$message.error("请输入按钮跳转地址");
       }

src/views/renwu/components/pop-gift-list.vue

@@ -0,0 +1,158 @@
+<template>
+  <div>
+    <el-dialog
+      title="任务奖励"
+      width="1000px"
+      top="20px"
+      :visible.sync="dialogVisible"
+      @close="diaClose"
+      :close-on-click-modal="true"
+    >
+      <div class="">
+        <el-button type="primary" @click="openAdd">添加奖励</el-button>
+        <div class="zhanwei"></div>
+        <el-table :border="true" :data="tableData">
+          <el-table-column label="奖励名称" prop="name"></el-table-column>
+          <el-table-column label="奖励类型">
+            <template slot-scope="scope">
+              <span>{{ returnTypeName(scope.row.type) }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="数量">
+            <template slot-scope="scope">
+              <span>{{ scope.row.number }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="编辑">
+            <template slot-scope="scope">
+              <el-button type="text" size="mini" @click="openAdd(scope.row)"
+                >编辑</el-button
+              >
+              <el-button type="text" size="mini" @click="del(scope.row)"
+                >删除</el-button
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pagination">
+          <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :page-sizes="[10, 20, 30, 40]"
+            :page-size="limit"
+            :current-page="page"
+            layout="total,sizes, prev, pager, next,jumper"
+            :total="total"
+          >
+          </el-pagination>
+        </div>
+      </div>
+    </el-dialog>
+    <add-gift ref="addGift" @refresh="init"></add-gift>
+  </div>
+</template>
+  
+  <script>
+import $api from "@/api/gift.js";
+import addGift from "./pop-add-gift.vue";
+export default {
+  components: { addGift },
+  data() {
+    return {
+      dialogVisible: false,
+      total: 0,
+      tableData: [],
+      page: 1,
+      limit: 10,
+      renwu: {},
+    };
+  },
+  methods: {
+    open(item) {
+      this.renwu = item;
+      this.init();
+      this.dialogVisible = true;
+    },
+    diaClose() {
+      this.dialogVisible = false;
+    },
+    async showsChange(e, item) {
+      console.log(e);
+      const res = await $api.update({ ...item, shows: e });
+      if (res.data.code == 0) {
+        this.$message.success("修改成功");
+        this.init();
+      } else {
+        this.$message.error(res.data.msg || "修改失败");
+      }
+    },
+    handleSizeChange() {
+      this.page = 1;
+      this.init();
+    },
+    handleCurrentChange(val) {
+      this.page = val;
+      this.init();
+    },
+    returnJumpTypeName(type) {
+      const $types = {
+        1: "内部路径",
+        2: "外部路径",
+        3: "内部tabbar页面",
+      };
+      return $types[type] ? $types[type] : "";
+    },
+    returnTypeName(type) {
+      const $types = {
+        1: "金豆",
+        2: "现金红包",
+        9: "大转盘抽奖次数",
+      };
+      return $types[type] ? $types[type] : "";
+    },
+    //数据初始化
+    async init() {
+        const {id}=this.renwu;
+      const { data } = await $api.getList({
+        taskId:id,
+        page: this.page,
+        limit: this.limit,
+      });
+      this.tableData = data.data.records;
+      this.total = data.data.total;
+    },
+    del(item) {
+      this.$confirm("是否删除该任务?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          $api.del(item.id).then((res) => {
+            const data = res.data;
+            if (data.code == 0) {
+              this.$message.success("删除成功");
+              this.init();
+            } else {
+              this.$message.error(data.msg || "删除失败");
+            }
+          });
+        })
+        .catch(() => {});
+    },
+    openAdd(item) {
+      this.$refs.addGift.open(item, this.renwu);
+    },
+  },
+  mounted() {},
+};
+</script>
+  <style scoped lang="scss">
+.zhanwei {
+  height: 20px;
+}
+.pagination {
+  margin-top: 20px;
+  display: flex;
+}
+</style>

src/views/renwu/index.vue

@@ -21,7 +21,17 @@
           <span>{{ scope.row.detail }}</span>
         </template>
       </el-table-column>
-
+      <el-table-column label="奖励设置">
+        <template slot-scope="scope">
+          <div class="flex flex-center">
+            <el-button type="text" size="mini" @click="opengiftList(scope.row)"
+            >编辑</el-button
+          >
+          </div>
+          
+          <!-- <span>{{ scope.row.rewardDetail }}</span> -->
+        </template>
+      </el-table-column>
       <el-table-column label="奖励描述">
         <template slot-scope="scope">
           <span>{{ scope.row.rewardDetail }}</span>
@@ -81,15 +91,17 @@
       </el-pagination>
     </div>
     <add-renwu ref="refRenwu" @refresh="init"></add-renwu>
+    <gift-list ref="giftList" @refresh="init"></gift-list>
   </div>
 </template>
 
 <script>
 import $api from "@/api/renwu.js";
 import addRenwu from "./components/pop-add-renwu.vue";
+import giftList from "./components/pop-gift-list.vue";
 
 export default {
-  components: { addRenwu },
+  components: { addRenwu,giftList },
   data() {
     return {
       total: 0,
@@ -99,6 +111,9 @@ export default {
     };
   },
   methods: {
+    opengiftList(item){
+      this.$refs.giftList.open(item)
+    },
     async showsChange(e,item){
       console.log(e)
       const res=await $api.update({...item,shows:e})
@@ -178,4 +193,11 @@ export default {
   margin-top: 20px;
   display: flex;
 }
+// .flex{
+//   display: flex;
+// } 
+// .flex-center{
+//   justify-content: center;
+// }
+
 </style>