Tmr-Multilingual/src/views/systemManagement/reminderSettings/index.vue

<template>
  <div class="app-container">
    <div class="table">
      <el-table
        :key="table.tableKey"
        v-loading="table.listLoading"
        element-loading-text="给我一点时间"
        :data="table.list"
        border
        fit
        highlight-current-row
        style="width: 100%;"
        :row-style="rowStyle"
        :cell-style="cellStyle"
        class="elTable table-fixed"
        :max-height="myHeight"
      >
        <el-table-column label="消息名称" min-width="130px" align="center" prop="message" />
        <el-table-column label="触发条件" min-width="130px" align="center" prop="trigger" />
        <el-table-column label="发送方式" min-width="130px" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.data.remind_type }}</span>
          </template>
        </el-table-column>
        <el-table-column label="详细配置" min-width="130px" align="center">
          <template slot-scope="{row}">
            <a class="correcting" size="mini" style="width: 80px;" @click="form_see(row)">查看</a>
          </template>
        </el-table-column>
        <el-table-column label="提醒对象" min-width="130px" align="center" prop="user" />
        <el-table-column label="操作" align="center" width="150" class-name="small-padding fixed-width" fixed="right">
          <template slot-scope="{row}">
            <a class="correcting" size="mini" style="width: 80px;" @click="handleSetUp(row)">设置</a>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <!-- 设置 -->
    <el-dialog :title="textMap[setUp.dialogStatus]" :visible.sync="setUp.dialogFormVisible" :close-on-click-modal="false" width="70%">
      <div class="setup">
        <div style="height: 500px;">
          <el-row :gutter="20">
            <el-col :span="8">
              <el-form ref="temp" :rules="temp.rules" :model="temp" label-position="right" label-width="110px" style="width: 100%;margin:0 auto">
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="消息名称:" prop="messageName">
                      <span>{{temp.messageName}}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="触发条件:" prop="triggerCondition">
                      <span>{{temp.triggerCondition}}</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="发送方式:" prop="sendingMethod">
                      <el-select v-model="temp.sendingMethod" style="width: 100%;" placeholder="发送方式">
                        <el-option v-for="item in modeList" :key="item.id" :label="item.name" :value="item.id" />
                      </el-select>
                    </el-form-item>
                  </el-col>
                </el-row>
                <div v-if="temp.sendingMethod == '1'">
                  <el-row :gutter="5">
                    <el-col :span="18">
                      <el-form-item label="发送机制">
                        <el-select v-model="temp.sendingMechanism" style="width: 100%;" placeholder="发送机制">
                          <el-option v-for="item in mechanismList" :key="item.id" :label="item.name" :value="item.id" />
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6" v-if="temp.sendingMechanism == '2'">
                        <el-input ref="numberCycles" v-model="temp.numberCycles" style="width: 100%;" placeholder="循环次数" type="text" />
                    </el-col>
                  </el-row>
                  <el-row v-if="temp.sendingMechanism !== '1' && temp.sendingMechanism !== ''">
                    <el-col :span="24">
                      <el-form-item label="间隔周期:">
                        <el-input ref="intervalPeriod1" v-model="temp.intervalPeriod1" style="width: 33%;margin-right:1%" placeholder="天" type="text" />
                        <el-input ref="intervalPeriod2" v-model="temp.intervalPeriod2" style="width: 33%;margin-right:1%" placeholder="小时" type="text" />
                        <el-input ref="intervalPeriod3" v-model="temp.intervalPeriod3" style="width: 32%;" placeholder="分钟" type="text" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                </div>
                <div v-if="temp.sendingMethod == '2'">
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="延时:">
                        <el-input ref="delayed1" v-model="temp.delayed1" style="width: 33%;margin-right:1%" placeholder="天" type="text" />
                        <el-input ref="delayed2" v-model="temp.delayed2" style="width: 33%;margin-right:1%" placeholder="小时" type="text" />
                        <el-input ref="delayed3" v-model="temp.delayed3" style="width: 32%;" placeholder="分钟" type="text" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="发送时间">
                         <el-time-select placeholder="发送时间" :clearable="false" style="width: 100%;" v-model="temp.sendTime" :picker-options="{ start: '00:00', step: '00:05', end: '23:59' }" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row :gutter="5">
                    <el-col :span="18">
                      <el-form-item label="发送机制">
                        <el-select v-model="temp.sendingMechanism" style="width: 100%;" placeholder="发送机制">
                          <el-option v-for="item in mechanismList" :key="item.id" :label="item.name" :value="item.id" />
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6" v-if="temp.sendingMechanism == '2'">
                        <el-input ref="numberCycles" v-model="temp.numberCycles" style="width: 100%;" placeholder="循环次数" type="text" />
                    </el-col>
                  </el-row>
                  <el-row v-if="temp.sendingMechanism !== '1' && temp.sendingMechanism !== ''">
                    <el-col :span="24">
                      <el-form-item label="间隔周期:">
                        <el-input ref="intervalPeriod1" v-model="temp.intervalPeriod1" style="width: 33%;margin-right:1%" placeholder="天" type="text" />
                        <el-input ref="intervalPeriod2" v-model="temp.intervalPeriod2" style="width: 33%;margin-right:1%" placeholder="小时" type="text" />
                        <el-input ref="intervalPeriod3" v-model="temp.intervalPeriod3" style="width: 32%;" placeholder="分钟" type="text" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                </div>
                <div v-if="temp.sendingMethod == '3'">
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="发送机制:">
                        <span>持续循环</span>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row :gutter="5">
                    <el-col :span="18">
                      <el-form-item label="周期类型">
                        <el-select v-model="temp.cycleType" style="width: 100%;" placeholder="周期类型">
                          <el-option v-for="item in cycleTypeList" :key="item.id" :label="item.name" :value="item.id" />
                        </el-select>
                      </el-form-item>
                    </el-col>
                    <el-col :span="6" v-if="temp.cycleType == '2'">
                      <el-select v-model="temp.week" style="width: 100%;" placeholder="每周">
                        <el-option v-for="item in weekList" :key="item.id" :label="item.name" :value="item.id" />
                      </el-select>
                    </el-col>
                    <el-col :span="6" v-if="temp.cycleType == 3">
                      <el-select v-model="temp.month" style="width: 100%;" placeholder="每月">
                        <el-option v-for="item in monthList" :key="item.id" :label="item.name" :value="item.id" />
                      </el-select>
                    </el-col>
                  </el-row>
                  <el-row>
                    <el-col :span="24">
                      <el-form-item label="发送时间">
                         <el-time-select placeholder="发送时间" :clearable="false" style="width: 100%;" v-model="temp.sendTime" :picker-options="{ start: '00:00', step: '00:05', end: '23:59' }" />
                      </el-form-item>
                    </el-col>
                  </el-row>
                </div>
              </el-form>
            </el-col>
            <el-col :span="16">
              <b>提醒对象:</b>
              <div class="search">
                <el-input v-model="setUp.empCode" placeholder="角色名称" style="width: 180px;" class="filter-item" clearable />
                <el-input v-model="setUp.empCode" placeholder="用户名称" style="width: 180px;" class="filter-item" clearable />
                <el-input v-model="setUp.empname" placeholder="员工姓名" style="width: 180px;" class="filter-item" clearable />
                <el-button class="successBorder" @click="form_search">{{$t('common.query')}}</el-button>
              </div>
              <el-row :gutter="5">
                <el-col :span="6">
                  <el-table
                    ref="setUpTable1"
                    :key="setUp.tableKey1"
                    v-loading="setUp.listLoading1"
                    element-loading-text="给我一点时间"
                    :data="setUp.list1"
                    border
                    fit
                    highlight-current-row
                    style="width: 100%;"
                    :row-style="rowStyle"
                    :cell-style="cellStyle"
                    class="elTable table-fixed"
                    @selection-change="handleSelectionChange1"
                    :height="350"
                  >
                    <el-table-column type="selection" align="center" width="50" />
                    <el-table-column label="角色名" min-width="100px" align="center" prop="rolename" />
                  </el-table>
                </el-col>
                <el-col :span="18">
                  <el-table
                    ref="setUpTable2"
                    :key="setUp.tableKey2"
                    v-loading="setUp.listLoading2"
                    element-loading-text="给我一点时间"
                    :data="setUp.list2"
                    border
                    fit
                    highlight-current-row
                    style="width: 100%;"
                    :row-style="rowStyle"
                    :cell-style="cellStyle"
                    class="elTable table-fixed"
                    @selection-change="handleSelectionChange2"
                    :height="350"
                  >
                    <el-table-column type="selection" align="center" width="50" />
                    <el-table-column label="用户名称" min-width="130px" align="center" prop="username" />
                    <el-table-column label="员工姓名" min-width="130px" align="center" prop="empname" />
                    <el-table-column label="角色" min-width="130px" align="center" prop="rolename" />
                  </el-table>
                </el-col>
              </el-row>
            </el-col>
          </el-row>
        </div>
        <div slot="footer" class="dialog-footer" style="right:30px;position:absolute;bottom: 40px;">
          <el-button class="cancelClose" @click="setUp.dialogFormVisible = false;getList(); ">取消</el-button>
          <el-button class="save" :disabled="isokDisable" @click="setData()">确认</el-button>
        </div>
      </div>
    </el-dialog>
    <!-- 查看 -->
    <el-dialog :title="textMap[see.dialogStatus]" :visible.sync="see.dialogFormVisible" :close-on-click-modal="false" width="40%">
      <div class="setup">
        <div style="height: 500px;">
            <el-form ref="temp" :rules="temp.rules" :model="temp" label-position="right" label-width="110px" style="width: 100%;margin:0 auto">
              <el-row>
                <el-col :span="24">
                  <el-form-item label="消息名称:" prop="messageName">
                    <span>{{temp.messageName}}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="触发条件:" prop="triggerCondition">
                    <span>{{temp.triggerCondition}}</span>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="发送方式:" prop="sendingMethod">
                    <el-select disabled v-model="temp.sendingMethod" style="width: 100%;" placeholder="发送方式">
                      <el-option v-for="item in modeList" :key="item.id" :label="item.name" :value="item.id" />
                    </el-select>
                  </el-form-item>
                </el-col>
              </el-row>
              <div v-if="temp.sendingMethod == '1'">
                <el-row :gutter="5">
                  <el-col :span="18">
                    <el-form-item label="发送机制">
                      <el-select disabled v-model="temp.sendingMechanism" style="width: 100%;" placeholder="发送机制">
                        <el-option v-for="item in mechanismList" :key="item.id" :label="item.name" :value="item.id" />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6" v-if="temp.sendingMechanism == '2'">
                      <el-input disabled ref="numberCycles" v-model="temp.numberCycles" style="width: 100%;" placeholder="循环次数" type="text" />
                  </el-col>
                </el-row>
                <el-row v-if="temp.sendingMechanism !== '1' && temp.sendingMechanism !== ''">
                  <el-col :span="24">
                    <el-form-item label="间隔周期:">
                      <el-input disabled ref="intervalPeriod1" v-model="temp.intervalPeriod1" style="width: 33%;margin-right:1%" placeholder="天" type="text" />
                      <el-input disabled ref="intervalPeriod2" v-model="temp.intervalPeriod2" style="width: 33%;margin-right:1%" placeholder="小时" type="text" />
                      <el-input disabled ref="intervalPeriod3" v-model="temp.intervalPeriod3" style="width: 32%;" placeholder="分钟" type="text" />
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
              <div v-if="temp.sendingMethod == '2'">
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="延时:">
                      <el-input disabled ref="delayed1" v-model="temp.delayed1" style="width: 33%;margin-right:1%" placeholder="天" type="text" />
                      <el-input disabled ref="delayed2" v-model="temp.delayed2" style="width: 33%;margin-right:1%" placeholder="小时" type="text" />
                      <el-input disabled ref="delayed3" v-model="temp.delayed3" style="width: 32%;" placeholder="分钟" type="text" />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="发送时间">
                       <el-time-select disabled placeholder="发送时间" :clearable="false" style="width: 100%;" v-model="temp.sendTime" :picker-options="{ start: '00:00', step: '00:05', end: '23:59' }" />
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="5">
                  <el-col :span="18">
                    <el-form-item label="发送机制">
                      <el-select disabled v-model="temp.sendingMechanism" style="width: 100%;" placeholder="发送机制">
                        <el-option v-for="item in mechanismList" :key="item.id" :label="item.name" :value="item.id" />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6" v-if="temp.sendingMechanism == '2'">
                      <el-input disabled ref="numberCycles" v-model="temp.numberCycles" style="width: 100%;" placeholder="循环次数" type="text" />
                  </el-col>
                </el-row>
                <el-row v-if="temp.sendingMechanism !== '1' && temp.sendingMechanism !== ''">
                  <el-col :span="24">
                    <el-form-item label="间隔周期:">
                      <el-input disabled ref="intervalPeriod1" v-model="temp.intervalPeriod1" style="width: 33%;margin-right:1%" placeholder="天" type="text" />
                      <el-input disabled ref="intervalPeriod2" v-model="temp.intervalPeriod2" style="width: 33%;margin-right:1%" placeholder="小时" type="text" />
                      <el-input disabled ref="intervalPeriod3" v-model="temp.intervalPeriod3" style="width: 32%;" placeholder="分钟" type="text" />
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
              <div v-if="temp.sendingMethod == '3'">
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="发送机制:">
                      <span>持续循环</span>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row :gutter="5">
                  <el-col :span="18">
                    <el-form-item label="周期类型">
                      <el-select disabled v-model="temp.cycleType" style="width: 100%;" placeholder="周期类型">
                        <el-option v-for="item in cycleTypeList" :key="item.id" :label="item.name" :value="item.id" />
                      </el-select>
                    </el-form-item>
                  </el-col>
                  <el-col :span="6" v-if="temp.cycleType == '2'">
                    <el-select disabled v-model="temp.week" style="width: 100%;" placeholder="每周">
                      <el-option v-for="item in weekList" :key="item.id" :label="item.name" :value="item.id" />
                    </el-select>
                  </el-col>
                  <el-col :span="6" v-if="temp.cycleType == 3">
                    <el-select disabled v-model="temp.month" style="width: 100%;" placeholder="每月">
                      <el-option v-for="item in monthList" :key="item.id" :label="item.name" :value="item.id" />
                    </el-select>
                  </el-col>
                </el-row>
                <el-row>
                  <el-col :span="24">
                    <el-form-item label="发送时间">
                       <el-time-select disabled placeholder="发送时间" :clearable="false" style="width: 100%;" v-model="temp.sendTime" :picker-options="{ start: '00:00', step: '00:05', end: '23:59' }" />
                    </el-form-item>
                  </el-col>
                </el-row>
              </div>
            </el-form>
        </div>
        <div slot="footer" class="dialog-footer" style="right:30px;position:absolute;bottom: 40px;">
          <el-button class="cancelClose1" @click="see.dialogFormVisible = false;getList(); ">取消</el-button>
        </div>
      </div>
    </el-dialog>
    <!-- 扫码 -->
    <el-dialog :title="textMap[QRcode.dialogStatus]" :visible.sync="QRcode.dialogFormVisible" :close-on-click-modal="false" width="50%">
      <div class="QRcode">
        <div class="content">
          <div class="title">
            <p>微信接收系统待办、预警等消息，必须先扫码关注公众号；</p>
            <p>请将下方二维码分享给需要接收信息的用户扫码</p>
          </div>
          <div style="font-weight: 600;">关注微信：</div>
          <img src="https://img2.baidu.com/it/u=1151188475,1753963046&fm=253&fmt=auto&app=138&f=JPEG?w=504&h=300" alt="">
        </div>
        <div slot="footer" class="dialog-footer" style="right:30px;position:absolute;bottom: 40px;">
          <el-button class="save" :disabled="isokDisable" @click="QRcode.dialogFormVisible = false;">确认</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import { GetDataByName,postJson2,postJson } from '@/api/common'
  import Cookies from 'js-cookie'
  export default {
    name: 'ReminderSettings',
    data() {
      return {
        temp:{
          rules:{},
          messageName:'',//消息名称
          triggerCondition:'',//触发条件,
          sendingMethod:'1',//发送方式
          delayed1:'',//延时
          delayed2:'',//延时
          delayed3:'',//延时,
          sendTime:'',//发送时间，
          sendingMechanism:'1',// 发送机制
          numberCycles:'',//循环次数
          intervalPeriod1:'',//间隔周期
          intervalPeriod2:'',//间隔周期
          intervalPeriod3:'',//间隔周期
          cycleType:'1',
        },
        modeList: [
          { id: '1', name: '立即' },
          { id: '2', name: '延时' },
          { id: '3', name: '指定周期' },
        ],
        mode: '0',
        mechanismList: [
          { id: '1', name: '单次' },
          { id: '2', name: '指定循环次数' },
          { id: '3', name: '循环至任务结束' },
        ],
        cycleTypeList:[
          { id: '1', name: '每天' },
          { id: '2', name: '每周' },
          { id: '3', name: '每月' },
        ],//周期类型
        weekList:[
          { id: '1', name: '周一' },
          { id: '2', name: '周二' },
          { id: '3', name: '周三' },
          { id: '4', name: '周四' },
          { id: '5', name: '周五' },
          { id: '6', name: '周六' },
          { id: '7', name: '周日' },
        ],//周
        monthList:[],//月
        mechanism: '0',
        activeName:'first',
        table: {
          tableKey: 0,
          list: [],
          total: 0,
          listLoading: false
        },
        setUp:{
          dialogStatus: '',
          dialogFormVisible:false,
          // 角色
          tableKey1: 0,
          list1: [],
          total1: 0,
          listLoading1: false,
          data1:{
            name: 'getRoleList', page: 1, offset: 1, pagecount:'',returntype: 'Map',
            parammaps: {
              pastureid: Cookies.get('pastureid')
            }
          },
          // 用户
          tableKey2: 0,
          list2: [],
          total2: 0,
          listLoading2: false,
          data2:{
            name: 'getuserallL', page: 1, offset: 1, pagecount:'',returntype: 'Map',
            parammaps: {
              pastureid: Cookies.get('pastureid'),
              roleid:''
            }
          },
          temp:{}
        },
        see:{
          dialogStatus: '',
          dialogFormVisible:false,
          temp:{}
        },
        QRcode:{
          dialogStatus: '',
          dialogFormVisible:false,
        },
        myHeight:document.documentElement.clientHeight - 85- 150 - 45,
        textMap: {
          setup: '设置',
          QRcode:'提示',
          add:'新增',
          see:'查看'
        },
        selectList1:[],
        selectList2:[],
        isokDisable:false,
        rowStyle: { maxHeight: 30 + 'px', height: 30 + 'px' },
        cellStyle: { padding: 0 + 'px' }
      }
    },
    created() {
      this.monthList = []
      for(let i=1;i<=31;i++){
        let obj = {}
        obj.id = String(i)
        obj.name = i+'日'
        this.monthList.push(obj)
      }
      this.getList()
    },
    methods: {
      getList() {
        this.table.listLoading = true
        let url = 'authdata/remind/list'
        let data = {
          parammaps:{
            pastureid:Cookies.get('pastureid')
          }
        }
        postJson(url,data).then(response => {
          if (response.data !== null) {
            console.log('table数据', response.data)
            this.table.list = response.data
            this.table.pageNum = response.data.pageNum
            this.table.pageSize = response.data.pageSize
          } else {
            this.table.list = []
          }
          this.table.total = response.data.total
          setTimeout(() => {
            this.table.listLoading = false
          }, 100)
        })
      },
      handleSetUp(row){
        console.log(row,'row')
        this.setUp.dialogStatus = 'setup'
        this.setUp.dialogFormVisible = true
        this.activeName = 'first'
        this.setUp.temp = Object.assign({}, row)
        this.temp.messageName = row.message //消息名称
        this.temp.triggerCondition = row.trigger //触发条件
        this.temp.sendTime = row.data.push_time //发送时间
        this.selectList1 = []
        if(row.user){
          this.selectList2 = row.user.split(',')
        }
        console.log(this.selectList2,'this.selectList211')
        // 立即
        this.temp.sendingMethod = String(row.data.remind_type) //发送方式
        if(this.temp.sendingMethod == '1'){
          this.temp.sendingMechanism = String(row.data.cycle_type) //发送机制
          if(this.temp.sendingMechanism == '2'){
            this.temp.numberCycles = row.data.push_limit //循环次数
            if(this.temp.sendingMechanism !== '1' && this.temp.sendingMechanism !== ''){
              //间隔周期
              var minutes = row.data.interval_time
              var day = parseInt(Math.floor(minutes / 1440));
              var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
              var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
              this.temp.intervalPeriod1 = day;
              this.temp.intervalPeriod2 = hour;
              this.temp.intervalPeriod3 = minute;
            }
          }
          if(this.temp.sendingMechanism == '3'){
            if(this.temp.sendingMechanism !== '1' && this.temp.sendingMechanism !== ''){
              //间隔周期
              var minutes = row.data.interval_time
              var day = parseInt(Math.floor(minutes / 1440));
              var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
              var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
              this.temp.intervalPeriod1 = day;
              this.temp.intervalPeriod2 = hour;
              this.temp.intervalPeriod3 = minute;
            }
          }
        }
        // 延时
        if(this.temp.sendingMethod == '2'){
          this.temp.sendingMethod = String(row.data.remind_type) //发送方式
          if(this.temp.sendingMethod == '2'){
            //延时
            var minutes = row.data.delay_time
            var day = parseInt(Math.floor(minutes / 1440));
            var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
            var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
            this.temp.delayed1 = day;
            this.temp.delayed2 = hour;
            this.temp.delayed3 = minute;
          }
          this.temp.sendTime = row.data.push_time //发送时间
          this.temp.sendingMechanism = String(row.data.cycle_type) //发送机制
          if(this.temp.sendingMechanism == '2'){
            this.temp.numberCycles = row.data.push_limit //循环次数
            if(this.temp.sendingMechanism !== '1' && this.temp.sendingMechanism !== ''){
              //间隔周期
              var minutes = row.data.interval_time
              var day = parseInt(Math.floor(minutes / 1440));
              var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
              var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
              this.temp.intervalPeriod1 = day;
              this.temp.intervalPeriod2 = hour;
              this.temp.intervalPeriod3 = minute;
            }
          }
          if(this.temp.sendingMechanism == '3'){
            if(this.temp.sendingMechanism !== '1' && this.temp.sendingMechanism !== ''){
              var minutes = row.data.interval_time
              var day = parseInt(Math.floor(minutes / 1440));
              var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
              var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
              this.temp.intervalPeriod1 = day;
              this.temp.intervalPeriod2 = hour;
              this.temp.intervalPeriod3 = minute;
            }
          }
        }
        // 指定周期
        if(this.temp.sendingMethod == '3'){
          this.temp.cycleType = String(row.data.date_type)  //周期类型
          if(this.temp.cycleType == '2'){
            this.temp.week = String(row.data.push_date)
          }
          if(this.temp.cycleType == '3'){
            this.temp.month = String(row.data.push_date)
          }
        }
        this.getList1()
      },
      form_see(row){
        this.see.dialogStatus = 'see'
        this.see.dialogFormVisible = true
        this.setUp.temp = Object.assign({}, row)
        this.temp.messageName = row.message //消息名称
        this.temp.triggerCondition = row.trigger //触发条件
        this.temp.sendTime = row.data.push_time //发送时间
        // 立即
        this.temp.sendingMethod = String(row.data.remind_type) //发送方式
        if(this.temp.sendingMethod == '1'){
          this.temp.sendingMechanism = String(row.data.cycle_type) //发送机制
          if(this.temp.sendingMechanism == '2'){
            this.temp.numberCycles = row.data.push_limit //循环次数
            if(this.temp.sendingMechanism !== '1' && this.temp.sendingMechanism !== ''){
              //间隔周期
              var minutes = row.data.interval_time
              var day = parseInt(Math.floor(minutes / 1440));
              var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
              var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
              this.temp.intervalPeriod1 = day;
              this.temp.intervalPeriod2 = hour;
              this.temp.intervalPeriod3 = minute;
            }
          }
          if(this.temp.sendingMechanism == '3'){
            if(this.temp.sendingMechanism !== '1' && this.temp.sendingMechanism !== ''){
              //间隔周期
              var minutes = row.data.interval_time
              var day = parseInt(Math.floor(minutes / 1440));
              var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
              var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
              this.temp.intervalPeriod1 = day;
              this.temp.intervalPeriod2 = hour;
              this.temp.intervalPeriod3 = minute;
            }
          }
        }
        // 延时
        if(this.temp.sendingMethod == '2'){
          this.temp.sendingMethod = String(row.data.remind_type) //发送方式
          if(this.temp.sendingMethod == '2'){
            //延时
            var minutes = row.data.delay_time
            var day = parseInt(Math.floor(minutes / 1440));
            var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
            var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
            this.temp.delayed1 = day;
            this.temp.delayed2 = hour;
            this.temp.delayed3 = minute;
          }
          this.temp.sendTime = row.data.push_time //发送时间
          this.temp.sendingMechanism = String(row.data.cycle_type) //发送机制
          if(this.temp.sendingMechanism == '2'){
            this.temp.numberCycles = row.data.push_limit //循环次数
            if(this.temp.sendingMechanism !== '1' && this.temp.sendingMechanism !== ''){
              //间隔周期
              var minutes = row.data.interval_time
              var day = parseInt(Math.floor(minutes / 1440));
              var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
              var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
              this.temp.intervalPeriod1 = day;
              this.temp.intervalPeriod2 = hour;
              this.temp.intervalPeriod3 = minute;
            }
          }
          if(this.temp.sendingMechanism == '3'){
            if(this.temp.sendingMechanism !== '1' && this.temp.sendingMechanism !== ''){
              var minutes = row.data.interval_time
              var day = parseInt(Math.floor(minutes / 1440));
              var hour = day > 0 ? Math.floor((minutes - day * 1440) / 60) : Math.floor(minutes / 60);
              var minute = hour > 0 ? Math.floor(minutes - day * 1440 - hour * 60) : minutes;
              this.temp.intervalPeriod1 = day;
              this.temp.intervalPeriod2 = hour;
              this.temp.intervalPeriod3 = minute;
            }
          }
        }
        // 指定周期
        if(this.temp.sendingMethod == '3'){
          this.temp.cycleType = String(row.data.date_type)  //周期类型
          if(this.temp.cycleType == '2'){
            this.temp.week = String(row.data.push_date)
          }
          if(this.temp.cycleType == '3'){
            this.temp.month = String(row.data.push_date)
          }
        }
      },
      handleClick(item){
        if(item == 'first'){
          this.getList1()
        }else{
          this.getList2()
        }
      },
      handleSelectionChange1(val) {
        console.log('勾选数据', val)
        this.selectList1 = []
        for(let i=0;i<val.length;i++){
          this.selectList1.push(val[i].id)
        }
        this.setUp.data2.parammaps.roleid = this.selectList1.join(',')
        this.getList2()
      },
      handleSelectionChange2(val) {
        this.selectList2 = val.map(item=>item.username)
        console.log('勾选数据', this.selectList2)
      },

      handleGenerateQRcode(){
        this.QRcode.dialogStatus = 'QRcode'
        this.QRcode.dialogFormVisible = true
      },
      form_search(){
        this.getList2()
      },
      getList1() {
        this.setUp.listLoading1 = true
        let url = "authdata/GetDataByName"
        postJson(url,this.setUp.data1).then(response => {
          if (response.data.list !== null) {
            this.setUp.list1 = response.data.list
            if(this.selectList1.length== 0){
              this.setUp.data2.parammaps.roleid = ''
            }
            this.selectList1.forEach(key => {
              this.setUp.list1.forEach(row => {
                if (row.id == key) {
                  this.$nextTick(() => {
                      this.$refs.setUpTable1.toggleRowSelection(row, true);
                  })
                }
              })
            })
            this.getList2()
          } else {
            this.setUp.list1 = []
          }
          setTimeout(() => {
            this.setUp.listLoading1 = false
          }, 100)
        })
      },
      getList2() {
        this.setUp.listLoading2 = true
        let url = "authdata/GetDataByName"
        postJson(url,this.setUp.data2).then(response => {
          if (response.data.list !== null) {
            this.setUp.list2 = response.data.list
            if(this.selectList1.length !== 0){
              this.selectList2 = []
              response.data.list.forEach(key => {
                this.selectList2.push(key.username)
              })
            }
            this.selectList2.forEach(key => {
              console.log(key,'key')
              this.setUp.list2.forEach(row => {
                if (row.username == key) {
                  this.$nextTick(() => {
                      this.$refs.setUpTable2.toggleRowSelection(row, true);
                  })
                }
              })
            })
          } else {
            this.setUp.list2 = []
          }
          console.log(this.selectList2,'this.selectList2')
          setTimeout(() => {
            this.setUp.listLoading2 = false
          }, 100)
        })
      },
      setData(){
        let url = 'authdata/remind/edit'
        let data = {}
        let delayedTime = 0
        let delayed1 = 0
        let delayed2 = 0
        let delayed3 = 0
        if(this.temp.sendTime == null){
          this.temp.sendTime = ''
        }

        if(this.temp.delayed1 !== ''){
          delayed1 = parseInt(this.temp.delayed1)*24*60
        }else {
          delayed1 = 0
        }
        if(this.temp.delayed2 !== ''){
          delayed2 = parseInt(this.temp.delayed2)*60
        }else {
          delayed2 = 0
        }
        if(this.temp.delayed3 !== ''){
          delayed3 = parseInt(this.temp.delayed3)
        }else{
          delayed3 = 0
        }
        delayedTime = delayed1 + delayed2 + delayed3

        let intervalPeriodTime = 0
        let intervalPeriod1 = 0
        let intervalPeriod2 = 0
        let intervalPeriod3 = 0

        if(this.temp.intervalPeriod1 !== ''){
          intervalPeriod1 = parseInt(this.temp.intervalPeriod1)*24*60
        }else {
          intervalPeriod1 = 0
        }
        if(this.temp.intervalPeriod2 !== ''){
          intervalPeriod2 = parseInt(this.temp.intervalPeriod2)*60
        }else {
          intervalPeriod2 = 0
        }
        if(this.temp.intervalPeriod3 !== ''){
          intervalPeriod3 = parseInt(this.temp.intervalPeriod3)
        }else{
          intervalPeriod3 = 0
        }
        intervalPeriodTime = intervalPeriod1+ intervalPeriod2 + intervalPeriod3

        // sendingMethod   发送方式
        // sendingMechanism   发送机制
        // intervalPeriod1    间隔周期
        // delayed1   延时
        // sendTime   发送时间
        // numberCycles   循环次数
        // 发送方式-立即
        if(this.temp.sendingMethod == '1'){
          data.sys_name = 'tmrWatch'
          data.pastureid = this.setUp.temp.pastureid
          // data.service_id = this.setUp.temp.service_id
          data.type_name = this.temp.messageName
          data.template_id = 'RLPlaCnqQZt_6s4HZuaFJYbQ9gmTfIYipTYDoKJInY8'
          data.id = this.setUp.temp.id
          data.user = this.selectList2
          data.remind_type = parseInt(this.temp.sendingMethod)  //发送方式123
          data.cycle_type = parseInt(this.temp.sendingMechanism)  //发送机制123
          if(this.temp.sendingMechanism == 2){
            data.push_limit = this.temp.numberCycles  //循环次数
            data.interval_time = intervalPeriodTime //间隔周期
          }
          if(this.temp.sendingMechanism == 3){
            data.interval_time = intervalPeriodTime //间隔周期
          }
        }
        // 发送方式-延时
        if(this.temp.sendingMethod == '2'){
          data.id = this.setUp.temp.id
          data.user = this.selectList2
          data.sys_name = 'tmrWatch'
          data.type_name = this.temp.messageName
          data.template_id = 'RLPlaCnqQZt_6s4HZuaFJYbQ9gmTfIYipTYDoKJInY8'
          data.pastureid = Cookies.get('pastureid')
          data.remind_type = parseInt(this.temp.sendingMethod)  //发送方式123
          data.delay_time = delayedTime //延时
          data.push_time = this.temp.sendTime //发送时间
          data.cycle_type = parseInt(this.temp.sendingMechanism)  //发送机制123
          if(this.temp.sendingMechanism == 2){
            data.push_limit = this.temp.numberCycles  //循环次数
            data.interval_time = intervalPeriodTime
          }
          if(this.temp.sendingMechanism == 3){
             data.interval_time = intervalPeriodTime //间隔周期
          }
        }
        // 发送方式-指定周期
        if(this.temp.sendingMethod == '3'){
          data.id = this.setUp.temp.id
          data.user = this.selectList2
          data.sys_name = 'tmrWatch'
          data.type_name = this.temp.messageName
          data.template_id = 'RLPlaCnqQZt_6s4HZuaFJYbQ9gmTfIYipTYDoKJInY8'
          data.pastureid = Cookies.get('pastureid')
          data.remind_type = parseInt(this.temp.sendingMethod)  //发送方式123
          data.cycle_type = '4'//发送机制
          data.date_type = parseInt(this.temp.cycleType)  //周期类型
          data.push_time = this.temp.sendTime //发送时间
          if(this.temp.cycleType == 2){
            data.push_date = this.temp.week
          }else{
            data.push_date = this.temp.month
          }
        }
        postJson(url,data).then(response => {
          if(response.code == 200){
            console.log('成功')
            this.$notify({ title: '成功', message: '保存成功', type: 'success', duration: 2000 })
            this.setUp.dialogFormVisible = false
            this.getList()
          }else{
            this.$notify({ title: '失败', message: response.message, type: 'warning', duration: 2000 })
            console.log('失败')
          }
        })
      }
    }
  }
</script>

<style scoped>
  .app-container{
    padding: 20px 20px;
  }
  .content-left{padding: 5px 5px;}
  .content-left b{padding-right: 10px;}

  .QRcode{display:flex;justify-content: center; align-items:center;}
  .content{
    /* margin-top: 100px; */
    width: 500px;
  }
  .content img{
    max-width:300px;

  }
</style>