/**
 * 非父子组件数据中转站
 */
var Bus = new Vue();


/**
 * 缓存对象
 */
var Cache = {};


/**
 * 组件公共部分
 */
var commonMixin = {
  data: function () {
    return {
      channelInfo: {}
    }
  },
  created: function () {
    var el = this;
    el.channelInfo = Cache.channelInfo;

    Bus.$on('setChannelInfo', function (r) {
      console.log(r)
      el.channelInfo = r;
    })
  }
}

/**
 * 代理信息
 */
var salesInfo = {
  mixins: [commonMixin],
  template: `
  <div class="container">
    <div class="form-horizontal">
      <div class="form-group">
        <label class="col-xs-3 control-label">代理ID</label>
        <div class="col-xs-6 pr0">
          <input class="form-control" type="number" placeholder="请输入代理ID" v-model="salesid">
        </div>
        <div class="col-xs-3 text-right pl0">
          <button class="btn btn-primary" @click="querySalesInfo">查询</button>
        </div>
      </div>
      <div class="form-group">
        <label class="col-xs-3 control-label">昵称</label>
        <div class="col-xs-9">
          <input class="form-control" type="text" v-model="result.nickname" readonly>
        </div>
      </div>
      <div class="form-group">
        <label class="col-xs-3 control-label">密码</label>
        <div class="col-xs-9">
          <input class="form-control" type="text" v-model="result.password" readonly>
        </div>
      </div>
      <div class="form-group">
        <label for="parent" class="col-xs-3 control-label">父代理</label>
        <div class="col-xs-9">
          <input id="parent" class="form-control" type="text" v-model="result.parentid">
        </div>
      </div>
      <div class="form-group">
        <label class="col-xs-3 control-label">房卡数</label>
        <div class="col-xs-9">
          <input class="form-control" type="text" v-model="result.roomcard">
          <p class="text-danger">此为直接设置，强烈建议只给自己增加，然后通过自己的账号给其他代理充值，方便统计</p>
        </div>
      </div>
      <div class="form-group">
        <label class="col-xs-3 control-label">星星数</label>
        <div class="col-xs-9">
          <input class="form-control" type="text" v-model="result.star">
          <p class="text-danger">此为直接设置，强烈建议只给自己增加，然后通过自己的账号给其他代理充值，方便统计</p>
        </div>
      </div>
      <div class="form-group">
        <label class="col-xs-3 control-label">总代理</label>
        <div class="col-xs-9">
          <input class="form-control" type="number" v-model="result.global_power">
          <p class="text-info">1-是总代理, 0-不是总代理</p>
        </div>
      </div>
    </div>
    
    <div class="row text-center">
      <button class="btn btn-primary w60" @click="save">提交</button>
    </div>
  </div>
  `,
  data: function () {
    return {
      salesid: '20',
      result: {}
    }
  },
  methods: {
    querySalesInfo: function () {
      try {
        var el = this;
        if (!$.isRightId(el.salesid)) throw {code: 102, msg: '请输入正确的代理ID'};

        $.api(
          {
            isLoading: true,
            data: {
              method: 'Admin.Admin.salesInfo',
              biz_content: {
                salesid: el.salesid,
                agentid: el.channelInfo.agentid,
                channelid: el.channelInfo.channelid
              }
            },
            success: function (r) {
              el.result = r;
            }
          }
        );
      } catch (e) {
        $.alert(e.msg);
      }
    },
    save: function () {
      var el = this;
      var tmp = $.extend({}, el.channelInfo, el.result);
      tmp.salesid = el.salesid;

      $.confirm(function () {
        $.api(
          {
            isLoading: true,
            data: {
              method: 'Admin.Admin.changeSalesInfo',
              biz_content: tmp
            },
            success: function (r) {
              el.result = {};
            }
          }
        );
      })

    }
  }
};


var playerInfo = {
  mixins: [commonMixin],
  template: '<p>playerInfo|{{channelInfo.name}}</p>',

};

var createAgent = {
  template: `
<div class="container">
  <div class="form-horizontal">
    <div class="form-group">
      <label class="col-xs-3 control-label">代理商ID</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="agentid">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">名称</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="name">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">默认权限</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="power">
        <p class="text-info">不明白这个，可以不管它</p>
      </div>
    </div>
  </div>
  
  <div class="row text-center">
    <button class="btn btn-primary w60" @click="save">提交</button>
  </div>
</div>
  `,
  data: function () {
    return {
      agentid: '',
      name: '',
      power: '11'
    }
  },
  methods: {
    save: function () {
      var el = this;
      $.api(
        {
          isLoading: true,
          data: {
            method: 'Admin.Admin.createAgent',
            biz_content: {
              agentid: el.agentid,
              name: el.name,
              power: el.power
            }
          },
          success: function (r) {
            $.alert('添加成功');
          }
        }
      );
    }
  }
};

/**
 * 添加新渠道
 */
