<div class="form-group">
   <div class="col-sm-2 control-label">APPID</div>
   <div class="col-sm-10">
      <select v-model="shyfkAct.appid"  id="merId" class="form-control" >
         <option v-for="item in items" v-bind:value="item.value">
{{item.text}}
         </option>
 
      </select>
   </div>
</div>

$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'shyfk/act/list',
datatype: "json",
colModel: [

            { label: 'id', name: 'id',  width: 120, key: true },
{ label: '活動標題', name: 'title', width: 75},
{ label: '開始日期', name: 'startDate'
 
, width: 75 },
{ label: '結束日期', name: 'endDate', width: 70 },
{ label: '充值金額', name: 'recharge', width: 70,
formatter:function(value,row){
                    var str=0.00;
if(!isNaN(value)){
                        str=value/100.00;
return str.toFixed(2);
}else {
                        return '0.00';
}}
            },
 
{ label: '贈送金額', name: 'gift', width: 70 ,
formatter:function(value,row){
                    var str=0.00;
if(!isNaN(value)){
                        str=value/100.00;
return str.toFixed(2);
}else {
                        return '0.00';
}}
            },
{ label: '狀態', name: 'state', width: 70,
formatter:function(value,row){
                    if( value == "0" ) {
                        return "關閉";
}else if( value == "1" ){
                        return "開啟";
}else {
                        return "";
}}
            },
{ label: 'APPID', name: 'appid', width: 70}
        ],
viewrecords: true,
height: 385,
rowNum: 10,
rowList : [10,30,50],
rownumbers: true, 
rownumWidth: 25, 
autowidth:true,
multiselect: true,
pager: "#jqGridPager",
jsonReader : {
            root: "page.list",
page: "page.pageNum",
total: "page.pages",
records: "page.total"
},
prmNames : {
            page:"page", 
rows:"limit", 
order: "order"
},
gridComplete:function(){
           //隱藏grid底部滾動條
           //$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" });
}
    });
laydate.render({
        elem: '#startDate',
type: 'date',
format:"yyyy-MM-dd",
done: function (value, date, endDate) {
            vm.shyfkAct.startDate=value;
}
    });
laydate.render({
        elem: '#endDate',
type: 'date',
format:"yyyy-MM-dd",
done: function (value, date, endDate) {
            vm.shyfkAct.endDate=value;
}
    });
vm.getMerchant();
});
var vm = new Vue({
   el:'#rrapp',
data:{
      q:{
            title: null
},
showList: true,
/* selected: "",*/
items: [{text: '請選擇請商戶', value: ''}],
title: null,
shyfkAct: {
         id:null,
title:null,
startDate:null,
endDate:null,
recharge:null,
gift:null,
state:null
}
   },
methods: {
        query: function () {
            vm.reload();
},
add: function(){
            this.showList = false;
vm.title = "新增";
vm.shyfkAct = {};
vm.shyfkAct.appid="";
/*            vm.selected = "";
            vm.items = [{text: '請選擇請商戶APPID', value: ''}];
            vm.getMerchant();*/
vm.shyfkAct={
                id:null,
title:null,
startDate:null,
endDate:null,
recharge:null,
gift:null,
state:null
}

      },
update: function (event) {
            var id = getSelectedRow();
if(id == null){
                return ;
}
            $.get(baseURL + "shyfk/act/info/"+id, function(r){
                vm.showList = false;
vm.title = "修改";
/*                vm.selected = "";
                vm.items = [{text: '請選擇請商戶APPID', value: ''}];*/
        /*        vm.getMerchant();*/
vm.shyfkAct = r.shyfkAct;
});
},
del: function (event) {
         var ids = getSelectedRows();
if(ids == null){
            return ;
}
         
         confirm('確定要刪除選中的記錄？', function(){
            $.ajax({
               type: "POST",
url: baseURL + "shyfk/act/delete",
contentType: "application/json",
data: JSON.stringify(ids),
success: function(r){
                  if(r.code == 200){
                     alert('操作成功', function(index){
                        vm.reload();
});
}else{
                     alert(r.msg);
}
               }
            });
});
},
saveOrUpdate: function (event) {
           /* vm.shyfkAct.appid =  $("#merId").find("option:selected").val();*/
if(vm.check()){
         var url = vm.shyfkAct.id == null ? "shyfk/act/save" : "shyfk/act/update";
$.ajax({
            type: "POST",
url: baseURL + url,
contentType: "application/json",
data: JSON.stringify(vm.shyfkAct),
success: function(r){
                if(r.code == 200){
                  alert('操作成功', function(index){
                     vm.reload();
});
}else{
                  alert(r.msg);
}
            }
         });
}
      },
check: function () {
            if(vm.shyfkAct.title == null){
                layer.msg("活動名稱為必輸項!");
return false;
}
            if(vm.shyfkAct.startDate == null){
                layer.msg("開始日期必輸項!");
return false;
}
            if(vm.shyfkAct.endDate == null){
                layer.msg("結束日期為必輸項!");
return false;
}
            if(vm.shyfkAct.recharge == null){
                layer.msg("充值金額為必輸項!");
return false;
}else if (vm.shyfkAct.recharge <= 0){
                layer.msg("充值金額不能為負數");
return false;
}
            if(vm.shyfkAct.gift == null){
                layer.msg("贈送金額為必輸項!");
return false;
}else if (vm.shyfkAct.gift <= 0){
                layer.msg("贈送金額不能為負數");
return false;
}
            if(vm.shyfkAct.state == null){
                layer.msg("狀態為必輸項!");
return false;
}
            if(vm.shyfkAct.endDate!=""&& vm.shyfkAct.startDate!="" && vm.shyfkAct.startDate >= vm.shyfkAct.endDate) {
                layer.msg("開始日期必須小於結束日期!");
return false;
}
            if(vm.shyfkAct.appid==null||vm.shyfkAct.appid==""){
                alert("請選擇商戶");
return;
}
            return true;
},
decimalFormat: function(str ,int_num,point_num,alertStr) {
            RegularExp_tmp="/^[+,-]{0,1}[0-9]{0,"+int_num+"}[.]{1}[0-9]{0,"+point_num+"}$|^[+,-]{0,1}[0-9]{0,"+int_num+"}$/";
RegularExp=eval(RegularExp_tmp);
if (RegularExp.test(str)) {
                return true;
}
            else {
                return false;
}
        },
getMerchant: function () {
            vm.items = [{text: '請選擇商戶', value: ''}];
$.get(baseURL + "shyfk/act/getMerchant", function (r) {
                for (var i = 0; i < r.merchantList.length; i++) {
                    var text = r.merchantList[i].merName;
var value = r.merchantList[i].appid;
vm.items.push({text: text, value: value});
}
            });
},
reload: function (event) {
         vm.showList = true;
var page = $("#jqGrid").jqGrid('getGridParam','page');
$("#jqGrid").jqGrid('setGridParam',{ 
                postData:{'title': vm.q.title},
page:page
            }).trigger("reloadGrid");
}

   }
});