<template>
  <div class="flex-row">
    <div class="basic-main">
      <criteria-paged :model="model" v-ref:cp>
        <criteria partial='criteria' @condition-changed='$parent.searchCondition' v-ref:cri>
          <div class="form-horizontal select-overspread container-fluid auto" partial>
            <div class="row">
              <div class="form-group col-sm-3">
                <label class="font_normal_body">组织机构：</label>
                <res-select
                  restype='organization'
                  :initresid='$parent.$parent.curorgid'
                  @res-select="$parent.$parent.getorg"
                  is-mul="false"
                ></res-select>
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body">操&ensp;作&ensp;人：</label>
                <input type="text" style="width: 60%" class="input_search" placeholder='操作人' v-model="model.f_service_person"
                       v-on:keyup.enter="$parent.$parent.search()"
                       condition="f_service_person like '%{}%'">
              </div>
              <div class="form-group col-sm-3 button-range">
                <button class="button_search button_spacing" @click="$parent.$parent.search()" v-el:cx>查询</button>
                <button class="button_clear button_spacing"  @click="$parent.$parent.clear()">清空</button>
                <export-excel :data="$parent.$parent.getCondition"
                              :field="$parent.$parent.getfield"
                              sqlurl="rs/logic/SafeExportExcel"
                              sql-name="getSafeMaterialCharge"
                              template-name='材料收费明细导出'
                              :choose-col="true"></export-excel>
                <div
                  :class="{'button_shrink_top':$parent.$parent.criteriaShow,'button_shrink_bottom':!$parent.$parent.criteriaShow}"
                  @click="$parent.$parent.criteriaShow = !$parent.$parent.criteriaShow"
                  class="button_spacing"
                  style="float: right">
                </div>
              </div>
            </div>
            <div class="row" v-show="$parent.$parent.criteriaShow">
              <div class="form-group col-sm-3">
                <label class="font_normal_body">客户名称：</label>
                <input type="text" style="width: 60%" class="input_search" placeholder='客户名称' v-model="model.f_user_name"
                       v-on:keyup.enter="$parent.$parent.search()"
                       condition="f_user_name = '{}'">
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body">客户电话：</label>
                <input type="text" style="width: 60%" class="input_search" placeholder='客户电话' v-model="model.f_user_phone"
                       v-on:keyup.enter="$parent.$parent.search()"
                       condition="f_user_phone like '%{}%'">
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body">客户地址：</label>
                <input type="text" style="width: 60%" class="input_search" placeholder='客户地址' v-model="model.f_address"
                       v-on:keyup.enter="$parent.$parent.search()"
                       condition="f_address like '%{}%'">
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body">材料名称：</label>
                <input type="text" style="width: 60%" class="input_search" placeholder='材料名称' v-model="model.f_material_name"
                       v-on:keyup.enter="$parent.$parent.search()"
                       condition="f_material_name = '{}'">
              </div>
              <div class="form-group col-sm-3">
                <label class="font_normal_body">材料型号：</label>
                <input type="text" style="width: 60%" class="input_search" placeholder='材料型号' v-model="model.f_material_style"
                       v-on:keyup.enter="$parent.$parent.search()"
                       condition="f_typenumber = '{}'">
              </div>
              <div class="form-group col-sm-3">
                <label  for="startDate" class="font_normal_body">开始时间：</label>
                <datepicker id="startDate" placeholder="开始日期"
                            style="width: 60%!important;"
                            v-model="model.startDate"
                            :value.sync="model.startDate"
                            :format="'yyyy-MM-dd 00:00:00'"
                            :show-reset-button="true"
                            condition="f_operate_date >= '{}'">
                </datepicker>
              </div>
              <div class="form-group col-sm-3">
                <label for="endDate" class="font_normal_body">结束时间：</label>
                <datepicker id="endDate" placeholder="结束日期"
                            style="width: 60%!important;"
                            v-model="model.endDate"
                            :value.sync="model.endDate"
                            :format="'yyyy-MM-dd 23:59:59'"
                            :show-reset-button="true"
                            condition="f_operate_date <= '{}'">
                </datepicker>
              </div>
            </div>
          </div>
        </criteria>
        <data-grid :model="model" partial='list' v-ref:grid style="overflow: auto" class="list_area table_sy">
          <template partial='head'>
            <tr>
              <th>序号</th>