var createChannel = {
  template: `
<div class="container">
  <div class="form-horizontal">
    <div class="form-group">
      <label class="col-xs-3 control-label">代理商ID</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.agentid">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">渠道ID</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.channelid">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">关联<br>代理商ID</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.parentid">
        <p class="text-primary">没有可关联的，必须填自己的代理商ID</p>
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">名称</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.name">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">logo</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.logo">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">QQ号</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.qq">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">微信号</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.wechat">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">成为代理</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.become_sales_mode">
        <p class="text-primary">2-免费 1-收费 0-收费</p>
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">邀请码模式</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.invitation_model">
        <p class="text-primary">2-开启 1-禁止 0-禁止</p>
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">玩家购卡</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.buy_card_mode">
        <p class="text-primary">2-可购买 1-不可购买 0-不可购买</p>
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">是否开放</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.is_open">
        <p class="text-primary">1-开放 0-关闭</p>
      </div>
    </div>
  </div>
  
  <div class="row text-center">
    <p><button class="btn btn-default w60" @click="queryChannelInfo">查询本渠道信息</button></p>
    <p><button class="btn btn-primary w60" @click="changeChannelInfo">保存本渠道信息</button></p>
    <p><button class="btn btn-success w60" @click="createChannel">生成新渠道</button></p>
  </div>
</div>
  `,
  mixins: [commonMixin],
  data: function () {
    return {
      result: {
        agentid: '',
        channelid: '',
        name: '',
        parentid: '',
        logo: '',
        qq: '',
        wechat: '',
        become_sales_mode: '2',
        invitation_model: '2',
        buy_card_mode: '2',
        is_open: '1',
        id:''
      }
    }
  },
  methods: {
    queryChannelInfo: function () {
      var el = this;
      $.api(
        {
          isLoading: true,
          data: {
            method: 'Admin.Admin.queryChannelInfo',
            biz_content: el.channelInfo,
          },
          success: function (r) {
            el.result = r;
          }
        }
      );
    },
    changeChannelInfo: function () {
      var el = this;
      $.api(
        {
          isLoading: true,
          data: {
            method: 'Admin.Admin.changeChannelInfo',
            biz_content: el.result,
          },
          success: function (r) {
            $.alert('保存成功');
          }
        }
      );
    },
    createChannel: function () {
      var el = this;
      $.confirm(function () {
        $.api(
          {
            isLoading: true,
            data: {
              method: 'Admin.Admin.createChannel',
              biz_content: el.result,
            },
            success: function (r) {
              $.alert('添加成功');
            }
          }
        );
      });
    }
  }
};

/**
 * 添加游戏
 */
var createGame = {
	template: `
<div class="container">
	<div class="form-horizontal">
    <div class="form-group">
      <label class="col-xs-3 control-label">渠道ID</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.channelid">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">游戏ID</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.gameid">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">名称</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.gamename">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">logo</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.logo">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">描述</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.description">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">苹果<br>下载地址</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.ios_download_url">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">苹果<br>下载类型</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.ios_market_type">
        <p class="text-primary">0-普通 2-企业签</p>
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">苹果<br>app大小</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.ios_app_size">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">安卓<br>下载地址</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.android_download_url">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">安卓<br>app大小</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.android_app_size">
      </div>
    </div>
    <div class="form-group">
      <label class="col-xs-3 control-label">是否开放</label>
      <div class="col-xs-9">
        <input class="form-control" type="text" v-model="result.is_open">
        <p class="text-primary">0-关闭 1-开放</p>
      </div>
    </div>
  </div>
  
  <div class="row text-center">
    <p><button class="btn btn-success w60" @click="createGame">添加游戏</button></p>
  </div>
</div>
	`,
  data: function () {
    return {
      result: {
        channelid: '',
				gameid: '',
				gamename: '',
				logo: '',
				description: '',
				ios_download_url: '',
				ios_market_type: '2',
				ios_app_size: '',
				android_download_url: '',
				android_app_size: '',
				is_open: '1'
      }
    }
	},
  methods: {
		createGame: function () {
			var el = this;
			$.confirm(function () {
				$.api(
					{
						isLoading: true,
						data: {
							method: 'Admin.Admin.createGame',
							biz_content: el.result
						},
						success: function (r) {
							$.alert('添加成功');
						}
					}
				);
			});
		}
  }
};

/**
 * 选择渠道
 */
var channelList = {
  template: `
<div class="container pt15">
    <select v-model="channelInfo" class="form-control">
      <option v-for="(v,i) in channelList" :value="v">{{v.name}}</option>
    </select>
    <hr>
</div>
  `,
  data: function () {
    return {
      channelInfo: {},
      channelList: []
    }
  },
  watch: {
    channelInfo: function () {
      Bus.$emit('setChannelInfo', this.channelInfo);
      Cache.channelInfo = this.channelInfo;
    }
  },
  methods: {
    getChannelList: function () {
      var el = this;
      $.api(
        {
          data: {
            method: 'Admin.Admin.channelList',
            biz_content: {a: 'a'}
          },
          success: function (r) {
            el.channelList = r;
            el.channelInfo = r[0];
            Cache.channelInfo = el.channelInfo;
          }
        }
      );
    }
  },
  created: function () {
    this.getChannelList();
  }
}

/**
 * 菜单列表
 */
var menuList = {
  template: `
<div class="container">
  <div class="row">
    <div class="col-xs-4"><router-link to="/salesInfo">代理信息</router-link></div>
    <div class="col-xs-4"><router-link to="/playerInfo">playerInfo</router-link></div>
    <div class="col-xs-4"></div>
  </div>
  <div class="row">
    <div class="col-xs-4"><router-link to="/createAgent">添加代理商</router-link></div>
    <div class="col-xs-4"><router-link to="/createChannel">添加渠道</router-link></div>
    <div class="col-xs-4"><router-link to="/createGame">添加游戏</router-link></div>
  </div>
</div>
`
}

var routes = [
  {
    path: '/',
    components: {
      default: channelList,
      a: menuList
    }
  },
  {
    path: '/salesInfo',
    components: {
      default: channelList,
      a: salesInfo
    }
  },
  {
    path: '/playerInfo',
    components: {
      default: channelList,
      a: playerInfo
    }
  },
  {
    path: '/createAgent',
    components: {
      default: channelList,
      a: createAgent
    }
  },
  {
    path: '/createChannel',
    components: {
      default: channelList,
      a: createChannel
    }
  },
	{
		path: '/createGame',
		components: {
			default: channelList,
			a: createGame
		}
	}
];

var router = new VueRouter({routes: routes});

var app = new Vue({router: router}).$mount('#app');