yuyu
2023-08-08 314d6fc39ede1b94cdab512adb9dc806471ef8a4
src/views/standardLibrary/index.vue
@@ -6,14 +6,17 @@
          v-model="filterText"
          placeholder="输入关键字进行过滤"
        />
        <el-button type="text" @click="getAllStandard">全部</el-button>
        <el-button type="text">全部</el-button>
        <el-tree
          ref="tree"
          class="filter-tree"
          :data="standardTree"
          :props="defaultProps"
          node-key="id"
          highlight-current
          default-expand-all
          :filter-node-method="filterNode"
          :render-content="renderContent"
          @node-click="nodeClick"
        />
      </div>
@@ -32,222 +35,68 @@
              <el-form-item>
                <el-button type="primary" @click="filteredTableData">查询</el-button>
                <el-button type="primary" plain @click="resetBtn">重置</el-button>
                <!-- <el-button type="text">高级搜索<i class="el-icon-arrow-down el-icon--right" /></el-button> -->
              </el-form-item>
            </el-form>
          </div>
          <div class="serve-btn">
            <el-button type="primary" icon="el-icon-plus" @click="showFormInfo">{{ selectedNodeType }}</el-button>
            <el-button type="primary" icon="el-icon-plus" @click="addTreeFormVisible = true">新增</el-button>
          </div>
        </div>
        <div class="table-box">
          <el-table
            ref="tableData"
            :cell-style="{textAlign: 'center'}"
            :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'center'}"
            row-key="id"
            max-height="680"
            :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
            :cell-style="{textAlign: 'left'}"
            :header-cell-style="{border:'0px',background:'#f5f7fa',color:'#606266',boxShadow: 'inset 0 1px 0 #ebeef5',textAlign: 'left'}"
            :data="tableData"
            style="width: 100%"
          >
            <el-table-column
              type="index"
              label="序号"
              min-width="50"
            />
            <!-- 复用 -->
              width="100px"
            >
              <template v-if="scope.row.index+1" slot-scope="scope">
                {{ scope.row.index+1 }}
              </template>
            </el-table-column>
            <el-table-column
              v-for="(item,index) in tablespecifications"
              :key="index"
              :prop="item.prop"
              :label="item.label"
              :min-width="item.minWidth"
              prop="father"
              label="名称"
              width="320px"
            >
              <template slot-scope="scope">
                <el-tag size="mini" :type="scope.row.father? '':'success'" :style="{borderRadius: '40%',marginRight: '12px'}">{{ scope.row.father? '01':'02' }}</el-tag> {{ scope.row.father || scope.row.name }}
              </template>
            </el-table-column>
            <el-table-column
              prop="unit"
              label="单位"
              width="300px"
            />
            <template v-if="showTableCurrent===2">
              <el-table-column
                prop="spe_state"
                label="状态"
                min-width="150"
              >
                <template slot-scope="scope">
                  <el-tag
                    :type="scope.row.spe_state === 0 ? 'primary' : 'success'"
                    disable-transitions
                  >{{ scope.row.spe_state === 0 ? '未同意' : '已同意' }}</el-tag>
                </template>
              </el-table-column>
              <el-table-column
                label="操作"
                min-width="150"
              >
                <template slot-scope="scope">
                  <el-button
                    type="text"
                    size="small"
                    :style="{marginRight:'8px'}"
                    @click="specificationDetails(scope.row)"
                  >查看</el-button>
                  <el-popover
                    v-model="scope.row.visible"
                    placement="top"
                    width="30"
                  >
                    <div @click=" getRowID(scope.row)" style="text-align: center; margin: 0">
                      <div>
                        <el-button size="mini" @click="dialogFormVisible4=true" type="text">编辑</el-button>
                      </div>
                      <div>
                        <el-button size="mini" @click="dialogFormVisible5 = true" type="text">停用</el-button>
                      </div>
                    </div>
                    <el-button slot="reference" type="text"><i class="el-icon-more" /></el-button>
                  </el-popover>
                </template>
              </el-table-column>
            </template>
            <el-table-column
              prop="required"
              label="标准"
              width="300px"
            />
            <el-table-column
              prop="internal"
              label="内控制"
              width="300px"
            />
          </el-table>
          <!-- 弹出表单页 -->
          <div>
            <!-- 添加标准 -->
            <el-dialog title="添加标准" :visible.sync="dialogFormVisible1">
              <el-form ref="standardForm" :model="standardForm" :rules="rulesStandard">
                <el-form-item label="标准号" :label-width="formLabelWidth" prop="standardnumber">
                  <el-input v-model="standardForm.standardnumber" autocomplete="off" />
                </el-form-item>
                <el-form-item label="标准名称" :label-width="formLabelWidth" prop="standardname">
                  <el-input v-model="standardForm.standardname" autocomplete="off" />
                </el-form-item>
                <el-form-item label="英文名称" :label-width="formLabelWidth" prop="standardenname">
                  <el-input v-model="standardForm.engname" autocomplete="off" />
                </el-form-item>
                <el-form-item label="父级分类" :label-width="formLabelWidth">
                  <el-select v-model="standardForm.type" placeholder="请选择">
                    <el-option label="原材料" value="0" />
                    <el-option label="电线电缆" value="1" />
                  </el-select>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible1 = false">取 消</el-button>
                <el-button type="primary" @click="submitForm">确 定</el-button>
              </div>
            </el-dialog>
            <!-- 添加型号 -->
            <el-dialog title="添加型号" :visible.sync="dialogFormVisible2">
              <el-form ref="form" :model="modelForm" :rules="rulesModel">
                <el-form-item label="型号" :label-width="formLabelWidth" prop="model">
                  <el-input v-model="modelForm.model" autocomplete="off" />
                </el-form-item>
                <el-form-item label="型号名称" :label-width="formLabelWidth" prop="modelname">
                  <el-input v-model="modelForm.modelname" autocomplete="off" />
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible2 = false">取 消</el-button>
                <el-button type="primary" @click="submitForm()">确 定</el-button>
              </div>
            </el-dialog>
            <!-- 添加规格 -->
            <el-dialog title="添加规格" :visible.sync="dialogFormVisible3">
              <el-form ref="form" :model="specificationForm" :rules="rulesspecification">
                <el-form-item label="规格名称" :label-width="formLabelWidth" prop="name">
                  <el-input v-model="specificationForm.name" autocomplete="off" />
                </el-form-item>
                <el-form-item label="规格编号" :label-width="formLabelWidth" prop="number">
                  <el-input v-model="specificationForm.number" autocomplete="off" />
                </el-form-item>
                <el-form-item label="上方填写生产指令号" :label-width="formLabelWidth" prop="instruct">
                  <el-input v-model="specificationForm.instruct" autocomplete="off" />
                </el-form-item>
                <el-form-item label="电压等级" :label-width="formLabelWidth">
                  <el-select v-model="specificationForm.voltageLevel" placeholder="请选择电压等级">
                    <el-option label="分类1" value="test" />
                    <el-option label="分类2" value="2" />
                    <el-option label="分类3" value="3" />
                  </el-select>
                </el-form-item>
                <el-form-item label="主线芯截面" :label-width="formLabelWidth">
                  <el-select v-model="specificationForm.crossSection" placeholder="请选择主线芯截面">
                    <el-option label="分类1" value="test" />
                    <el-option label="分类2" value="2" />
                    <el-option label="分类3" value="3" />
                  </el-select>
                </el-form-item>
                <el-form-item label="主线芯芯数" :label-width="formLabelWidth">
                  <el-select v-model="specificationForm.numberOfCores" placeholder="请选择主线芯芯数">
                    <el-option label="分类1" value="test" />
                    <el-option label="分类2" value="2" />
                    <el-option label="分类3" value="3" />
                  </el-select>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible3 = false">取 消</el-button>
                <el-button type="primary" @click="submitForm()">确 定</el-button>
              </div>
            </el-dialog>
            <!-- 编辑规格 -->
            <el-dialog title="编辑规格" :visible.sync="dialogFormVisible4">
              <el-form ref="form" :model="editSpeForm" :rules="rulesspecification">
                <el-form-item label="规格名称" :label-width="formLabelWidth" prop="name">
                  <el-input v-model="editSpeForm.name" autocomplete="off" />
                </el-form-item>
                <el-form-item label="规格编号" :label-width="formLabelWidth" prop="number">
                  <el-input v-model="editSpeForm.number" autocomplete="off" />
                </el-form-item>
                <el-form-item label="上方填写生产指令号" :label-width="formLabelWidth" prop="instruct">
                  <el-input v-model="editSpeForm.instruct" autocomplete="off" />
                </el-form-item>
                <el-form-item label="电压等级" :label-width="formLabelWidth">
                  <el-select v-model="editSpeForm.voltageLevel" placeholder="请选择电压等级">
                    <el-option label="分类1" value="test" />
                    <el-option label="分类2" value="2" />
                    <el-option label="分类3" value="3" />
                  </el-select>
                </el-form-item>
                <el-form-item label="主线芯截面" :label-width="formLabelWidth">
                  <el-select v-model="editSpeForm.crossSection" placeholder="请选择主线芯截面">
                    <el-option label="分类1" value="test" />
                    <el-option label="分类2" value="2" />
                    <el-option label="分类3" value="3" />
                  </el-select>
                </el-form-item>
                <el-form-item label="主线芯芯数" :label-width="formLabelWidth">
                  <el-select v-model="editSpeForm.numberOfCores" placeholder="请选择主线芯芯数">
                    <el-option label="分类1" value="test" />
                    <el-option label="分类2" value="2" />
                    <el-option label="分类3" value="3" />
                  </el-select>
                </el-form-item>
                <el-form-item label="规格状态" :label-width="formLabelWidth">
                  <el-select v-model="editSpeForm.spe_state" placeholder="请选择规格状态">
                    <el-option label="停用" value="0" />
                    <el-option label="正常" value="1" />
                    <el-option label="草稿" value="-1" />
                  </el-select>
                </el-form-item>
              </el-form>
              <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible4 = false">取 消</el-button>
                <el-button type="primary" @click="handleEdit">确 定</el-button>
              </div>
            </el-dialog>
            <!-- 停用 -->
            <el-dialog
              title="提示"
              :visible.sync="dialogFormVisible5"
              width="30%">
              <span>确认停用吗?</span>
              <span slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible5 = false">取 消</el-button>
                <el-button type="primary" @click="updateSpeState">确 定</el-button>
              </span>
            </el-dialog>
            <!--  -->
          </div>
          <div>
            <!-- 分页器 -->
            <el-pagination
              :current-page="pageParams.pageNo"
              :page-sizes="[1, 2, 3, 4]"
              :page-size="pageParams.pageNo"
              :page-sizes="[10, 15, 20, 25]"
              :page-size="pageParams.pageSize"
              layout="total, sizes, prev, pager, next, jumper"
              :total="pageParams.total"
              @size-change="handleSizeChange"