<!--              <th>工单编号</th>-->
              <th>客户名称</th>
              <th>客户电话</th>
              <th>客户地址</th>
              <th>材料名称</th>
              <th>材料型号</th>
              <th>材料数量</th>
              <th>总金额</th>
              <th>备注</th>
              <th>操作人</th>
              <th>操作时间</th>
              <th>操作</th>
            </tr>
          </template>
          <template partial='body'>
            <tr >
              <td style="text-align: center;">
                <nobr><font>{{$index+1}}</font></nobr>
              </td>
<!--              <td style="text-align: center;">-->
<!--                <nobr><font>{{row.f_service_id}}</font></nobr>-->
<!--              </td>-->
              <td style="text-align: center;">
                <nobr><font>{{row.f_user_name}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_user_phone}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_address}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_material_name}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_typenumber}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_material_number}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_fee}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_remarks}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_service_person}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr><font>{{row.f_operate_date}}</font></nobr>
              </td>
              <td style="text-align: center;">
                <nobr>
                  <button
                    type="button"
                    name="button"
                    class="btn btn-link"
                    @click="$parent.$parent.$parent.openwhModal(row)"
                  >
                    {{ '维护'}}
                  </button>
                </nobr>
                <nobr>
                  <button
                    type="button"
                    name="button"
                    class="btn btn-link"
                    @click="$parent.$parent.$parent.look(row)"
                  >
                    {{ '维护记录'}}
                  </button>
                </nobr>
              </td>
            </tr>
          </template>
        </data-grid>
      </criteria-paged>
    </div>
    <modal v-if="showwh" :show.sync="showwh" v-ref:modal :large="true" :backdrop="false" title="材料维护">
      <header slot="modal-header" class="modal-header">
        <button type="button" class="close" @click="closeModal"><span>&times;</span></button>
        <h4 class="modal-title">材料维护</h4>
      </header>
      <article slot="modal-body" class="modal-body clearfix">
        <div class="form-group col-sm-12" >
          <label class="col-sm-2 control-label">材料名称：</label>
          <div class="col-sm-10">
            <input type="text"
                   class="form-control input_view"
                   style="width: 100%"
                   :value.sync="maintenance.f_material_name"
                   v-model="maintenance.f_material_name" />
          </div>
        </div>
        <div class="form-group col-sm-12">
          <label class="col-sm-2 control-label">型号：</label>
          <div class="col-sm-10">
            <input type="text"
                   class="form-control input_view"
                   style="width: 100%"
                   :value.sync="maintenance.f_material_style"
                   v-model="maintenance.f_material_style" />
          </div>
        </div>
        <div class="form-group col-sm-12">
          <label class="col-sm-2 control-label">单价：</label>
          <div class="col-sm-10">
            <input type="number"
                   class="form-control input_view"
                   style="width: 100%"
                   :value.sync="maintenance.f_material_price"
                   v-model="maintenance.f_material_price" />
          </div>
        </div>
        <div class="form-group col-sm-12">
          <label class="col-sm-2 control-label">数量：</label>
          <div class="col-sm-10">
            <input type="text"
                   class="form-control input_view"
                   style="width: 100%"
                   :value.sync="maintenance.f_material_number"
                   v-model="maintenance.f_material_number" />
          </div>
        </div>
        <div class="form-group col-sm-12">
          <label class="col-sm-2 control-label">金额：</label>
          <div class="col-sm-10">
            <input type="number"
                   class="form-control input_view"
                   style="width: 100%"
                   :value.sync="maintenance.f_fee"
                   v-model="maintenance.f_fee" />
          </div>
        </div>
        <div class="form-group col-sm-12">
          <label class="col-sm-2 control-label">操作人：</label>
          <div class="col-sm-10">
            <input-select
              class="select select_list"
              :value.sync="maintenance.f_operator"
              v-model="maintenance.f_operator"
              :options="useroption"
              :valueSingle="true"></input-select>
          </div>
        </div>
      </article>
      <footer slot="modal-footer" class="modal-footer">
        <button type="button" class="btn btn-primary"  @click="confirm()">确认</button>
      </footer>
    </modal>
    <modal :show.sync="showmaterial"  backdrop="false" style="overflow: scroll;height: 100%">
      <header slot="modal-header" class="modal-header text-center">
        <button type="button" class="close" @click="closeModal"><span>&times;</span></button>
        <h4 class="modal-title">维护记录</h4>
      </header>
      <article slot="modal-body">
        <material-maintenance-look v-if="showmaterial"  :selectdata = "selectdata" ></material-maintenance-look>
      </article>
      <footer slot="modal-footer"></footer>
    </modal>
  </div>
