<template>
  <div style="flex: 1.5;" class="flex">
    <div class="flex">
      <criteria-paged :model="model" v-ref:paged  @sort="sort">
        <criteria partial='criteria' v-ref:criteria @condition-changed="$parent.selfSearch">
          <div novalidate class="form-inline auto" partial>
            <div class="form-group">
              <input type="text" class="form-control" v-model="model.f_outlets_name"
                     condition="f_outlets_name like '%{}%'" placeholder='营业网点名称'>
            </div>
            <div class="form-group">
              <input type="text" class="form-control" v-model="model.f_outlets_phone"
                     condition="f_outlets_phone like '%{}%'" placeholder='营业网点电话'>
            </div>
            <div class="form-group">
              <input type="text" class="form-control" v-model="model.f_outlets_adcode"
                     condition="f_outlets_adcode like '%{}%'" placeholder='邮政编码'>
            </div>
            <div class="form-group">
              <button class="btn btn-success" @click="search (),$parent.$parent.cleaner()">查询</button>
            </div>
            <div class="form-group">
              <button class="btn btn-success" @click="$parent.$parent.modify()">新增</button>
            </div>
          </div>
        </criteria>
        <data-grid :model="model" v-ref:grid partial='list'>
          <template partial='head'>
            <tr>
              <th>
                <nobr>序号</nobr>
              </th>
              <th>
                <nobr>营业网点名称</nobr>
              </th>
              <th>
                <nobr>营业网点电话</nobr>
              </th>
              <th>
                <nobr>营业网点营业时间</nobr>
              </th>
              <th>
                <nobr>营业网点地址</nobr>
              </th>
              <th>
                <nobr>乘车线路</nobr>
              </th>
              <th>
                <nobr>邮政编码</nobr>
              </th>
              <th>
                <nobr>经度</nobr>
              </th>
              <th>
                <nobr>纬度</nobr>
              </th>
              <th>
                <nobr>组织编码</nobr>
              </th>
              <th>
                <nobr>操作</nobr>
              </th>
            </tr>
          </template>
          <template partial='body'>
            <td style="text-align: center;">{{$index + 1}}</td>
            <td style="text-align: center;">{{row.f_outlets_name}}</td>
            <td style="text-align: center;">{{row.f_outlets_phone}}</td>
            <td style="text-align: center;">{{row.f_outlets_hours}}</td>
            <td style="text-align: center;">{{row.f_outlets_address}}</td>
            <td style="text-align: center;">{{row.f_outlets_lines}}</td>
            <td style="text-align: center;">{{row.f_outlets_adcode}}</td>
            <td style="text-align: center;">{{row.f_outlets_lng}}</td>
            <td style="text-align: center;">{{row.f_outlets_lat}}</td>
            <td style="text-align: center;">{{row.f_orgstr}}</td>
            <td style="text-align: center;">
            <button type="button" name="button" class="btn btn-link"
                    @click="$parent.$parent.$parent.modifyInfo(row)">修正
            </button>
          </td>
          </template>
        </data-grid>
      </criteria-paged>
      <div style="height: 500px;" v-show="row " class="select-overspread">
        <outlets-general-info v-if="row " :row="row" @clean="clean" @success="renew"
                              @build-success="buildFileSuccess"></outlets-general-info>
      </div>
    </div>
  </div>

  <modal :show.sync="update_show"  backdrop="false">
    <header slot="modal-header" class="modal-header">
      <h4 class="modal-title">修改营业网点</h4>
    </header>
    <article slot="modal-body" class="modal-body">
      <form class="form-horizontal" >
        <div class="form-group">
          <label for="f_outlets_name" class="control-label">营业网点名称</label>
          <input type="text"  class="form-control" v-model="updaterow.f_outlets_name"
                 placeholder='营业网点名称'>
        </div>
        <div class="form-group">
          <label for="f_outlets_phone" class="control-label">营业网点电话</label>
          <input type="text" class="form-control" v-model="updaterow.f_outlets_phone"
                 placeholder='营业网点电话'>
        </div>
        <div class="form-group">
          <label for="f_outlets_hours" class="control-label">营业网点营业时间</label>
          <input type="text" class="form-control" v-model="updaterow.f_outlets_hours"
                 placeholder='营业网点营业时间'>
        </div>
        <div class="form-group">
          <label for="f_outlets_address" class="control-label">营业网点地址</label>
          <input type="text" class="form-control" v-model="updaterow.f_outlets_address"
                 placeholder='营业网点地址'>
        </div>
        <div class="form-group">
          <label for="f_outlets_lines" class="control-label">乘车路线</label>
          <input type="text" class="form-control" v-model="updaterow.f_outlets_lines"
                 placeholder='乘车路线'>
        </div>
        <div class="form-group">
          <label for="f_outlets_adcode" class="control-label">邮政编码</label>
          <input type="text" class="form-control" v-model="updaterow.f_outlets_adcode"
                 placeholder='邮政编码'>
        </div>
        <div class="form-group">
          <label for="f_outlets_lng" class="control-label">经度</label>
          <input type="text" class="form-control" v-model="updaterow.f_outlets_lng"
                 placeholder='经度'>
        </div>
        <div class="form-group">
          <label for="f_outlets_lat" class="control-label">纬度</label>
          <input type="text" class="form-control" v-model="updaterow.f_outlets_lat"
                 placeholder='纬度'>
        </div>
        <div class="form-group">
          <label for="f_outlets_lat" class="control-label">修改原因</label>
          <input type="text" class="form-control" v-model="updaterow.f_reason"
                 placeholder='纬度'>
        </div>
      </form>
    </article>

    <footer slot="modal-footer" class="modal-footer">
      <button type="button" class="btn btn-success" @click='updateConfirm'>确认</button>
      <button type="button" class="btn btn-default" @click='updateclose'>取消</button>
    </footer>
  </modal>

  <modal :show.sync="inputtor_show" backdrop="false">
  <header slot="modal-header" class="modal-header">
    <h4 class="modal-title">新增营业网点</h4>
  </header>
  <article slot="modal-body" class="modal-body">
    <form class="form-horizontal">
      <div class="form-group" >
        <label for="f_outlets_name" class="control-label">营业网点名称</label>
        <input type="text" class="form-control col-sm-2" v-model="model.f_outlets_name"
                placeholder='营业网点名称'>
      </div>
      <div class="form-group">
        <label for="f_outlets_phone" class="control-label">营业网点电话</label>
        <input type="text" class="form-control" v-model="model.f_outlets_phone"
               placeholder='营业网点电话'>
      </div>
      <div class="form-group">
        <label for="f_outlets_hours" class="control-label">营业网点营业时间</label>
        <input type="text" class="form-control" v-model="model.f_outlets_hours"
               placeholder='营业网点营业时间'>
      </div>
      <div class="form-group">
        <label for="f_outlets_address" class="control-label">营业网点地址</label>
        <input type="text" class="form-control" v-model="model.f_outlets_address"
               placeholder='营业网点地址'>
      </div>
      <div class="form-group">
        <label for="f_outlets_lines" class="control-label">乘车路线</label>
        <input type="text" class="form-control" v-model="model.f_outlets_lines"
               placeholder='乘车路线'>
      </div>
      <div class="form-group">
        <label for="f_outlets_adcode" class="control-label">邮政编码</label>
        <input type="text" class="form-control" v-model="model.f_outlets_adcode"
               placeholder='邮政编码'>
      </div>
      <div class="form-group">
        <label for="f_outlets_lng" class="control-label">经度</label>
        <input type="text" class="form-control" v-model="model.f_outlets_lng"
               placeholder='经度'>
      </div>
      <div class="form-group">
        <label for="f_outlets_lat" class="control-label">纬度</label>
        <input type="text" class="form-control" v-model="model.f_outlets_lat"
               placeholder='纬度'>
      </div>
    </form>
  </article>

  <footer slot="modal-footer" class="modal-footer">
    <button type="button" class="btn btn-success" @click='insertConfirm'>确认</button>
    <button type="button" class="btn btn-default" @click='thisclose'>取消</button>
  </footer>
  </modal>