@@ -257,144 +106,73 @@
        </div>
      </div>
    </div>
    <el-dialog class="addTree" title="添加指标" width="28%" :visible.sync="addTreeFormVisible" @close="closeAddTreeForm">
      <el-form v-model="addTreeForm" label-position="top">
        <el-form-item label="上级">
          <el-cascader
            v-model="addTreeForm.addTypeArr"
            :options="formTypeOptions"
            :props="{ ...defaultProps,checkStrictly: true }"
            clearable
            @change="changeCascader"
          />
        </el-form-item>
        <el-form-item v-show="addTreeForm.addTypeArr.length<2" label="物料名称">
          <el-input v-model="addTreeForm.materialName" />
        </el-form-item>
        <el-form-item v-show="addTreeForm.addTypeArr.length<3" label="执行标准">
          <el-input v-model="addTreeForm.standardName" />
        </el-form-item>
        <el-form-item v-show="addTreeForm.addTypeArr.length<4" label="规格型号">
          <el-input v-model="addTreeForm.specificationsName" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="subAddTreeForm">确 定</el-button>
        <el-button @click="addTreeFormVisible = false">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
import { getStandardsList, getSerialNumberList, getSpecificationsList, getStandardsListOfPage, addStandards, addSerialNumber, addSpecifications, updateSpecifications, updateSpeState } from '@/api/standardLibrary'
import { getMaterialList, getProductList, getProductSonList,
  addMaterial, addStandards, addSpecifications
} from '@/api/standardLibrary'
export default {
  data() {
    return {
      dialogFormVisible1: false,
      dialogFormVisible2: false,
      dialogFormVisible3: false,
      dialogFormVisible4: false,
      dialogFormVisible5: false,
      visible: false,
      addTreeFormVisible: false,
      filterText: '',
      // 标准库bom树
      standardTree: [],
      // bom的,默认值
      // bom的,默认配置值
      defaultProps: {
        children: 'children',
        label: 'label'
        label: 'name',
        value: 'id'
      },
      // 查询条件
      searchData: {
        keyword: ''
      },
      tableData: [
        {
          id: 2,
          name: 'AB',
          updateTime: '2023-07-12 00:00:12',
          username: '小小',
          vel: 'V1.0',
          spe_state: 1,
          visible: false
        },
        {
          id: 3,
          name: 'AB',
          updateTime: '2023-07-12 00:00:12',
          username: '小小',
          vel: 'V1.0',
          spe_state: 1,
          visible: false
        },
        {
          id: 4,
          name: 'AB',
          updateTime: '2023-07-12 00:00:12',
          username: '小小',
          vel: 'V1.0',
          spe_state: 1,
          visible: false
        }
      ],
      oldtableData: [],
      // 分页参数
      pageParams: {
        pageNo: 1,
        pageSize: 1,
        total: 3
        pageSize: 12,
        total: 0
      },
      tablespecifications: [
      ],
      // 选中节点对应的表格 0 是标准表 1是型号表 2规格表
      showTableCurrent: 0,
      // 选中的节点数据
      selectNode: {},
      selectedNodeType: '添加标准',
      standardForm: [{
        standardnumber: '',
        standardname: '',
        engname: '',
        type: ''
      }],
      modelForm: [{
        model: '',
        modelname: ''
      }],
      specificationForm: [{
        name: '', // 产品规格名称
        number: '', // 规格编号
        crossSection: '',
        numberOfCores: '',
        instruct: '',
        voltageLevel: ''
      }],
      editSpeForm: [{
        crossSection: '',
        instruct: '',
        name: '', // 规格名称
        number: '', // 规格编号
        numberOfCores: '',
        serialId: '', // 型号ID
        spe_state: '',
        voltageLevel: ''
      }],
      formLabelWidth: '120',
      rulesStandard: {
        standardnumber: [
          {
            required: true, message: '请输入标准号', trigger: 'blur'
          }
        ],
        standardname: [{
          required: true, message: '请输入标准名称', trigger: 'blur'
        }],
        standardenname: [
          { required: false, message: '请输入英文名称', trigger: 'blur' }
        ]
      },
      rulesModel: {
        model: [
          { required: true, message: '请输入型号', trigger: 'blur'
          }],
        modelname: [{
          required: true, message: '请输入型号名称', trigger: 'blur'
        }],
        parentclassification: [
          { required: true, message: '请输入', trigger: 'blur' }
        ]
      },
      rulesspecification: {
        number: [
          { required: true, message: '请输入规格编号', trigger: 'blur'
          }],
        name: [{
          required: true, message: '请输入规格名称', trigger: 'blur'
        }],
        instruct: [
          { required: true, message: '请输入上方填写生产指令号', trigger: 'blur' }
        ]
      },
      standardId: '', // 获取当前标准ID
      modelId: '', // 获取当前型号ID
      rowId: '' // 获取当前规格所在行ID
      selectData: {},
      formTypeOptions: [],
      addTreeForm: {
        addTypeArr: []
      }
    }
  },
  watch: {
@@ -404,7 +182,6 @@
  },
  created() {
    this.getStandardTree()
    this.getAllStandard()
  },
  methods: {
    filterNode(value, data) {
@@ -413,174 +190,100 @@
    },
    // 获取bom树的标准数据
    async getStandardTree() {
      this.selectedNodeType = '添加标准'
      const { data: standard } = await getStandardsList()// 获取所有标准
      // console.log(standard)// 获取所有标准
      this.standardTree = standard.map(item => {
        item.serialNumber = item.serialNumber?.map(childrenItem => ({ ...childrenItem, label: childrenItem.name }))
        return { ...item, label: item.name, children: item.serialNumber }
      const { data } = await getMaterialList()
      console.log(data)
      this.standardTree = data.map(item => {
        let name = null
        switch (item.type) {
          case 1:
            name = '原材料'
            break
          case 2:
            name = '半成品'
            break
          case 3:
            name = '成品'
            break
        }
        return {
          ...item, id: item.type, name
        }
      })
      // console.log(this.standardTree)
      console.log(this.standardTree)
      // formTypeOptions
      // 默认第一个四级节点搜索,新增配置项
      const treeOptions = JSON.parse(JSON.stringify(this.standardTree))
      this.getDefault(treeOptions, 0)
      console.log(treeOptions)
      this.formTypeOptions = treeOptions
      this.$nextTick().then(() => {
        const firstNode = document.querySelector('.el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node .el-tree-node__children .el-tree-node')
        firstNode.click()
        // console.log(firstNode)
      })
    },
    getDefault(arr, index) {
      for (const item of arr) {
        if (item.children && item.children?.length > 0) {
        // 有子节点
          this.getDefault(item.children, index + 1)
          if (index === 2) {
            item.children = null
          }
        }
        // else {
        //   // if ('children' in item) {
        //   //   //
        //   // } else {
        //   //   // console.log(index, item)
        //   // }
        // }
      }
    },
    // 点击bom树节点方法
    async nodeClick(data, node, element) {
      // console.log('data', data)
      // console.log('children' in data)
      // 是子节点
      if (node.level === 4) {
        // console.log(data, node)
        // 存下选中节点
        this.selectData = data
        // eslint-disable-next-line prefer-const
        this.getTableByClick(data)
      }
      if (!('children' in data)) {
        // console.log('点击子节点', data)
        this.selectedNodeType = '添加规格'
        this.modelId = data.id
        this.selectNode = data
        // 获取点击子节点的表格
        await this.getSpecifications(data)
        return
      }
      // 不是子节点
      this.selectedNodeType = '添加型号'
      this.standardId = data.id
      this.selectNode = data
      await this.getSerialNumber(data)
    },
    async getTableByClick(data) {
      // eslint-disable-next-line prefer-const
      let { data: { row, total }} = await getProductList({ pageNo: this.pageParams.pageNo, pageSize: this.pageParams.pageSize, specificationsId: data.id })
      // console.log(row)
      this.pageParams.total = total
      row = row.map((item, index) => ({ ...item, index }))
      for (const item of row) {
        if (item.children) {
          const res = await getProductSonList({ fatherName: item.father })
          item.children = res.data
          item.id = item.father
        }
      }
      this.tableData = row
    },
    specificationDetails(row) {
      // 跳转产品规格详情页
      this.$router.push(`/standardLibrary/SpecificationDetails/${row.id}`)
    },
    getRowID(row) {
      // console.log(row.id)
      this.id = row.id
    },
    // 获取所有标准table
    async getAllStandard() {
      this.selectedNodeType = '添加标准'
      // console.log(this.pageParams)
      const { data: { row, total }} = await getStandardsListOfPage({ ...this.pageParams })
      // console.log('得到所有标准==>', row)
      this.pageParams.total = total
      this.tableData = row
      this.tablespecifications = [
        {
          prop: 'name',
          label: '标准名称',
          minWidth: '150px'
        },
        {
          prop: 'eng_name',
          label: '标准英文名称',
          minWidth: '150px'
        },
        {
          prop: 'createTime',
          label: '创建时间',
          minWidth: '150px'
        }
      ]
      this.showTableCurrent = 0
    },
    // 获取对应型号下的所有规格
    async getSerialNumber(data) {
      const { data: { row, total }} = await getSerialNumberList({ standardsId: data.id, ...this.pageParams })
      console.log('点击父节点', row)// 根据标准获取对应标准下的规格
      this.tableData = row
      this.pageParams.total = total
      this.tablespecifications = [
        {
          prop: 'name',
          label: '型号名称',
          minWidth: '150px'
        }
      ]
      this.showTableCurrent = 1
    },
    // 获取标准下对应的所有型号
    async getSpecifications(data) {
      const { data: { row, total }} = await getSpecificationsList({ serialNumberId: data.id, ...this.pageParams })
      // console.log(row)
      this.tableData = row
      this.pageParams.total = total
      this.tablespecifications = [
        {
          prop: 'name',
          label: '产品名称',
          minWidth: '150px'
        },
        {
          prop: 'username',
          label: '更新人',
          minWidth: '100px'
        },
        {
          prop: 'updateTime',
          label: '更新时间',
          minWidth: '150px'
        },
        {
          prop: 'vel',
          label: '版本',
          minWidth: '150px'
        }
      ]
      this.showTableCurrent = 2
    },
    // 展示弹出框
    showFormInfo() {
      if (this.selectedNodeType === '添加标准') {
        this.dialogFormVisible1 = true
      } else if (this.selectedNodeType === '添加型号') {
        this.dialogFormVisible2 = true
      } else {
        this.dialogFormVisible3 = true
      }
    },
    async submitForm() {
      if (this.showTableCurrent === 0) {
        await addStandards({ engName: this.standardForm.engname,
          id: this.standardForm.standardnumber,
          name: this.standardForm.standardname,
          type: parseInt(this.standardForm.type) })
        this.dialogFormVisible1 = false
      } else if (this.showTableCurrent === 1) {
        await addSerialNumber({ id: this.modelForm.model,
          name: this.modelForm.modelname,
          standardsId: this.standardId // 关联标准ID
        })
        this.dialogFormVisible2 = false
      } else {
        await addSpecifications({ crossSection: this.specificationForm.crossSection,
          instruct: this.specificationForm.instruct,
          name: this.specificationForm.name,
          number: this.specificationForm.number,
          numberOfCores: this.specificationForm.numberOfCores,
          serialId: this.modelId, // 关联型号ID
          voltageLevel: this.specificationForm.voltageLevel
        })
        this.dialogFormVisible3 = false
      }
    },
    // 分页条件改变时判断需要分页查询的方法
    judgment() {
      switch (this.showTableCurrent) {
        case 0:
          this.getAllStandard()
          break
        case 1:
          this.getSerialNumber(this.selectNode)
          break
        case 2:
          this.getSpecifications(this.selectNode)
          break
      }
    },
    handleSizeChange(val) {
      console.log(`每页 ${val} 条`)
      this.pageParams.pageSize = val
      this.judgment()
      this.getTableByClick(this.selectData)
    },
    handleCurrentChange(val) {
      console.log(`当前页: ${val}`)
      this.pageParams.pageNo = val
      this.judgment()
      this.getTableByClick(this.selectData)
    },
    // 查询按钮
    filteredTableData() {
@@ -597,50 +300,133 @@
      this.searchData.keyword = ''
      this.tableData = this.oldtableData
    },
    // 处理编辑规格
    async handleEdit() {
      // console.log(this.id)
      await updateSpecifications({ crossSection: this.editSpeForm.crossSection,
        id: this.rowId,
        instruct: this.editSpeForm.instruct,
        name: this.editSpeForm.name,
        number: this.editSpeForm.number,
        numberOfCores: this.editSpeForm.numberOfCores,
        serialId: this.modelId, // 关联型号ID
        spe_state: this.editSpeForm.spe_state,
        voltageLevel: this.editSpeForm.spe_state })
      this.dialogFormVisible4 = false
    renderContent(h, { node, data, store }) {
      // console.log('data', data)
      // console.log('node', node)
      // 判断是否是父节点或文件夹
      const isFolder = ('children') in data
      return (
        <span class='tree-node'>
          {isFolder ? (
            <i
              class={node.expanded ? 'el-icon-folder-opened blue-folder' : 'el-icon-folder blue-folder'}
            ></i>
          ) : (
            <i class='el-icon-document blue-folder'></i>
          )}
          <div class='tree-lable'>[{node.level}]  {data.name}</div>
        </span>
      )
    },
    // 停用
    async updateSpeState() {
      await updateSpeState({ id: this.rowId,
        spe_state: '0' })
      this.dialogFormVisible5 = false
    async subAddTreeForm() {
      this.addTreeFormVisible = false
      console.log(this.addTreeForm.addTypeArr.length)
      let res = null
      try {
        switch (this.addTreeForm.addTypeArr.length) {
          case 1:
            console.log(this.addTreeForm)
            res = await addMaterial({ ...this.addTreeForm, type: this.addTreeForm.addTypeArr.pop() })
            break
          case 2:
            console.log(this.addTreeForm)
            res = await addStandards({ ...this.addTreeForm, materialId: this.addTreeForm.addTypeArr.pop() })
            break
          case 3:
            console.log(this.addTreeForm)
            res = await addSpecifications({ ...this.addTreeForm, standardId: this.addTreeForm.addTypeArr.pop() })
            break
        }
      } catch (error) {
        this.$message.error('添加失败')
      }
      console.log(res)
      this.$message.success('添加成功')
      this.addTreeForm = {}
      this.getStandardTree()
      this.getTableByClick(this.selectData)
    },
    changeCascader(data) {
      console.log(data)
      this.addTreeForm.addTypeArr = data
    },
    closeAddTreeForm() {
      this.addTreeForm = {
        addTypeArr: []
      }
      console.log(this.addTreeForm)
    }
    /** 表格某行点击事件 */
    // handleRowClick(row, column, event) {
    //   // 判断当前行是否有子集,若没有则结束处理
    //   // console.log(row)
    //   if (!row.children) return
    //   this.$refs.tableData.toggleRowExpansion(row)
    // }
  }
}
</script>
<style lang="scss" scoped>
// el-table表格对齐
::v-deep .el-table__row:not([class*="el-table__row--level-"]) {
  td:nth-child(2){
    padding-left: 23px !important;
  }
}
// .dialogform {
//   transform: translate(-50%, -50%);
//   top: 50% !important;
//   left: 50% !important;
//   width: 1000px;
//   height: 800px;
// }
.standard-library-main{
  width: 100%;
  width: 100vh;
  height: 100%;
// 页面中心内容区域
  .content-main{
    display: flex;
    height: 100%;
    min-height: calc(100vh - 88px);
    max-height: calc(100vh - 88px);
    padding: 15px;
    >div{
      padding: 20px;
      background: #fff;
    }
    .library-bom{
      flex: 2;
      padding-right: 10px;
      width: 40vh;
      // height: 100%;
      max-height: 100%;
      margin-right: 12px;
      // overflow-y: scroll;
      .el-tree {
        // margin-top: 12px;
        ::v-deep .el-tree-node__content{
          height: 24px !important;
          font-size: 18px;
          // display: inline-block !important;
          padding: 2px;
          // color: #333;
          .tree-node{
            display: flex;
            align-items: center;
            height: 20px;
          }
          .tree-lable{
            height: 100%;
            line-height: 23px;
            font-size: 12px;
            padding-left: 8px;
          }
          .blue-folder{
            color: rgb(64, 158, 255)
          }
        }
      }
      // .el-tree {
      //   margin-top: 12px;
@@ -666,11 +452,14 @@
      // }
    }
    .library-table{
      flex: 8;
      // height: 100%;
      width: 170vh;
      max-height: 100%;
      // flex: 8;
      margin-left: 12px;
      display: flex;
      flex-direction: column;
      // overflow-y: scroll;
      .table-header{
        display: flex;
        justify-content: space-between;
@@ -684,10 +473,15 @@
          // padding: 20px 20px 10px 20px;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          .el-table {
            flex: 1;
            // flex: 1;
            // max-height: 680px;
            // overflow-y: scroll;
          }
          >div:nth-child(2){
          >div:nth-child(3){
            // height: 20px;
            display: flex;
            justify-content: end;
            margin: 10px 0;
@@ -695,5 +489,13 @@
      }
    }
  }
  .addTree{
    .el-form-item{
      margin-bottom: 10px;
    }
    .el-cascader{
      width: 100%;
    }
  }
}
</style>