<style>
.WebSiteIndex {
  height: calc(100% - 15px);
}
.WebSiteIndex .WebSiteTopdiv {
  /* text-align: right; */
  margin: 10px auto;
  max-width: 1080px;
  min-width: 800px;

  height: calc(100% - 20px);
}
.WebSiteIndex .WebSiteTopdiv .title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: calc(100% - 270px);
  padding: 10px 5px;
  margin: 15px 0 0 0;
  border: 1px solid #d1d1d1;
  border-bottom: 1px solid #eee;
  background: #fff;
}
</style>
<template>
  <!--首頁(首页)-->
  <div class="WebSiteIndex">
    <div class="WebSiteTopdiv">
      <div class="title">
        <!-- <div>自訂頁面 版面設定</div> -->
        <div style="font-size:12px;">
          页面名称：&nbsp;&nbsp;
          <el-input type="text" v-model="postMsg.PageName" class="w250"></el-input>
        </div>
        <div>
          <el-button type="primary" size="small" @click="gotoList()">返回列表</el-button>
          <el-button type="primary" size="small" @click="saveData()">保存</el-button>
        </div>
      </div>
      <WebSiteEdit ref="WebSiteEdit" :templateData="postMsg.PageDataList" v-on:getNewTemplateData="getNewTemplateData">
      </WebSiteEdit>
    </div>
  </div>
</template>
<script>
import WebSiteEdit from "../WebSet/WebSiteEdit.vue";
export default {
  data() {
    return {
      postMsg: {
        PageName: "",
        Id: 0,
        PageDataList: []
      }
    };
  },
  mounted() {
    if (this.$route.query.Id && this.$route.query.Id > 0) {
      this.postMsg.Id = this.$route.query.Id;
      this.getPage();
    }
  },
  components: {
    WebSiteEdit
  },
  methods: {
    //修改
    getPage() {
      this.apipost(
        "ws_post_GetPage",
        {
          Id: this.postMsg.Id
        },
        res => {
          if (res.data.resultCode == 1) {
            var tempData = res.data.data;
            this.postMsg.PageDataList = tempData.PageDataList;
            this.postMsg.Id = tempData.Id;
            this.postMsg.PageName = tempData.PageName;
            this.$refs.WebSiteEdit.initData(this.postMsg.PageDataList);
          } else {
            this.Error(res.data.message);
          }
        },
        err => {}
      );
    },
    //新增、修改广告
    saveData() {
      this.apipost(
        "ws_post_SetPage",
        this.postMsg,
        res => {
          if (res.data.resultCode == 1) {
            this.postMsg.Id = res.data.data.Id;
            this.$router.push({
              path: "/WebSiteUpdate",
              query: {
                Id: res.data.data.Id,
                tab: "编辑自定页面"
              }
            });
            this.Success(res.data.message);
          } else {
            this.Error(res.data.message);
          }
        },
        err => {}
      );
    },
    //获取模板数据
    getNewTemplateData(templateDataList) {
      this.postMsg.PageDataList = templateDataList;
    },
    gotoList() {
      this.$router.push({
        path: "/WebSiteCustomer",
        query: {
          tab: "自定页面"
        }
      });
    }
  }
};
</script>