<template>
  <div class="picture-management">
    <div class="set">
      <div class="title">
        <div class="name">同步商品图片</div>
        <div class="tips">(同步后显示最新的商品图片)</div>
      </div>
      <img class="img" src="../../static/image/update.png" alt="">
    </div>
    <div class="set">
      <div class="title">
        <div class="name">订单详情显示出商品图片</div>
        <div class="tips">(在订单详情的商品显示图片，方便制作时确认)</div>
      </div>
      <el-switch v-model="value" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999">
      </el-switch>
    </div>
  </div>
</template>

<script>
export default {
  name: "pictureManagement",
  data() {
    return {
      value:1
    };
  },
  // 监听属性 类似于data概念
  computed: {},
  // 监控data中的数据变化
  watch: {},

  // 生命周期 - 创建完成（可以访问当前this实例）
  created() {},
  // 生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
  // 方法集合
  methods: {},
};
</script>

<style lang="scss" scoped  type="text/css">
.picture-management {
  .set {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    background: #fff;
    margin-bottom: 20px;
    border-radius: 5px;
    .title {
      display: flex;
      align-items: center;
      .name {
        font-size: 14px;
      }
      .tips {
        font-size: 12px;
        color: #999;
      }
    }
    .img {
      width: 20px;
      height: 20px;
    }
  }
}
</style>