654 lines
24 KiB
Vue
654 lines
24 KiB
Vue
<template>
|
||
<div class="right-box right-box-asset" v-clickoutside="clickOutside">
|
||
<!--顶部按钮-->
|
||
<div class="right-box-top-btns">
|
||
<button v-if="editAsset.id" type="button" @click="del" id="asset-edit-del"
|
||
class="nz-btn nz-btn-size-normal nz-btn-size-alien nz-btn-style-light nz-btn-min-width-82">
|
||
<span class="right-box-top-btn-icon"><i class="el-icon-delete"></i></span>
|
||
<span class="right-box-top-btn-txt">{{$t('overall.delete')}}</span>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="right-box-title">{{editAsset.id ? ($t("asset.editAsset") + " ID：" + editAsset.id) : $t("asset.createAsset")}}</div>
|
||
|
||
<el-scrollbar class="right-box-form-box" ref="scrollbar">
|
||
<el-form ref="assetEditForm" :model="editAsset" label-width="120px" class="right-box-form right-box-form-left" :rules="rules">
|
||
<el-form-item :label="$t('asset.sn')" prop="sn">
|
||
<el-input size="small" v-model="editAsset.sn"/>
|
||
</el-form-item>
|
||
<el-form-item :label="$t('asset.host')" prop="host">
|
||
<el-input size="small" v-model="editAsset.host"/>
|
||
</el-form-item>
|
||
<el-form-item :label="$t('asset.state')">
|
||
<div class="select-style">
|
||
<el-select size="small" v-model="editAsset.state" placeholder="" popper-class="asset-dropdown" >
|
||
<el-option
|
||
:id="'asset-edit-state-op-'+item.value"
|
||
v-for="item in $CONSTANTS.asset.stateData"
|
||
:key="item.value"
|
||
:label="item.label"
|
||
:value="item.value">
|
||
</el-option>
|
||
</el-select>
|
||
</div>
|
||
</el-form-item>
|
||
<div class="right-box-sub-title">{{$t('asset.assetInfo')}}</div>
|
||
<div class="line-100 right-box-line"></div>
|
||
<!------------------------------------------资产类型---------------------------------------------->
|
||
<el-form-item :label="$t('asset.assetType')" class="right-box-form-content" prop="model.type.code">
|
||
<el-select popper-class="asset-dropdown" size="small" v-model="editAsset.model.type.code" @change="getVendorAndModelOptionData(editAsset.model.type.code)">
|
||
<el-option
|
||
:id="'asset-edit-type-op-'+item.id"
|
||
v-for="item in assetTypeData"
|
||
:key="item.id"
|
||
:value="item.code"
|
||
:label="item.value"
|
||
>
|
||
</el-option>
|
||
</el-select>
|
||
</el-form-item>
|
||
<!------------------------------------------厂商/型号---------------------------------------------->
|
||
<el-form-item :label="$t('asset.vendorModel')" class="right-box-form-content" prop="modelId">
|
||
<el-cascader
|
||
:options="vendorAndModelOptionData"
|
||
:props="{emitPath: false}"
|
||
:disabled="editAsset.model.type.code ? false : true"
|
||
v-model="editAsset.modelId"
|
||
clearable
|
||
size="small"
|
||
placeholder=""
|
||
class="right-box-row-with-btn"
|
||
@change="modelChange"
|
||
>
|
||
</el-cascader>
|
||
<div class="right-box-row-btn" @click="addVendor(editAsset.model.type.code)"><i class="el-icon-plus"></i></div>
|
||
</el-form-item>
|
||
<el-form-item :label="$t('asset.purchaseDate')">
|
||
<div class="select-style">
|
||
<el-date-picker
|
||
size="small"
|
||
v-model="editAsset.purchaseDate"
|
||
value-format="yyyy-MM-dd"
|
||
type="date"
|
||
style="width: 100%"
|
||
placeholder="">
|
||
</el-date-picker>
|
||
</div>
|
||
</el-form-item>
|
||
<!--tag-->
|
||
<div class="right-box-sub-title">{{$t('overall.tag')}}
|
||
<div class="right-box-form-btns">
|
||
<button style="display: none;">第一个button会出现意料之外的hover样式，找不到原因，只好加个不可见的button规避问题</button>
|
||
<button id="module-add-param" type="button" @click="addTag">
|
||
<span><i style="font-size: 12px;" class="nz-icon nz-icon-create-square"></i></span>
|
||
</button>
|
||
</div></div>
|
||
<div class="line-100 right-box-line"></div>
|
||
<el-form-item>
|
||
<template slot="label">
|
||
<span></span>
|
||
</template>
|
||
<div class="tag-edit-box">
|
||
<div class="tag-edit-box-head">
|
||
<div>Tag</div>
|
||
<div>Value</div>
|
||
<div>Action</div>
|
||
</div>
|
||
<el-scrollbar ref="tagEditBoxScrollbar" style="height: calc(100% - 32px);">
|
||
<div class="tag-edit-box-body" v-for="(item, index) in editAsset.tags">
|
||
<el-form-item class="tag-edit tag-edit-tag" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}" :prop="'tags.' + index + '.tag'">
|
||
<el-input placeholder="tag" size="mini" v-model="item.tag"></el-input>
|
||
</el-form-item>
|
||
<el-form-item class="tag-edit tag-edit-value" :rules="{required: true, message: $t('validate.required'), trigger: 'blur'}" :prop="'tags.' + index + '.value'">
|
||
<el-input placeholder="value" size="mini" v-model="item.value"></el-input>
|
||
</el-form-item>
|
||
<div class="param-box-row-symbol" :id="'asset-tag-remove-'+index" @click.stop="removeTag(index)"><i class="nz-icon nz-icon-minus-square"></i></div>
|
||
</div>
|
||
</el-scrollbar>
|
||
</div>
|
||
</el-form-item>
|
||
|
||
<div class="right-box-sub-title">{{$t('asset.location')}}</div>
|
||
<div class="line-100 right-box-line"></div>
|
||
<!------------------------------------------IDC---------------------------------------------->
|
||
<el-form-item :label="$t('asset.location')" prop="locationInfo" :rules="[{validator:locationValidator, trigger:'blur'}]">
|
||
<location-cascader :disabled="editAsset.modelId ? false : true" :default-model-u-size="modelSize" @change="setLocationData" ref="locationCascader" :idc-option="dcData"></location-cascader>
|
||
</el-form-item>
|
||
<!--cli-->
|
||
<div class="right-box-sub-title">{{$t('config.account.account')}}
|
||
<el-popover placement="right" width="70" trigger="click" :disabled="editAsset.accounts.length == 3" v-model.sync="showAccountOp" popper-class="no-style-class">
|
||
<button slot="reference" id="add-type" type="button" class="float-right" :class="{'nz-btn-disabled': editAsset.accounts.length == 3}">
|
||
<span><i style="font-size: 12px;" class="nz-icon nz-icon-create-square"></i></span>
|
||
</button>
|
||
<ul class="el-select-dropdown__list">
|
||
<li @click="addAccount(type)" v-for="(type, index) in selectableAccountTypes" :key="index" class="el-select-dropdown__item"><span>{{type}}</span></li>
|
||
</ul>
|
||
</el-popover>
|
||
</div>
|
||
<div class="line-100 right-box-line"></div>
|
||
<div class="nz-tab" style="padding-left: 30px;">
|
||
<div class="nz-tab-item-box" v-for="(account, index) in editAsset.accounts" :key="index" @click="changeProtocolType(account.protocol)" :id="`account-login-type-${index}`">
|
||
<div class="nz-tab-item" :class="{'nz-tab-item-active': accountType == account.protocol}" style="position: relative;">
|
||
<span>{{account.protocol}}</span>
|
||
<transition name="el-zoom-in-top">
|
||
<div v-if="errorProtocol.indexOf(account.protocol) > -1" class="nz-tab-error el-form-item__error">Required</div>
|
||
</transition>
|
||
</div>
|
||
<span class="nz-tab-item-close" @click.stop="removeAccount(index)"><i class="el-icon-circle-close"></i></span>
|
||
</div>
|
||
</div>
|
||
<account-config-box v-for="(account,index) in editAsset.accounts" :account="account" v-show="account.protocol == accountType" :key="index" ref="accountConfigBox" @setValidateResult="setAccountValidResult" @protocol-type-change="protocolTypeChange"></account-config-box>
|
||
|
||
<template v-if="accountType == 'SSH' && !editAsset.id">
|
||
<el-form-item :label="$t('asset.exporter')" class="exporter-label">
|
||
<el-switch class="exporter-switch" v-model="editAsset.exporter" active-color="#ee9d3f" active-value="1" inactive-value="0" :show="!exporterDisableSwitch"></el-switch>
|
||
</el-form-item>
|
||
</template>
|
||
</el-form>
|
||
</el-scrollbar>
|
||
|
||
<!--底部按钮-->
|
||
<div class="right-box-bottom-btns">
|
||
<button @click="esc(false)" class="nz-btn nz-btn-size-normal nz-btn-style-light nz-btn-min-width-100" id="asset-edit-cancel">
|
||
<span>{{$t('overall.cancel')}}</span>
|
||
</button>
|
||
<button @click="save" class="nz-btn nz-btn-size-normal nz-btn-style-normal nz-btn-min-width-100" id="asset-edit-save">
|
||
<span>{{$t('overall.save')}}</span>
|
||
</button>
|
||
</div>
|
||
<transition name="right-box">
|
||
<model-box v-if="rightBox.model.show" ref="modelBox" @reload="modelReload" :model="model" @close="closeRightBox"></model-box>
|
||
</transition>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import accountConfig from '../../page/asset/accountConfig';
|
||
import {host} from '../js/validate';
|
||
import {port} from '../js/validate'
|
||
import locationCascader from "./locationCascader";
|
||
export default {
|
||
name: "assetBox",
|
||
props: {
|
||
asset: Object
|
||
},
|
||
components:{
|
||
'account-config-box': accountConfig,
|
||
'location-cascader':locationCascader,
|
||
},
|
||
data() {
|
||
return {
|
||
editAsset: {},
|
||
|
||
rightBox: {model: {show: false}},
|
||
modelData: [],
|
||
dcData: [],
|
||
assetTypeData: [],
|
||
cabinetData: [],
|
||
vendorAndModelOptionData: [], //厂商型号下拉框选择数据
|
||
|
||
showAccountOp: false,
|
||
errorProtocol: [], //校验不通过的account
|
||
selectableAccountTypes: ["SSH", "TELNET", "SNMP"],
|
||
|
||
modelSize: 1,
|
||
locationInfo: null,
|
||
|
||
accountType: '',
|
||
model: {},
|
||
blankModel: {
|
||
id: '',
|
||
name: '',
|
||
vendor: {id: '', value: '', code: '', type: ''},
|
||
type: {id: '', value: '', code: '', type: ''},
|
||
assetStat: {total: '', inStock: '', outStock: ''},
|
||
remark: '',
|
||
vendorCode: '',
|
||
typeCode: ''
|
||
},
|
||
userData: [], //用户（人）信息
|
||
cabinetSelectedData: {
|
||
name: '',
|
||
uSize: 0,
|
||
remark: '',
|
||
idcId: '',
|
||
},
|
||
rules: {
|
||
sn: [
|
||
{required: true, message: this.$t('validate.required'), trigger: 'blur'}
|
||
],
|
||
host: [
|
||
{required:true,message:this.$t('validate.required'),trigger: 'blur'},
|
||
{validator:host, trigger: 'blur'}
|
||
],
|
||
modelId: [
|
||
{required: true, message: this.$t('validate.required'), trigger: 'change'}
|
||
],
|
||
"model.type.code": [
|
||
{required: true, message: this.$t('validate.required'), trigger: 'change'}
|
||
],
|
||
idcId: [
|
||
{required: true, message: this.$t('validate.required'), trigger: 'change'}
|
||
],
|
||
'impi.host':[
|
||
{validator:host,trigger:'blur'}
|
||
],
|
||
'impi.port':[
|
||
{validator:port,trigger:'blur'}
|
||
]
|
||
},
|
||
cabRules: {
|
||
name: [
|
||
{required: true, message: this.$t('validate.required'), trigger: 'blur'}
|
||
],
|
||
uSize: [
|
||
{required: true, type: 'number', min: 1, max: 47, message: this.$t('validate.required'), trigger: 'blur'}
|
||
],
|
||
idcId: [
|
||
{required: true, message: this.$t('validate.required'), trigger: 'blur'}
|
||
]
|
||
},
|
||
formData:null,
|
||
accountValidResult: true,
|
||
changeProtocolSwitch: true,
|
||
exporterDisableSwitch: false
|
||
}
|
||
},
|
||
watch: {
|
||
asset: {
|
||
deep: true,
|
||
immediate: true,
|
||
handler(n) {
|
||
this.editAsset = JSON.parse(JSON.stringify(n));
|
||
if (!this.editAsset.accounts) {
|
||
this.$set(this.editAsset, "accounts", []);
|
||
} else {
|
||
this.editAsset.accounts.length > 0 && (this.accountType = this.editAsset.accounts[0].protocol);
|
||
}
|
||
console.info(n)
|
||
this.getVendorAndModelOptionData(n.model.type.code);
|
||
}
|
||
},
|
||
'editAsset.accounts': {
|
||
deep: true,
|
||
handler(n) {
|
||
let temp = ["SSH", "TELNET", "SNMP"];
|
||
n.forEach(item => {
|
||
let i = temp.indexOf(item.protocol);
|
||
if (i > -1) {
|
||
temp.splice(i, 1);
|
||
}
|
||
});
|
||
this.selectableAccountTypes = temp;
|
||
}
|
||
},
|
||
},
|
||
methods: {
|
||
clickOutside() {
|
||
this.esc(false);
|
||
},
|
||
/*关闭弹框*/
|
||
esc(refresh) {
|
||
this.$emit("close", refresh);
|
||
},
|
||
modelReload() {
|
||
|
||
},
|
||
//关闭model侧滑框
|
||
closeRightBox(refresh) {
|
||
this.rightBox.model.show = false;
|
||
if (refresh) { //新增修改型号后刷新相关数据
|
||
this.getVendorData();
|
||
this.getModelData(this.editAsset.model.type.code);
|
||
}
|
||
},
|
||
getVendorData() {
|
||
return new Promise(resolve => {
|
||
this.$get('sys/dict/all?type=vendor').then(response => {
|
||
if (response.code === 200) {
|
||
this.vendorData = response.data;
|
||
}
|
||
resolve(this.vendorData);
|
||
});
|
||
});
|
||
},
|
||
getModelData(assetType) {
|
||
return new Promise(resolve => {
|
||
let url = assetType ? ('model?typeCode=' + assetType) : 'model';
|
||
this.$get(url).then(response => {
|
||
if (response.code === 200) {
|
||
this.modelData = response.data.list;
|
||
}
|
||
resolve(this.modelData);
|
||
});
|
||
});
|
||
},
|
||
//组织符合cascader的数据格式
|
||
getVendorAndModelOptionData(assetType) {
|
||
let request = this.getModelData(assetType);
|
||
request.then(response => {
|
||
let resultData = [];
|
||
let modelData = response;
|
||
for (let i = 0; i < modelData.length; i++) {
|
||
if (!modelData[i].vendor) {
|
||
continue;
|
||
}
|
||
let obj = {};
|
||
obj.id = modelData[i].vendor.id;
|
||
obj.code = modelData[i].vendor.code;
|
||
obj.value = modelData[i].vendor.code;
|
||
obj.label = modelData[i].vendor.value;
|
||
obj.children = [];
|
||
resultData.push(obj);
|
||
}
|
||
let result = [];
|
||
let obj1 = {};
|
||
for (let i = 0; i < resultData.length; i++) {
|
||
if (!obj1[resultData[i].id]) {
|
||
result.push(resultData[i]);
|
||
obj1[resultData[i].id] = true;
|
||
}
|
||
}
|
||
for (let x = 0; x < result.length; x++) {
|
||
for (let y = 0; y < modelData.length; y++) {
|
||
if (!modelData[y].vendor) {
|
||
continue;
|
||
}
|
||
if (result[x].code === modelData[y].vendor.code) {
|
||
let obj2 = {};
|
||
obj2.value = modelData[y].id;
|
||
obj2.label = modelData[y].name;
|
||
result[x].children.push(obj2);
|
||
}
|
||
}
|
||
}
|
||
this.vendorAndModelOptionData = result;
|
||
});
|
||
},
|
||
addTag() {
|
||
this.editAsset.tags.push({tag: "", value: ""});
|
||
this.$nextTick(() => {
|
||
this.$refs.tagEditBoxScrollbar.update();
|
||
});
|
||
},
|
||
addAccount(type) {
|
||
if (type == "SSH") {
|
||
this.editAsset.accounts.push({
|
||
authType: 1,
|
||
protocol: "SSH",
|
||
port: 22,
|
||
params: {
|
||
user: "",
|
||
method: "password",
|
||
password: "",
|
||
key: "",
|
||
passwordKey: ""
|
||
}
|
||
});
|
||
} else if (type == "TELNET") {
|
||
this.editAsset.accounts.push({
|
||
protocol: "TELNET",
|
||
port: 23,
|
||
params: {
|
||
user: "",
|
||
password: "",
|
||
userTip: "",
|
||
passwordTip: "",
|
||
reloginTip: ""
|
||
}
|
||
});
|
||
} else if (type == "SNMP") {
|
||
this.editAsset.accounts.push({
|
||
protocol: "SNMP",
|
||
port: 161,
|
||
params: {
|
||
version:2,
|
||
community:"public",
|
||
securityName:"",
|
||
securityLevel:"",
|
||
password:"",
|
||
privPassword:"",
|
||
authProtocol:"",
|
||
privProtocol:"",
|
||
contextName:""
|
||
}
|
||
});
|
||
}
|
||
this.accountType = type;
|
||
this.showAccountOp = false;
|
||
this.$nextTick(() => {
|
||
let sbWrap = this.$refs.scrollbar.$refs.wrap;
|
||
sbWrap.scrollTop = sbWrap.scrollHeight;
|
||
});
|
||
},
|
||
removeAccount(index) {
|
||
this.editAsset.accounts.splice(index, 1);
|
||
if (this.editAsset.accounts.length > 0) {
|
||
this.accountType = this.editAsset.accounts[0].protocol;
|
||
} else {
|
||
this.accountType = "";
|
||
}
|
||
},
|
||
removeTag(index) {
|
||
this.editAsset.tags.splice(index, 1);
|
||
this.$nextTick(() => {
|
||
this.$refs.tagEditBoxScrollbar.update();
|
||
});
|
||
},
|
||
setLocationData(data) {
|
||
this.locationInfo = data;
|
||
},
|
||
locationValidator:function(rule, value, callback){
|
||
let $temp=this;
|
||
setTimeout(()=>{
|
||
if(!this.locationInfo){
|
||
callback(new Error($temp.$t('validate.required')))
|
||
}else if(this.locationInfo && !this.locationInfo.idc){
|
||
callback(new Error($temp.$t('validate.required')))
|
||
}else{
|
||
callback();
|
||
}
|
||
}, 100)
|
||
},
|
||
modelChange(modelId) {
|
||
let model = this.modelData.find((item, index)=>{
|
||
return modelId == item.id;
|
||
});
|
||
this.modelSize = model.usize;
|
||
},
|
||
getDcData() {
|
||
return new Promise(resolve => {
|
||
this.$get('idc').then(response => {
|
||
if (response.code === 200) {
|
||
this.dcData = response.data.list;
|
||
}
|
||
resolve(this.dcData);
|
||
});
|
||
});
|
||
},
|
||
getUserData() {
|
||
return new Promise(resolve => {
|
||
this.$get('sys/user/list').then(response => {
|
||
if (response.code === 200) {
|
||
this.userData = response.data.list
|
||
}
|
||
resolve(this.userData);
|
||
});
|
||
});
|
||
},
|
||
getCabinetData(id) {
|
||
return new Promise(resolve => {
|
||
this.$get('cabinet?idcId=' + id).then(response => {
|
||
if (response.code === 200) {
|
||
this.cabinetData = response.data.list;
|
||
for (let i = 0; i < this.cabinetData.length; i++) {
|
||
this.$set(this.cabinetData[i], 'children', this.dcData)
|
||
}
|
||
}
|
||
resolve(this.cabinetData);
|
||
});
|
||
});
|
||
},
|
||
getAssetTypeData() {
|
||
return new Promise(resolve => {
|
||
this.$get('sys/dict/all?type=assetType').then(response => {
|
||
if (response.code === 200) {
|
||
this.assetTypeData = response.data;
|
||
}
|
||
resolve(this.assetTypeData);
|
||
});
|
||
});
|
||
},
|
||
newModel() {
|
||
return JSON.parse(JSON.stringify(this.blankModel));
|
||
},
|
||
addVendor(assetType) {
|
||
this.model = this.newModel();
|
||
if (assetType) {
|
||
//model侧滑弹出时，自动选好assetType
|
||
for (let i = 0; i < this.assetTypeData.length; i++) {
|
||
if (this.assetTypeData[i].code == assetType) {
|
||
this.model.type.code = assetType;
|
||
this.model.type.value = this.assetTypeData[i].value;
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
this.rightBox.model.show = true;
|
||
},
|
||
setAccountValidResult(result, protocol) {
|
||
this.accountValidResult = result;
|
||
let index = this.errorProtocol.indexOf(protocol);
|
||
if (result) {
|
||
index != -1 ? this.errorProtocol.splice(index, 1) : "";
|
||
} else {
|
||
index == -1 ? this.errorProtocol.push(protocol) : "";
|
||
}
|
||
},
|
||
del() {
|
||
this.$confirm(this.$t("tip.confirmDelete"), {
|
||
confirmButtonText: this.$t("tip.yes"),
|
||
cancelButtonText: this.$t("tip.no"),
|
||
type: 'warning'
|
||
}).then(() => {
|
||
this.$delete("asset?ids=" + this.editAsset.id).then(response => {
|
||
if (response.code === 200) {
|
||
this.$message({duration: 2000, type: 'success', message: this.$t("tip.deleteSuccess")});
|
||
this.esc(true);
|
||
} else {
|
||
this.$message.error(response.msg);
|
||
}
|
||
})
|
||
});
|
||
},
|
||
changeProtocolType(type) {
|
||
this.accountType = type;
|
||
this.$nextTick(() => {
|
||
let sbWrap = this.$refs.scrollbar.$refs.wrap;
|
||
sbWrap.scrollTop = sbWrap.scrollHeight;
|
||
});
|
||
},
|
||
save() {
|
||
if(this.locationInfo) {
|
||
if(this.locationInfo.idc){
|
||
this.editAsset.idcId = this.locationInfo.idc.id;
|
||
}
|
||
if(this.locationInfo.cabinet) {
|
||
this.editAsset.cabinetId = this.locationInfo.cabinet.id;
|
||
}
|
||
if(this.locationInfo.u && this.locationInfo.u.length > 0) {
|
||
this.editAsset.cabinetStart = this.locationInfo.u[0];
|
||
this.editAsset.cabinetEnd = this.locationInfo.u[1];
|
||
}
|
||
}
|
||
|
||
if(this.$refs.accountConfigBox && this.$refs.accountConfigBox.length > 0) {
|
||
this.$refs.accountConfigBox.forEach(box => {
|
||
box.validateAccount();
|
||
});
|
||
}
|
||
this.$refs.assetEditForm.validate((valid) => {
|
||
if (valid && this.accountValidResult) {
|
||
if (this.editAsset.id) {
|
||
this.$put('asset', this.editAsset).then(res => {
|
||
if (res.code === 200) {
|
||
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
|
||
this.esc(true);
|
||
} else {
|
||
this.$message.error(res.msg);
|
||
}
|
||
});
|
||
} else {
|
||
if(this.$refs.accountConfigBox && this.$refs.accountConfigBox.length > 0){
|
||
this.$refs.accountConfigBox[0].validateAccount();
|
||
}
|
||
this.$post('asset', this.editAsset).then(res => {
|
||
if (res.code === 200) {
|
||
this.$message({duration: 2000, type: 'success', message: this.$t("tip.saveSuccess")});
|
||
this.esc(true);
|
||
} else {
|
||
this.$message.error(res.msg);
|
||
}
|
||
});
|
||
}
|
||
} else {
|
||
return false;
|
||
}
|
||
});
|
||
},
|
||
protocolTypeChange(protocol) {
|
||
if(protocol == 'TELNET'){
|
||
this.exporterDisableSwitch = true;
|
||
}else{
|
||
this.exporterDisableSwitch = false;
|
||
}
|
||
}
|
||
},
|
||
mounted() {
|
||
this.getUserData();
|
||
this.getVendorData();
|
||
this.getAssetTypeData();
|
||
this.getDcData();
|
||
this.showAccountOp = false;
|
||
}
|
||
}
|
||
</script>
|
||
<style >
|
||
.location-selector{
|
||
width: 512px;
|
||
}
|
||
.location-selector .el-select-dropdown__item {
|
||
position: relative;
|
||
}
|
||
.location-selector .el-cascader-node__prefix{
|
||
display: none !important;
|
||
}
|
||
.cabinet-u-label .el-checkbox__original:checked + span{
|
||
background-color: orange;
|
||
}
|
||
.cabinet-u-label .el-checkbox__original:checked + span:after{
|
||
-webkit-transform: rotate(45deg) scaleY(1);
|
||
transform: rotate(45deg) scaleY(1);
|
||
}
|
||
.cabinet-u-label .is-disabled{
|
||
cursor: not-allowed;
|
||
border-color: #C0C4CC;
|
||
}
|
||
.cabinet-u-label .is-disabled-bg{
|
||
background-color: #F2F6FC !important;
|
||
}
|
||
.cabinet-u-label .is-disabled-check:after{
|
||
border-color: #C0C4CC !important;
|
||
}
|
||
</style>
|
||
<style scoped>
|
||
#module-add-param,#add-type{
|
||
background: #fff;
|
||
border: none;
|
||
cursor: pointer;
|
||
outline: none;
|
||
margin-right: 5px;
|
||
|
||
}
|
||
</style>
|