<template>
	<div class="footer">
		<div  class="footer--bg"></div>
		<div class="footer--inner">
			<div class="am-g" style="">
        <el-row align="bottom" style="width: 100%;height:250px;">

          <el-col :span="4" style="margin: 50px 0 0 50px;height: 100%">
            <el-row style="margin-top: 50px">
              <img src="../../../assets/images/logo_white.png" style="width: 150px" alt="">
            </el-row>
            <el-row><span style="color: white">创造智能打印新时代</span></el-row>

            <el-row style=" position: absolute;bottom: 0px;"><span style="color: white">蜀ICP备2023018969号</span></el-row>

          </el-col>

          <el-col :span="1" style="height: 200px;width: 10px">
            <el-divider style="height: 100%;width: 100%;background-color: blue" direction="vertical"></el-divider>
          </el-col>

          <el-col :span="7" style="margin: 50px 50px 0 50px">
            <el-row>
              <el-col :span="4">
                <i class="el-icon-location" style="color: white;font-size: 20px"></i>
              </el-col>
              <el-col :span="20">
                <el-row><span style="color: white">成都 CHENDU</span></el-row>
                <el-row><span style="color: white">{{ companyInfo.address }}</span></el-row>
              </el-col>
            </el-row>

            <el-row>
              <el-col :span="4" style="margin-top: 5px">
                <i class="el-icon-phone-outline" style="color: white;font-size: 20px"></i>
              </el-col>
              <el-col :span="20">
                <el-row><span style="color: white">服务热线</span></el-row>
                <el-row><span style="color: white">热线: 18200542686</span></el-row>
                <el-row><span style="color: white">热线: 18180928870</span></el-row>
              </el-col>
            </el-row>

            <el-row style="margin-top: 5px">
              <el-col :span="4">
                <i class="el-icon-message" style="color: white;font-size: 20px"></i>
              </el-col>
              <el-col :span="20">
                <el-row><span style="color: white">联系邮箱</span></el-row>
                <el-row><span style="color: white">yuanzeyu@mjkjlot.top</span></el-row>
              </el-col>
            </el-row>

          </el-col>

          <el-col :span="1" style="height: 200px;width: 10px">
            <el-divider style="height: 100%;width: 100%;background-color: blue" direction="vertical"></el-divider>
          </el-col>

          <el-col :span="7" style="margin: 100px 0 0 50px">
            <el-row :span="24" :gutter="50" >
              <el-col :span="10" >
                <el-row><img src="../../../assets/images/wechat.png" style="width: 100px" alt=""> </el-row>
                <el-row style="margin-top: 20px"><span style="color: white ;margin-top: 20px">公众号</span></el-row>


              </el-col>
              <el-col :span="10" >
                <el-row><img src="../../../assets/images/xiaochengxu.png" style="width: 100px" alt=""></el-row>
                <el-row align="center" style="margin-top: 20px"><span style="color: white;margin: 0 auto">体验小程序</span></el-row>
              </el-col>

            </el-row>
          </el-col>
        </el-row>
			</div>
		</div>
	</div>
</template>

<script>
export default {
	name: "Footer",
  data(){
    return{
      companyInfo: {},
      tabList:[],

    }
  },
  methods: {
    getTabList(){
      //获取所有种类
      let params={}
      params.page=1
      params.size=-1
      this.$post("/type/interlist", params)
          .then((res) => {
            if (res.code == 1) {
               console.log("type",res)
              this.tabList = res.data.data;
            }
          })
          .catch((error) => {
            this.$message.error(error.message);
          });
    },
    getCompanyInfo() {
      //获取公司信息，默认第一个
      this.$post("/company/interlist", {})
          .then((res) => {
            if (res.code == 1) {
              console.log(res)
              if (res.data.data.length > 0) {
                this.companyInfo = res.data.data[0]
              }
            }
          })
          .catch((error) => {
            this.$message.error(error.message);
          });

    },

  },
  created() {

  },
  mounted() {
    this.getTabList()
    this.getCompanyInfo();
  }

}
</script>

<style scoped>

.el-divider--vertical {
  height: 160px;
  width: 1px;
  margin-top: 75px;
 ;
}

</style>