<template>
  <div>
    <div class="sty">
      <el-page-header @back="goBack" content="详情页面"> </el-page-header>
    </div>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>信息</span>
      </div>
      <el-row>
        <el-col :span="8"><span>创建组织</span><input type="text" /></el-col>
        <el-col :span="8"><span>使用组织</span><input type="text" /></el-col>
        <el-col :span="8"><span>编码</span><input type="text" /></el-col>
      </el-row>
      <el-row>
        <el-col :span="8"><span>名称</span><input type="text" /></el-col>
        <el-col :span="8"></el-col>
        <el-col :span="8"></el-col>
      </el-row>
    </el-card>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>基本</span>
      </div>
      <div class="baseInfo">
        <div>
          <div class="base-header">
            <span>基本信息</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">规格型号</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r color">助记码</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r color">旧物料编码</span><input type="text" />
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">条码</span><input type="text" />
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r color">描述</span
              ><textarea
                class="textareaStyle"
                name=""
                id=""
                cols="30"
                rows="10"
              ></textarea>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">物料分组</span><input type="text" />
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">物料属性</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">配置生产</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">特征件子项</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">套件</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">基本单位</span
              ><select name="" id="" class="selectStyle2">
                <option value="">正常</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">禁用原因</span><input type="text"
            /></el-col>
          </el-row>
        </div>
        <div>
          <div class="base-header">
            <span>控制</span>
          </div>
          <el-row>
            <el-row></el-row>
            <el-row>
              <el-col :span="8"
                ><span class="marg-r">允许采购</span><input type="checkbox"
              /></el-col>
              <el-col :span="8"
                ><span class="marg-r">允许销售</span><input type="checkbox"
              /></el-col>
            </el-row>
            <el-row>
              <el-col :span="8"
                ><span class="marg-r">允许库存</span><input type="checkbox"
              /></el-col>
              <el-col :span="8"
                ><span class="marg-r">允许生产</span><input type="checkbox"
              /></el-col>
            </el-row>
            <el-row>
              <el-col :span="8"
                ><span class="marg-r">允许委外</span><input type="checkbox"
              /></el-col>
              <el-col :span="8"
                ><span class="marg-r">允许资产</span><input type="checkbox"
              /></el-col>
            </el-row>
          </el-row>

          <div class="base-header">
            <span>财务信息</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">默认税率</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">存货类别</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">税分类</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">结算成本价加减价比例(%)</span
              ><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">商城公开价</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">套机码</span><input type="text"
            /></el-col>
          </el-row>
        </div>
        <div>
          <div class="base-header">
            <span>重量信息</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">毛重</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">净重</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">重量单位</span><input type="text"
            /></el-col>
          </el-row>

          <div class="base-header">
            <span>尺寸信息</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">长</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">宽</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">高</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">体积</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">尺寸单位</span><input type="text"
            /></el-col>
          </el-row>

          <div class="base-header">
            <span>状态</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">数据状态</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">禁用状态</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">已使用</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
        </div>
      </div>
    </el-card>
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>库存</span>
      </div>
      <div class="baseInfo">
        <div>
          <div class="base-header">
            <span>存储</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">库存单位</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r color">换算方向</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r color">仓库</span><input type="text" />
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">仓位</span><input type="text" />
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r color">单箱标准数量</span><input type="text"
            /></el-col>
          </el-row>
          <div class="base-header">
            <span>库存控制</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r color">可锁库</span><input type="checkbox"
            /></el-col>
          </el-row>
        </div>
        <div>
          <div class="base-header">
            <span>管理</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">启用批号管理</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">批号编码规则</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">启用保质期管理</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">批号附属信息</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">保质期单位</span
              ><select name="" id="" class="selectStyle2">
                <option value="">普通仓库</option>
              </select></el-col
            >
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">在架寿命期</span><input type="text"
            /></el-col>
          </el-row>
          <div class="base-header">
            <span>库存成本</span>
          </div>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">参考成本</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">成本单位</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">币别</span><input type="text"
            /></el-col>
          </el-row>
        </div>
        <div>
          <div class="base-header">
            <span>库存计划</span>
          </div>
          <el-row>
            <el-col :span="24">
              <span class="marg-r startUse">启用</span>
              <div class="start">
                <div><input type="checkbox" /><span>最小库存预警</span></div>
                <div><input type="checkbox" /><span>安全库存预警</span></div>
                <div><input type="checkbox" /><span>最大库存预警</span></div>
                <div><input type="checkbox" /><span>在订货点预警</span></div>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">最小库存</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">再定货点</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">经济订货批量</span><input type="text"
            /></el-col>
          </el-row>
          <el-row>
            <el-col :span="24"
              ><span class="marg-r">最大库存</span><input type="text"
            /></el-col>
          </el-row>
        </div>
      </div>
      <div>
        <div class="base-header">
          <span>客机信息</span>
        </div>
        <!-- 列表 -->
        <br />
        <el-table
          v-loading="listLoading"
          :data="dataList"
          element-loading-text="Loading"
          :header-cell-style="{
            'background-color': '#e8e8e8',
            color: 'black',
          }"
          border=""
        >
          <el-table-column
            align="center"
            label="序号"
            prop="nname"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            align="center"
            label="内机编码"
            prop="bianma"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            align="center"
            label="内机名称"
            prop="selectname"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            align="center"
            label="型号"
            prop="person"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            align="center"
            label="内机体积"
            prop="createdata"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            align="center"
            label="外机编码"
            prop="updateperson"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            align="center"
            label="外机名称"
            prop="update"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            align="center"
            label="型号"
            prop="update"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
          <el-table-column
            align="center"
            label="外机体积"
            prop="update"
            min-width="160"
            show-overflow-tooltip
          ></el-table-column>
        </el-table>
        <br />
        <el-row>
          <el-col :span="6">
            <strong class="marg-r">商城分类</strong>
            <select name="" id="" class="selectStyle2">
              <option value="">挂式空调</option>
            </select>
          </el-col>
        </el-row>
        <div>
          <div class="img">
            <strong>产品图片</strong>
          </div>
          <br />
          <el-upload list-type="picture-card">
            <i class="el-icon-plus"></i>
          </el-upload>
          <br />
          <span>(上传图片大小规格: , 最多上传5张)</span>
          <div class="img"></div>
        </div>
        <br />
        <div>
          <div class="img">
            <strong>详情图</strong>
          </div>
          <br />
          <el-upload list-type="picture-card">
            <i class="el-icon-plus"></i>
          </el-upload>
          <br />
          <span>(上传图片宽度不超过: ,)</span>
          <div class="img"></div>
        </div>
        <br />
        <el-row>
          <el-col :span="6">
            <strong class="marg-r">是否允许订货</strong>
            <select name="" id="" class="selectStyle2">
              <option value="">是</option>
              <option value="">否</option>
            </select>
          </el-col>
        </el-row>
        <br />
        <br />
        <el-button type="info">保存</el-button>
      </div>
    </el-card>
  </div>
