| | |
| | | <div class="standard-library-main"> |
| | | <div class="content-main"> |
| | | <div class="library-bom" style="width: 300px"> |
| | | <el-input v-model="filterText" placeholder="输入关键字进行过滤"></el-input> |
| | | <el-input clearable v-model="filterText" placeholder="输入关键字进行过滤"></el-input> |
| | | <el-button type="text">全部</el-button> |
| | | <el-tree ref="tree" style="width: 100%" class="filter-tree" :data="standardTree" :props="defaultProps" |
| | | node-key="id" highlight-current default-expand-all :filter-node-method="filterNode" |
| | | node-key="id" :highlight-current="true" :default-expand-all="true" :filter-node-method="filterNode" |
| | | :render-content="renderContent" @node-click="nodeClick" /> |
| | | </div> |
| | | <div class="library-table" style="width: 80%"> |
| | |
| | | <el-dialog class="addTree" title="添加标准指标" width="28%" :visible.sync="addTreeFormVisible"> |
| | | <el-form v-model="addTreeForm" label-position="top"> |
| | | <el-form-item label="标准类型"> |
| | | <el-cascader v-model="addTreeForm.addTypeArr" :options="formTypeOptions" |
| | | <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-input @change="changeSample" v-model="addTreeForm.materialName" /> |
| | | </el-form-item> |
| | | <el-form-item v-show="addTreeForm.addTypeArr.length < 3" label="执行标准"> |
| | | <el-input v-model="addTreeForm.standardName" /> |
| | | <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-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> |
| | | <el-button @click="clear">取 消</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </div> |
| | |
| | | export default { |
| | | data() { |
| | | return { |
| | | filterNodeData: [], |
| | | options: [], |
| | | versionValue: "", |
| | | deleteList: [], |
| | |
| | | formTypeOptions: [], |
| | | addTreeForm: { |
| | | addTypeArr: [], |
| | | specificationsName: "" |
| | | } |
| | | }; |
| | | }, |
| | | watch: { |
| | | filterText(val) { |
| | | this.$refs.tree.filter(val); |
| | | }, |
| | | addTreeFormVisible(newVal){ |
| | | if(newVal === false){ |
| | | this.clear(); |
| | | } |
| | | } |
| | | }, |
| | | created() { |
| | |
| | | }, |
| | | mounted() {}, |
| | | methods: { |
| | | clear(){ |
| | | this.addTreeFormVisible = false; |
| | | this.addTreeForm.addTypeArr=[]; |
| | | this.addTreeForm.specificationsName=''; |
| | | this.addTreeForm.materialName='' |
| | | this.addTreeForm.standardName='' |
| | | }, |
| | | changeSample(){ |
| | | // console.log(this.standardTree); |
| | | // console.log(this.addTreeForm); |
| | | // console.log(this.addTreeForm.addTypeArr.length); |
| | | let selectType=this.standardTree.filter(item=>{ |
| | | return item.id===this.addTreeForm.addTypeArr[0] |
| | | })[0]; |
| | | if(this.addTreeForm.addTypeArr.length==1){ |
| | | let samples=selectType.children.filter(item=>{ |
| | | return item.name===this.addTreeForm.materialName |
| | | })[0] |
| | | if(samples===undefined||samples===[]){ |
| | | this.$message({ |
| | | message: '请先在基础数据中添加该【'+this.addTreeForm.materialName+'】样品', |
| | | type: 'warning' |
| | | }); |
| | | return false; |
| | | } |
| | | } |
| | | return true |
| | | }, |
| | | oneSize(){}, |
| | | twoSize(){ |
| | | return true; |
| | | }, |
| | | threeSize(){ |
| | | return true; |
| | | }, |
| | | async initSelect() { |
| | | this.options = []; |
| | | this.versionValue = ""; |
| | |
| | | }) |
| | | .catch(() => {}); |
| | | }, |
| | | filterNode(value, data) { |
| | | filterNode(value, data,node) { |
| | | if (!value) return true; |
| | | return data.name.indexOf(value) !== -1; |
| | | }, |
| | |
| | | //TODO handle the exception |
| | | } |
| | | }); |
| | | |
| | | }, |
| | | getDefault(arr, index) { |
| | | for (const item of arr) { |
| | |
| | | }) { |
| | | // 判断是否是父节点或文件夹 |
| | | 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 > |
| | | 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 subAddTreeForm() { |
| | | if(this.addTreeForm.addTypeArr.length==0){ |
| | | this.$message({ |
| | | message: '请先选择标准类型!', |
| | | type: 'warning' |
| | | }); |
| | | return |
| | | } |
| | | let handelerSample=this.changeSample() |
| | | if(!handelerSample){ |
| | | return; |
| | | } |
| | | let res = null; |
| | | try { |
| | | switch (this.addTreeForm.addTypeArr.length) { |
| | |
| | | this.addTreeFormVisible = false; |
| | | this.getStandardTree(); |
| | | this.getTableByClick(this.selectData, this.versionValue); |
| | | this.addTreeForm=null |
| | | this.addTreeForm.addTypeArr=[] |
| | | this.addTreeForm.addTypeArr=[]; |
| | | this.addTreeForm.specificationsName='' |
| | | this.addTreeForm.materialName='' |
| | | this.addTreeForm.standardName='' |
| | | // console.log(this.addTreeForm); |
| | | }, |
| | | changeCascader(data) { |
| | | this.addTreeForm.addTypeArr = data; |
| | |
| | | }); |
| | | } |
| | | }); |
| | | console.log(this.tableData); |
| | | }, |
| | | // 表格树全部选中配置 |
| | | // 全选/取消选操作 |