update: 企微任务

index.html

@@ -38,5 +38,6 @@
     <script src="//web-1251519181.file.myqcloud.com/components/pagination.1.0.8.js"></script><!-- 分页器 -->
     <script src="//web-1251519181.file.myqcloud.com/components/track.1.0.4.js"></script>
     <script src="//web-1251519181.file.myqcloud.com/components/activity-select.1.0.2.1.js"></script><!-- 数据对话 -->
+    <script src="//web-1251519181.file.myqcloud.com/components/steps.1.0.1.js"></script>
   </body>
 </html>

src/views/ecm/marketing-event/components/item-qywx.vue

+<template>
+  <div class="dm-grade__item__wrap">
+    <div class="fz16">会员卡升级</div>
+    <p class="mt15 fz24 primary-font-color">
+      {{ item.title }}
+    </p>
+    <p class="minor-font-color mt10 line-height1_5 fz12">*若当前会员卡等级超过该等级，则不会进行会员升级。</p>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'item-grade',
+  props: {
+    item: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  }
+};
+</script>

src/views/ecm/marketing-event/components/lib-qywx.vue

+<template>
+  <el-dialog title="企微任务" :visible.sync="show" width="630px" @closed="close">
+    <dm-steps class="step-inner" :active="step" finish-status="success">
+      <dm-step title="编辑基本信息"></dm-step>
+      <dm-step title="配置任务完成方式"></dm-step>
+    </dm-steps>
+    <el-form v-show="step == 0">
+      <el-form-item label="选择企业"></el-form-item>
+      <el-form-item label="任务标题"></el-form-item>
+      <el-form-item label="任务描述"></el-form-item>
+      <el-form-item label="任务发放规则"></el-form-item>
+      <el-form-item label="任务逾期判定"></el-form-item>
+    </el-form>
+    <div v-show="step == 1"></div>
+    <template slot="footer" v-if="step == 0">
+      <el-button @click="close">取消</el-button>
+      <el-button type="primary" @click="step = 1">下一步</el-button>
+    </template>
+    <template slot="footer" v-else-if="step == 1">
+      <el-button type="primary" @click="step = 0">上一步</el-button>
+      <el-button type="primary" @click="addItem">确定</el-button>
+    </template>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: 'lib-qywx',
+  props: {
+    item: {
+      type: Object,
+      default() {
+        return {};
+      }
+    },
+    show: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      cardLevelList: [],
+      cardLevel: '',
+      step: 0
+    };
+  },
+  mounted() {
+    console.log(1);
+  },
+  watch: {
+    show(val) {
+      if (val) {
+        this.cardLevel = this.item.relationId || '';
+      } else {
+        this.cardLevel = '';
+      }
+    }
+  },
+  methods: {
+    close() {
+      this.$emit('update:show', false);
+    },
+    addItem() {
+      if (!this.cardLevel) {
+        return this.$message({ type: 'warning', message: '未选择会员卡等级' });
+      }
+      let title = this.cardLevelList.find(item => item.key === this.cardLevel).value;
+      this.$emit('sendItem', { title, relationId: this.cardLevel, comName: 'grade' });
+      this.close();
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.step-wrap {
+  // width: calc(100% + 48px);
+  // height: 100px;
+  // margin-left: -24px;
+  // border-bottom: 1px solid #dcdfe6;
+  .step {
+    // width: 100%;
+    .step-inner {
+      // width: 750px;
+      margin: 0 auto;
+    }
+  }
+}
+</style>

src/views/ecm/marketing-event/index.vue

@@ -52,6 +52,7 @@ import itemMessage from './components/item-Message.vue';
 import itemTeltask from './components/item-teltask.vue';
 import itemIntegral from './components/item-integral.vue';
 import itemGrade from './components/item-grade';
+import itemQywx from './components/item-qywx';
 //弹窗组件
 import libTeletext from './components/lib-teletext.vue';
 import libMessage from './components/lib-Message.vue';
@@ -62,10 +63,11 @@ import libImage from './components/lib-image.vue';
 import libTeltask from './components/lib-teltask.vue';
 import libIntegral from './components/lib-integral.vue';
 import libGrade from './components/lib-grade';
+import libQywx from './components/lib-qywx';
 
 // 全部的操作项
 // eslint-disable-next-line
-let allOptions = [{ name: '图文', value: 'teletext', key: 1, img: require('./assets/img/teletext.svg') }, { name: '文本', value: 'text', key: 2, img: require('./assets/img/text.svg') }, { name: '小程序', value: 'wxa', key: 3, img: require('./assets/img/wxa.svg') }, { name: '图片', value: 'image', key: 4, img: require('./assets/img/image.svg') }, { name: '卡券', value: 'card', key: 5, img: require('./assets/img/card.svg') }, { name: '短信', value: 'message', key: 6, img: require('./assets/img/message.svg') }, { name: '话务', value: 'teltask', key: 7, img: require('./assets/img/teltask.svg')}, { name: '积分', value: 'integral', key: 8, img: require('./assets/img/integral.svg') }];
+let allOptions = [{ name: '图文', value: 'teletext', key: 1, img: require('./assets/img/teletext.svg') }, { name: '文本', value: 'text', key: 2, img: require('./assets/img/text.svg') }, { name: '小程序', value: 'wxa', key: 3, img: require('./assets/img/wxa.svg') }, { name: '图片', value: 'image', key: 4, img: require('./assets/img/image.svg') }, { name: '卡券', value: 'card', key: 5, img: require('./assets/img/card.svg') }, { name: '短信', value: 'message', key: 6, img: require('./assets/img/message.svg') }, { name: '话务', value: 'teltask', key: 7, img: require('./assets/img/teltask.svg')}, { name: '积分', value: 'integral', key: 8, img: require('./assets/img/integral.svg') }, { name: '企微任务', value: 'qywx', key: 10, img: require('./assets/img/integral.svg') }];
 export default {
   name: 'vue-gic-marketing-event',
   components: {
@@ -90,7 +92,9 @@ export default {
     'lib-teltask': libTeltask,
     'lib-integral': libIntegral,
     'item-grade': itemGrade,
-    'lib-grade': libGrade
+    'lib-grade': libGrade,
+    'item-qywx': itemQywx,
+    'lib-qywx': libQywx
   },
   props: {
     //  页面编码——- 1001-智能引擎; 1002-微信营销; 1003-被关注回复; 1004-关键字回复