瀏覽代碼

feat: 现在二维码渠道管理页面

zhangyuhan 10 月之前
父節點
當前提交
067fe5dc14
共有 3 個文件被更改,包括 263 次插入2 次删除
  1. 4 2
      src/views/huiju/autoReply.vue
  2. 112 0
      src/views/huiju/editCode.vue
  3. 147 0
      src/views/huiju/qrCodeList.vue

+ 4 - 2
src/views/huiju/autoReply.vue

@@ -30,7 +30,7 @@
       <el-table-column label="状态" width="100">
         <template slot-scope="scope">
           <el-switch
-              :value="scope.row.state"
+              :value="scope.row.state === 1"
               @change="onChangeState(scope.row)"
               active-color="#13ce66"
               inactive-color="#ff4949">
@@ -105,7 +105,9 @@ export default {
         }
       }).get()
     },
-    onChangeState (item) {},
+    onChangeState (item) {
+      this.onEdit(item)
+    },
     doAjaxSave () {},
     onChangePage () {
       this.doLoad({

+ 112 - 0
src/views/huiju/editCode.vue

@@ -0,0 +1,112 @@
+<template>
+  <div class="editReply" v-loading="loading">
+      <h2>关键词编辑</h2>
+    <el-form ref="form" :model="form" label-width="80px">
+      <el-form-item label="投放渠道">
+        <el-col :span="8">
+          <el-input v-model="form.name"></el-input>
+        </el-col>
+      </el-form-item>
+
+      <el-form-item label="链接代码">
+        <el-col :span="8">
+          <el-input v-if="editId" v-model="form.makeUrl"></el-input>
+          <el-input v-else v-model="form.makeUrl" :disabled="true"></el-input>
+        </el-col>
+      </el-form-item>
+
+      <el-form-item label="生成二维码链接">
+        <el-col :span="8">
+          <el-input v-model="form.wxUrl"></el-input>
+        </el-col>
+      </el-form-item>
+
+
+      <el-form-item>
+        <el-button type="primary" @click="onSubmit">{{editId ? '保存修改' : '立即创建'}}</el-button>
+        <el-button @click="goBackList">取消</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+
+
+export default {
+  name: 'list',
+  data() {
+    return {
+      loading: false,
+      editId: null,
+      form: {
+        id: '',
+        name: '',
+        makeUrl: '',
+        wxUrl: ''
+      }
+    }
+  },
+  created() {
+    if (this.$route.query.id) {
+      this.editId = this.$route.query.id
+      this.doLoad(this.editId)
+    } else {
+      this.getMakeURL()
+    }
+  },
+  methods: {
+    goBackList () {
+      this.$router.replace('/huiju/qrCodeList')
+    },
+    getMakeURL () {
+      this.$request('/QrCodeManage/codeObtain').success(res => {
+          if (res.status === 'success') {
+            this.form.makeUrl = res.data.code
+          } else {
+            this.$toast(res.info || '获取链接代码失败')
+          }
+      }).post()
+    },
+    onSubmit() {
+      const params = Object.assign({}, this.form)
+      console.log('submit!', params);
+      this.$request(this.editId ? '/QrCodeManage/update' : '/QrCodeManage/insert').data(params).success((res) => {
+        console.log(res)
+        if (res.status === 'success') {
+          this.$toast(res.info || '操作成功')
+          this.goBackList()
+        } else {
+          this.$toast(res.info || '操作失败')
+        }
+      }).post()
+    },
+    doLoad (id) {
+      if (this.loading) {
+        return
+      }
+      this.loading = true
+      this.$request('/QrCodeManage/find').data({ id }).success((res) => {
+        this.loading = false
+        if (res.status === 'success' && res.data) {
+          const data = res.data || {}
+          this.form.id = id
+          this.form.name = data.name
+          this.form.wxUrl = data.wx_url
+          this.form.makeUrl = data.make_url
+        }
+      }).get()
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.editReply {
+  .action-button {
+    font-size: 16px;
+    margin-left: 12px;
+  }
+  //
+}
+</style>

+ 147 - 0
src/views/huiju/qrCodeList.vue

@@ -0,0 +1,147 @@
+<template>
+  <div class="autoReply" v-loading="loading">
+    <div class="title-group">
+      <h2>二维码管理</h2>
+      <el-button @click="addReply">新增二维码</el-button>
+    </div>
+      <br>
+      <el-table
+        :data="topTable"
+        tooltip-effect="dark"
+        style="width: 100%"
+        border
+    >
+      <el-table-column
+          prop="id"
+          label="ID"
+          width="50">
+      </el-table-column>
+      <el-table-column
+          prop="name"
+          label="链接投放渠道"
+      >
+      </el-table-column>
+        <el-table-column
+            prop="make_url"
+            label="链接代码"
+            width="200">
+        </el-table-column>
+        <el-table-column
+            prop="wx_url"
+            label="生成二维码链接"
+            width="300">
+        </el-table-column>
+        <el-table-column
+            prop="create_time"
+            label="创建时间"
+            width="200">
+        </el-table-column>
+        <el-table-column
+            prop="create_person"
+            label="创建人"
+            width="80">
+        </el-table-column>
+
+       <el-table-column label="操作" width="100">
+        <template slot-scope="scope">
+          <div class="action-icon">
+            <i class="el-icon-edit" @click="onEdit(scope.row)"></i>
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+      <el-pagination
+          background
+          layout="prev, pager, next"
+          @current-change="onChangePage"
+          :current-page.sync="pageNum"
+          :total="pageCount">
+      </el-pagination>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'list',
+  data() {
+    return {
+      loading: false,
+      pageCount: 0,
+      pageNum: 1,
+      topTable: [],
+    }
+  },
+  created() {
+    this.doLoad()
+  },
+  methods: {
+    addReply () {
+      this.$router.push('/huiju/editCode')
+    },
+    onEdit (item) {
+      this.$router.push('/huiju/editCode?id=' + item.id)
+    },
+    onDelete (item) {
+      this.$request('/reply/rule/delete').data({ id: item.id }).success((res) => {
+        if (res.status === 'success') {
+          this.$notify({
+            title: res.info || '操作成功',
+            type: 'success'
+          });
+          this.doLoad()
+        } else  {
+          this.$notify({
+            title: res.info || '操作失败',
+            type: 'error'
+          });
+        }
+      }).get()
+    },
+    onChangeState (item) {
+      this.onEdit(item)
+    },
+    doAjaxSave () {},
+    onChangePage () {
+      this.doLoad({
+        pageSize: 10,
+        offset: this.pageNum
+      })
+    },
+    doLoad (query) {
+      if (this.loading) {
+        return
+      }
+      this.loading = true
+      this.$request('/QrCodeManage/list').data(Object.assign({
+        pageSize: 10,
+        offset: 0
+      }, query)).success((res) => {
+        this.loading = false
+        if (res.status === 'success' && res.data) {
+          this.topTable = res.data.list || []
+          this.pageCount = res.data.count
+        }
+      }).post()
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.autoReply {
+  .title-group {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+  }
+  //
+  ::v-deep {
+    .action-icon i{
+      font-size:20px;
+      cursor: pointer;
+      margin-left: 12px;
+    }
+  }
+}
+</style>