</template>

<script>
Date.prototype.Format = function (fmt) {
  var o = {
    'M+': this.getMonth() + 1, // 月份
    'd+': this.getDate(), // 日
    'H+': this.getHours(), // 小时
    'm+': this.getMinutes(), // 分
    's+': this.getSeconds(), // 秒
    'q+': Math.floor((this.getMonth() + 3) / 3), // 季度
    'S': this.getMilliseconds() // 毫秒
  }
  if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + '').substr(4 - RegExp.$1.length))
  for (var k in o) {
    if (new RegExp('(' + k + ')').test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? (o[k]) : (('00' + o[k]).substr(('' + o[k]).length)))
  }
  return fmt
}
import {PagedList} from 'vue-client'
import {HttpResetClass} from 'vue-client'
export default {
  title: '材料明细',
  data () {
    return {
      model: new PagedList('rs/sql/getSafeMaterialCharge', 30, null),
      curorgid: [this.$login.f.orgid],
      chargeStatus: [
        {label: '全部', value: ''},
        {label: '有效', value: '有效'},
        {label: '作废', value: '作废'},
        {label: '退款', value: '退款'}
      ],
      criteriaShow: false,
      chargeAll: {
        count: 0,
        sum: 0
      },
      getfield: {
        'f_user_name': '客户名称',
        'f_user_phone':'客户电话',
        'f_address': '客户地址',
        'f_material_name': '材料名称',
        'f_typenumber': '材料型号',
        'f_material_number': '材料数量',
        'f_fee': '总金额',
        'f_service_person': '操作人',
        'f_operate_date': '操作时间',
        'f_remarks': '备注'
      },
      showwh: false,
      showmaterial: false,
      maintenance: {
        f_material_name:'',
        f_material_style:'',
        f_material_price:0,
        f_material_number:'',
        f_operator:'',
        f_othercharge_id:'',
        f_fee:0,
      },
      oldmaintenance: {
        f_fee:0,
        f_material_name:'',
        f_newmaterial_name:'',
        f_material_style:'',
        f_newmaterial_style: '',
        f_material_price:0,
        f_newmaterial_price:0,
        f_material_number:'',
        f_newmaterial_number:'',
        f_material_id:'',
        f_operator: this.$login.f.name,
        f_operator_id: this.$login.f.id,
        f_operation_date: new Date().Format('yyyy-MM-dd HH:mm:ss'),
      },
      selectdata:{
        id:''
      },
      useroption: [],
    }
  },
  ready () {
    // 调用查询
    this.search()
    this.getPerson()
  },
  methods: {
    async getPerson() {
      let http = new HttpResetClass()
      let data = {
        items: 'tu.name',
        tablename: 't_user  tu left   join  t_department  tp on  tp.id=tu.parentid left   join  t_organization tg on tg.id=tp.parentid',
        condition: `tg.id='${this.$login.f.orgid}'`,
        orderitem: 'tu.name'
      }
      try {
        this.useroption=[]
        let res = await http.load('POST', `rs/sql/tel_singleTable_OrderBy`, {data: data}, {
          warnMsg: null,
          resolveMsg: null
        })
        res.data.forEach((user)=>{
          this.useroption.push({label: user.name, value: user.name})
        })
      }catch (e) {
        console.log(e)
      }
    },
    look(row){
      this.selectdata.id=row.id
      this.showmaterial=true
    },
    async confirm() {
      this.oldmaintenance.f_newmaterial_name=this.maintenance.f_material_name
      this.oldmaintenance.f_newmaterial_style=this.maintenance.f_material_style
      this.oldmaintenance.f_newmaterial_price=Number(this.maintenance.f_material_price)
      this.oldmaintenance.f_newmaterial_number=Number(this.maintenance.f_material_number)
      let datas = {
        tableName: 't_material_maintenance',
        model:this.oldmaintenance
      }
      let res = await new HttpResetClass().load('POST', `rs/logic/entitySingleTable`, datas, {
        resolveMsg: null,
        rejectMsg: null
      })
      if(res.data==200){
        //修改表中的数据
        let http1 = new HttpResetClass()
        this.showwh= false
        let  charge = `update t_material_service  set f_material_name='${this.maintenance.f_material_name}', f_typenumber='${this.maintenance.f_material_style}',f_fee=${this.maintenance.f_fee},f_material_price=${this.maintenance.f_material_price},f_material_number=${this.maintenance.f_material_number},f_operator='${this.$login.f.name}',f_date='${this.oldmaintenance.f_operation_date}'  where id=${this.oldmaintenance.f_material_id}`
        http1.load('POST', 'rs/logic/runSQL', {data: {sql: charge}},
          {resolveMsg: null, rejectMsg: '作废失败'})
      }
      if(res.data==200){
        let http1 = new HttpResetClass()
        let data = {
          tablename: 't_othercharge',
          condition: `id='${this.maintenance.f_othercharge_id}'`
        }
        let othercharge = await  new HttpResetClass().load('POST', `rs/sql/singleTable`, {data: data}, {
          warnMsg: null,
          resolveMsg: null
        })
        let collection =  othercharge.data[0].f_collection
        let number = Number(this.maintenance.f_fee)-Number(this.oldmaintenance.f_fee)
        let money =Number(collection)+Number(number)
        let charge2 = `update t_othercharge  set f_service_person='${this.maintenance.f_operator}', f_collection='${money}'   where id=${this.maintenance.f_othercharge_id}`
        http1.load('POST', 'rs/logic/runSQL', {data: {sql: charge2}},
          {resolveMsg: null, rejectMsg: '作废失败'})
      }
      this.search()
      this.showwh= false
    },
    openwhModal(row){
        this.showwh= true
        this.maintenance.f_othercharge_id=row.f_othercharge_id
        this.maintenance.f_material_name=row.f_material_name
        this.maintenance.f_material_style=row.f_typenumber
        this.maintenance.f_material_price=row.f_material_price
        this.maintenance.f_fee=row.f_fee
        this.maintenance.f_material_number=row.f_material_number
        this.maintenance.f_operator=row.f_service_person
        this.oldmaintenance.f_material_name=row.f_material_name
        this.oldmaintenance.f_material_style=row.f_typenumber
        this.oldmaintenance.f_fee=row.f_fee
        this.oldmaintenance.f_material_price=row.f_material_price
        this.oldmaintenance.f_material_number=row.f_material_number
        this.oldmaintenance.f_material_id=row.id
        this.oldmaintenance.f_operator=row.f_service_person
    },
    closeModal(){
      this.showwh= false
      this.showmaterial= false
      this.maintenance={}
    },
    clear () {
      Object.keys(this.$refs.cp.$refs.cri.model).forEach((key) => {
        this.$refs.cp.$refs.cri.model[key] = ''
      })
    },
    searchCondition (args) {
      this.model.search(args.condition, args.model)
    },
    // 查询
    search () {
      this.$refs.cp.$refs.cri.search()
    },
    getorg (val) {
      if (val.length <= 0) {
        return
      }
      this.curorgid = val
      this.search()
    }
  },
  computed: {
    getCondition () {
      return {
        condition: this.$refs.cp.$refs.cri.condition
      }
    }
  }
}
</script>

<style scoped>
</style>
