<template> 
 | 
  <el-card shadow="never" class="aui-card--fill"> 
 | 
    <div class="mod-message__sms"> 
 | 
      <zt-table-wraper query-url="/sys/sms/page" delete-url='/sys/sms' v-slot="{ table }"> 
 | 
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()"> 
 | 
        <el-form-item> 
 | 
          <el-select v-model="dataForm.platform" :placeholder="$t('sms.platform')" clearable> 
 | 
            <el-option :label="$t('sms.platform1')" :value="1"></el-option> 
 | 
            <el-option :label="$t('sms.platform2')" :value="2"></el-option> 
 | 
            <el-option :label="$t('sms.platform3')" :value="3"></el-option> 
 | 
          </el-select> 
 | 
        </el-form-item> 
 | 
        <el-form-item> 
 | 
          <zt-button  class="admin-query-button" type="query" @click="table.query()"/> 
 | 
          <zt-button type="add" @click="table.editHandle()"/> 
 | 
          <zt-button type="delete" @click="table.deleteHandle()"/> 
 | 
        </el-form-item> 
 | 
      </el-form> 
 | 
      <el-table v-loading="table.dataLoading" :data="table.dataList" border @selection-change="table.selectionChangeHandle" @sort-change="table.sortChangeHandle"> 
 | 
        <el-table-column type="selection" width="40"/> 
 | 
        <el-table-column prop="smsCode" :label="$t('sms.smsCode')"/> 
 | 
        <el-table-column prop="platform" :label="$t('sms.platform')" > 
 | 
          <template v-slot="{ row }"> 
 | 
            <el-tag v-if="row.platform === 1" size="small">{{ $t('sms.platform1') }}</el-tag> 
 | 
            <el-tag v-else-if="row.platform === 2" size="small">{{ $t('sms.platform2') }}</el-tag> 
 | 
            <el-tag v-else-if="row.platform === 3" size="small">{{ $t('sms.platform3') }}</el-tag> 
 | 
          </template> 
 | 
        </el-table-column> 
 | 
        <el-table-column prop="remark" label="备注"/> 
 | 
        <el-table-column prop="createDate" :label="$t('sms.createDate')" sortable="custom" width="180"/> 
 | 
        <zt-table-column-handle :table="table" width="180"> 
 | 
          <template v-slot="{ row }"> 
 | 
            <zt-table-button @click="sendHandle(row)">{{ $t('sms.send') }}</zt-table-button> 
 | 
          </template> 
 | 
        </zt-table-column-handle> 
 | 
      </el-table> 
 | 
      <!-- 弹窗, 新增 / 修改 --> 
 | 
      <add-or-update ref="addOrUpdate" @refreshDataList="table.query"/> 
 | 
      <!-- 弹窗, 发送短信 --> 
 | 
      <send v-if="sendVisible" ref="send" @refreshDataList="table.query"></send> 
 | 
      </zt-table-wraper> 
 | 
    </div> 
 | 
  </el-card> 
 | 
</template> 
 | 
  
 | 
<script> 
 | 
  import AddOrUpdate from './sms-template-add-or-update' 
 | 
  import Send from './sms-send' 
 | 
  export default { 
 | 
    data() { 
 | 
      return { 
 | 
        dataForm: { 
 | 
          mobile: '', 
 | 
          status: null 
 | 
        }, 
 | 
        sendVisible: false 
 | 
      } 
 | 
    }, 
 | 
    components: { 
 | 
      AddOrUpdate, 
 | 
      Send 
 | 
    }, 
 | 
    methods: { 
 | 
      // 发送短信 
 | 
      sendHandle(row) { 
 | 
        this.sendVisible = true 
 | 
        this.$nextTick(() => { 
 | 
          this.$refs.send.dataForm.smsCode = row.smsCode 
 | 
          this.$refs.send.$refs['dialog'].init() 
 | 
        }) 
 | 
      } 
 | 
    } 
 | 
  } 
 | 
</script> 
 |