</template>

<script>
export default {
  methods: {
    goBack() {
      console.log(this.$parent);
      this.$parent.isShow = true;
    },
  },
};
</script>

<style lang="scss" scoped>
::v-deep .el-upload {
  width: 100px;
  height: 100px;
  line-height: 100px;
  border: 1px solid grey;
}
.img {
  width: 30%;
  height: 25px;
  //   background-color: aqua;
  border-bottom: 1px solid gray;
}
.startUse {
  vertical-align: top;
}
.start {
  display: inline-block;
  width: 35%;

  div {
    float: left;
    width: 50%;
    span {
      font-size: 12px;
      vertical-align: text-bottom;
      padding: 0px 3px;
    }
  }
}
.baseWidth {
  width: 46%;
}
.inputDate {
  width: 46%;
}
.selectStyle2 {
  width: 35%;
}
.selectStyle {
  width: 35%;
}
.textareaStyle {
  vertical-align: text-top;
  resize: none;
  width: 35%;
  height: 100px;
}
.color {
  color: #1f93ec;
}
.el-col-24 {
  margin: 6px 0;
}

.marg-r {
  padding-right: 15px;
  font-size: 12px;
  display: inline-block;
  width: 120px;
}
.base-header {
  height: 20px;
  width: 60%;
  border-bottom: 2px solid gray;
  span {
    width: 100px;
    height: 100%;
    display: block;
    text-align: center;
    color: #fff;

    background-color: gray;
  }
}
.box-card {
  margin-bottom: 20px;
}
.el-col-8 {
  span {
    padding-right: 10px;
    display: inline-block;
    width: 100px;
  }
}
.baseInfo {
  display: flex;
  justify-content: space-between;
  > div {
    width: 33%;
  }
}
.sty {
  margin-bottom: 20px;
}
.el-row {
  margin-bottom: 20px;
  &:last-child {
    margin-bottom: 0;
  }
}
</style>