</template>

<script>
  import co from 'co'
  import {PagedList} from 'vue-client'
  import Vue from 'vue'

  let loadParamGem = async function (self) {
    console.log('获取登录信息，', self.$login, self.$appdata, self.$appdata.getParam('用户类型'), Vue.$login.f.name)
    self.headers.username = Vue.$login.f.name
    self.headers.username = Vue.$login.guid()
    await self.search()
    await self.$LoadParams.loadParam()
    self.initAdjustables()
  }
  let update = async function (self) {
    let param = {
      id: self.updaterow.id,
      f_outlets_name: self.updaterow.f_outlets_name,
      f_outlets_phone: self.updaterow.f_outlets_phone,
      f_outlets_hours: self.updaterow.f_outlets_hours,
      f_outlets_address: self.updaterow.f_outlets_address,
      f_outlets_lines: self.updaterow.f_outlets_lines,
      f_outlets_adcode: self.updaterow.f_outlets_adcode,
      f_outlets_lng: self.updaterow.f_outlets_lng,
      f_outlets_lat: self.updaterow.f_outlets_lat,
      f_outlets_operator: self.$login.f.name,
      f_reason: self.updaterow.f_reason
    }
    console.log('修改营业网点', param)
    self.$resetpost('rs/logic/updateoutlets', param).then(() => {
      // this.params.rows.splice(index, 1)
      console.log('更新成功！')
      this.$refs.paged.$refs.criteria.search()
      this.f_error_reason = ''
    })
    self.update_show = false
  }
  let insert = async function (self) {
    let param = {
      f_outlets_name: self.model.f_outlets_name,
      f_outlets_phone: self.model.f_outlets_phone,
      f_outlets_hours: self.model.f_outlets_hours,
      f_outlets_address: self.model.f_outlets_address,
      f_outlets_lines: self.model.f_outlets_lines,
      f_outlets_adcode: self.model.f_outlets_adcode,
      f_outlets_lng: self.model.f_outlets_lng,
      f_outlets_lat: self.model.f_outlets_lat,
      f_outlets_operator: self.$login.f.name
    }
    console.log('新增营业网点', param)
    self.$resetpost('rs/logic/addoutlets', param).then(() => {
      // this.params.rows.splice(index, 1)
      console.log('更新成功！')
      this.f_error_reason = ''
    })

    self.inputtor_show = false
    self.search()
  }
  export default {
    'title': '营业网点',
    data () {
      return {

        model: new PagedList('rs/sql/getOutLets', 10, {orderitem: '`id DESC`'}),

        row: null, // 选择一条用户信息，对其进行修改

        // 要操作的用户
        rowsdata: [],
        // 控制全选
        all: [],
        // 控制单选
        radio: [],
        // 控制查询条件显示
        searchshow: false,
        // 控制新增弹窗
        inputtor_show: false,
        // 控制修改弹窗
        update_show: false,
        updaterow: null
      }
    },

    ready () {
      console.log('add')
      this.search()
    },
    methods: {
      cleaner () {
        console.log('12312312')
        Object.keys(this.$refs.paged.$refs.criteria.model).forEach((key) => {
          this.$refs.paged.$refs.criteria.model[key] = ''
        })
        console.log('condition:', this.$refs.paged.$refs.criteria.condition)
        this.model.search(this.$refs.paged.$refs.criteria.condition)
      },
      look () {
        console.log('look')
      },
      add () {
        console.log('add')
      },
      search () {
        console.log('aa')
        let condition = '1=1'
        this.model.search(condition)
      },
      selfSearch (args) {
        this.model.search(args.condition, args.model)
      },
      checkOverdue () {
        this.$nextTick(() => {
          this.newOverdue = this.row.f_overdue_date ? this.row.f_overdue : this.data.f_overdue
          this.calOverdue()
        })
      },
      modifyInfo (row) {
        console.log('modifyrow')
        this.updaterow = row
        this.update_show = true
      },
      // 小区批量建档成功
      buildFileSuccess (data) {
        // console.log('建档案成功', data)
        this.model.rows.unshift(data)
      },
      renew () {
        this.row = null
        this.areainfo = null
        this.clearCondition()
        this.search()
        // 建档或修正档案成功刷新地址列表
        this.$refs.addressfiles.$refs.paged.$refs.cri.search()
      },
      modify () {
        console.log('modify')
        this.inputtor_show = true
      },
      updateclose () {
        this.update_show = false
        this.search()
      },
      thisclose () {
        this.inputtor_show = false
      },
      confirmOverdue () {
        if (!this.editOverdue) {
          this.showErrorMsg = true
          return
        }
        this.newOverdue = this.editOverdue
        this.showErrorMsg = false
        let data = {
          f_overdue: this.newOverdue,
          f_user_id: this.data.f_user_id
        }
        console.log(data, 'data-overude')
        this.$resetpost('rs/logic/editOverdue', data).then(() => {
          this.showOverdueModal = false
          this.$dispatch('success', '机表收费')
        })
      },
      closeOverdue () {
        this.showOverdueModal = false
        this.editOverdue = null
        this.showErrorMsg = false
      },
      confirm () {
        this.data.f_overdue = this.newOverdue
        console.log(this.data.f_overdue, this.data.f_last_overdue, '滞纳金')
        // 未滞纳金修改添加，将修改的值，原因添加到this.data.logicmodel中
        // 如果有变更原因说明有变更
        if (this.f_cause && this.f_cause.length > 0) {
          this.data.f_paydelaypay = this.f_paydelaypay // 应缴滞纳金
          this.data.f_delaypay = this.f_delaypay // 实缴滞纳金
          this.data.f_cause = this.f_cause // 变更原因
        }
        this.$showMessage(`确定对用户${this.row.f_user_name}进行机表缴费吗？`, ['confirm', 'cancel']).then((res) => {
          if (res === 'confirm') {
            machineChargeGen(this)
          }
        })
      },
      calOverdue () {
        this.data.f_last_overdue = this.data.f_overdue
        this.data.f_lowest = this.data.f_lowest - (this.data.f_overdue - this.newOverdue)
        this.data.f_totalcost = this.data.f_totalcost - (this.data.f_overdue - this.newOverdue)
        this.data.f_overdue = this.newOverdue
        this.data.f_collection = this.data.f_totalcost
      },
      clean () {
        this.$dispatch('success', '机表收费', this.data)
        this.$info('取消操作')
      },
      printok () {
        this.$dispatch('success')
      },
      close () {
        this.print = false
        this.clean()
      },
      changeOverdue (val, reason) {
        this.$set('f_paydelaypay', this.newOverdue) // 应交滞纳金
        this.newOverdue = val // 实缴滞纳金
        this.$set('f_delaypay', this.newOverdue) // 实缴滞纳金
        this.$set('f_cause', this.reason) // 实缴滞纳金
        this.calOverdue()
      },
      updateConfirm () {
        this.$showMessage(`是否确认修改此营业网点`, ['confirm', 'cancel']).then((res) => {
          if (res === 'confirm') {
            update(this)
          }
        })
      },
      async insertConfirm () {
        if (!this.model.f_outlets_name) {
          this.$showAlert('请输入网点名称', 'warning', 1500)
          return
        }
        if (!this.model.f_outlets_phone) {
          this.$showAlert('请输入网点电话', 'warning', 1500)
          return
        }
        await this.$showMessage(`是否确认添加新的营业网点`, ['confirm', 'cancel']).then((res) => {
          if (res === 'confirm') {
            insert(this)
          }
        })
      }
    },

    computed: {
    },
    events: {
      onFileUpload: function (file, res) {
        let data = {
          tablename: 't_userinfo',
          filepath: res.path
        }
        this.$resetpost('rs/logic/import', data, {resolveMsg: null, rejectMsg: '上传失败'}).then((res) => {
          console.log('dddddddd', this)
          this.close()
          this.$showAlert(`一共上传${res.data.total}条数据, 成功${res.data.successnum}条`, 'success', 2000)
          this.search()
        })
      }
    }
  }
</script>
<style>
  .nav-tabss ul > li > a {
    padding: 5px 10px;
  }
</style>
