bocai_supplyChain_pc/src/components/userinfo/accountsetting/inedex.vue

<template>
  <div class="accountsetting-container">
    <div class="accountcontent w">
      <div class="leftlist">
        <div class="userbaseinfo">
          <ul>
            <li>
              <span><i class="iconfont icon-laoxiang"></i> 我的老乡</span
              ><i class="iconfont icon-youjiantou"></i>
            </li>
            <li>
              <span><i class="iconfont icon-gongdan"></i> 我的工单</span
              ><i class="iconfont icon-youjiantou"></i>
            </li>
          </ul>
        </div>
      </div>
      <div class="rightcontent"></div>
    </div>
  </div>
</template>

<script>
export default {
  // 组件名称
  name: "",
  // 局部注册的组件
  components: {},
  // 组件参数 接收来自父组件的数据
  props: {},
  // 组件状态值
  data() {
    return {};
  },
  // 计算属性
  computed: {},
  // 侦听器
  watch: {},
  // 生命周期钩子   注：没用到的钩子请自行删除
  /**
   * 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
   */
  created() {},
  /**
   * el 被新创建的 vm.el 替换，并挂载到实例上去之后调用该钩子。
   * 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.el 也在文档内。
   */
  mounted() {},
  // 组件方法
  methods: {},
};
</script>

<style scoped lang="less">
.accountcontent {
  height: 1000px;
  margin-top: 16px;
  background-color: pink;
  display: flex;
  .leftlist {
    width: 346px;
    height: 500px;
    background-color: skyblue;
    margin-right: 16px;
    .userbaseinfo {
      ul {
        padding: 0 16px;
        li {
          display: flex;
          padding: 16px 0 16px 50px;
          justify-content: space-between;
        }
      }
    }
  }
  .rightcontent {
    width: 838px;
    height: 600px;
    background-color: gray;
  }
}
</style>