{% block htmlHead %}
<style>
/* css */
</style>
{% endblock %}

{% extends 'template/jhTemplateV4.html'%}
{% block vueTemplate %}
<script type="text/html" id="app-template">
<div>
    <v-app mobile-breakpoint="sm">
        <jh-menu />
        <v-main class="mt-15">
            <!-- 头部内容 >>>>>>>>>>>>> -->
            <!-- <<<<<<<<<<<<< 头部内容 -->

            <!-- 页面内容 >>>>>>>>>>>>> -->
            <!-- <<<<<<<<<<<<< 页面内容 -->

            <!-- 新增抽屉 >>>>>>>>>>>>> -->
            <!-- <<<<<<<<<<<<< 新增抽屉 -->

            <!-- 编辑抽屉 >>>>>>>>>>>>> -->
            <!-- <<<<<<<<<<<<< 编辑抽屉 -->

            <!-- 帮助页抽屉 >>>>>>>>>>>>> -->
            <!-- <<<<<<<<<<<<< 帮助页抽屉 -->
        </v-main>
    </v-app>

    <jh-toast />
    <jh-mask />
    <jh-confirm-dialog />
</div>
</script>
<div id="app"></div>
{% endblock %}

{% block vueScript %}
<script type="module">
new Vue({
  el: '#app',
  template: '#app-template',
  vuetify: new Vuetify(),
  data: () => ({
    validationRules: {},
    constantObj: {},
    serverSearchInput: {},
    searchInput: null,
    isTableLoading: true,
    tableData: [],
    headers: [],
  }),
  watch: {
  },
  async created() {
  },
  async mounted() {
  },
  methods: {
    async doUiAction(uiActionId, uiActionData) {
      switch (uiActionId) {
        case 'getTableData':
          break;
        case 'startCreateItem':
          break;
        case 'createItem':
          break;
        case 'startUpdateItem':
          break;
        case 'updateItem':
          break;
        case 'deleteItem':
          break;
        default:
          console.error("[doUiAction] uiActionId not find", {uiActionId});
          break;
      }
    },
    // ---------- 获取表格数据 uiAction >>>>>>>>>> --------
    // ---------- <<<<<<<<<<< 获取表格数据 uiAction ---------
    
    // ---------- 新增数据 uiAction >>>>>>>>>> --------
    // ---------- <<<<<<<<<<< 新增数据 uiAction ---------

    // ---------- 修改数据 uiAction >>>>>>>>>>>> --------
    // ---------- <<<<<<<<<<< 修改数据 uiAction ---------
    
    // ---------- 删除数据 uiAction >>>>>>>>>>>> --------
    // ---------- <<<<<<<<<<< 删除数据 uiAction ---------
  }
})
</script>
{% endblock %}