<template>
  <el-tabs v-model="curTab">
    <el-tab-pane label="演示效果" name="demo">
      <form  v-form >
        <table class="form-table" cellspacing="0" cellpadding="0" border="0">
          <tbody>
            <tr v-permit="4" v-for="(data,$index) in list" :key="$index" data-subname="data.test"  :data-index="$index">
              <td>
                <ht-select
                  v-model="data.ah"
                  class="m-r"
                  :options="[{ key: '1', value: '爬山' },{ key: '2', value: '游泳' },{ key: '3', value: '下棋' }]"
                  :linkage="[{'value':'1','effect':[{'target': 'permission.shan', 'type': '=','value': 'b'}]},
               {'value':'2','effect':[{'target': 'permission.yong', 'type': '=', 'value': 'w'},{'target': '','ref':'data.shan', 'type': '+', 'value': 'email'}]},
               {'value':'3','effect':[{'target': 'permission.qi', 'type': '=', 'value': 'n'}]}]"
                />
                <ht-input
                  :permission="permission.shan"
                  v-model="data.shan"
                  :ref="'data.shan'+$index"
                  :validate="'required'"
                  placeholder="喜欢爬哪座山"
                />
                <ht-input
                  :permission="permission.yong"
                  v-model="data.yong"
                  :ref="'data.yong'+$index"
                  :validate="'required'"
                  placeholder="喜欢哪种泳姿"
                />
                <ht-input
                  :permission="permission.qi"
                  v-model="data.qi"
                  model-expression="data.qi"
                  :ref="'data.qi'+$index"
                  :validate="'required'"
                  placeholder="喜欢哪种棋"
                />
              </td>
            </tr>

          </tbody>
        </table>
      </form>
    </el-tab-pane>
    <el-tab-pane label="api文档" name="api">
      <MdView url="md/linkage.md" />
    </el-tab-pane>
  </el-tabs>
</template>
<script>
import MdView from "@/views/MdView.vue";

export default {
  components: { MdView },
  data() {
    return {
      curTab: "demo",
      data: {
        ah: "",
        shan: "",
        yong: "w",
        qi: "w",
        eee: ""
      },
      list:[{}],
      permission: {
        shan: "w",
        yong: "w",
        qi: "w"
      }
    };
  }
};
</script>