mirror of https://github.com/rancher/dashboard.git
667 fixes
This commit is contained in:
lvuch
parent
5df4b3e34c
commit
73d72e2ed9
|
|
@ -1,40 +1,42 @@
|
|||
<script>
|
||||
import LabeledInput from '@/components/form/LabeledInput';
|
||||
import LabeledSelect from '@/components/form/LabeledSelect';
|
||||
import LabeledInput from "@/components/form/LabeledInput";
|
||||
import LabeledSelect from "@/components/form/LabeledSelect";
|
||||
export default {
|
||||
components: { LabeledInput, LabeledSelect },
|
||||
props: {
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
},
|
||||
certs: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
},
|
||||
data() {
|
||||
const defaultCert = {
|
||||
label: this.t('ingress.certificates.defaultCertLabel'),
|
||||
label: this.t("ingress.certificates.defaultCertLabel"),
|
||||
value: null,
|
||||
};
|
||||
const { hosts = [''], secretName = defaultCert.value } = this.value;
|
||||
const { hosts = [""], secretName = defaultCert.value } = this.value;
|
||||
|
||||
return {
|
||||
defaultCert, hosts, secretName
|
||||
defaultCert,
|
||||
hosts,
|
||||
secretName,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
certsWithDefault() {
|
||||
return [this.defaultCert, ...this.certs];
|
||||
}
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
addHost(ev) {
|
||||
ev.preventDefault();
|
||||
this.hosts.push('');
|
||||
this.hosts.push("");
|
||||
this.update();
|
||||
},
|
||||
remove(ev, idx) {
|
||||
|
|
@ -48,9 +50,9 @@ export default {
|
|||
if (this.secretName !== this.defaultCert) {
|
||||
out.secretName = this.secretName;
|
||||
}
|
||||
this.$emit('input', out);
|
||||
}
|
||||
}
|
||||
this.$emit("input", out);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -63,20 +65,38 @@ export default {
|
|||
:options="certsWithDefault"
|
||||
:label="t('ingress.certificates.certificate.label')"
|
||||
required
|
||||
@input="e=>{secretName = e; update()}"
|
||||
@input="
|
||||
(e) => {
|
||||
secretName = e;
|
||||
update();
|
||||
}
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
<div class="col span-5">
|
||||
<div v-for="(host, i) in hosts" :key="i" class="row mb-10">
|
||||
<div :style="{'margin-right': '0px'}" class="col span-11">
|
||||
<LabeledInput :value="host" :label="t('ingress.certificates.host.label')" :placeholder="t('ingress.certificates.host.placeholder')" @input="e=>$set(hosts, i, e)" />
|
||||
<div :style="{ 'margin-right': '0px' }" class="col span-11">
|
||||
<LabeledInput
|
||||
:value="host"
|
||||
:label="t('ingress.certificates.host.label')"
|
||||
:placeholder="t('ingress.certificates.host.placeholder')"
|
||||
@input="(e) => $set(hosts, i, e)"
|
||||
/>
|
||||
</div>
|
||||
<button class="btn btn-sm role-link col" @click="e=>remove(e, i)">
|
||||
{{ t('ingress.certificates.removeHost') }}
|
||||
<button
|
||||
class="btn btn-sm role-link col"
|
||||
@click="(e) => remove(e, i)"
|
||||
style="line-height: 40px;"
|
||||
>
|
||||
{{ t("ingress.certificates.removeHost") }}
|
||||
</button>
|
||||
</div>
|
||||
<button :style="{'padding':'0px 0px 0px 5px'}" class="bn btn-sm role-link" @click="addHost">
|
||||
{{ t('ingress.certificates.addHost') }}
|
||||
<button
|
||||
:style="{ padding: '0px 0px 0px 5px' }"
|
||||
class="bn btn-sm role-link"
|
||||
@click="addHost"
|
||||
>
|
||||
{{ t("ingress.certificates.addHost") }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="col span-1">
|
||||
|
|
@ -88,17 +108,17 @@ export default {
|
|||
</div>
|
||||
</template>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.close{
|
||||
float:right;
|
||||
padding: 0px;
|
||||
position: relative;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
}
|
||||
.cert:not(:last-of-type) {
|
||||
padding-bottom: 10px;
|
||||
margin-bottom:30px;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
<style lang="scss" scoped>
|
||||
.close {
|
||||
float: right;
|
||||
padding: 0px;
|
||||
position: relative;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
}
|
||||
.cert:not(:last-of-type) {
|
||||
padding-bottom: 10px;
|
||||
margin-bottom: 30px;
|
||||
border-bottom: 1px solid var(--border);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,27 +1,29 @@
|
|||
<script>
|
||||
import RulePath from '@/edit/networking.k8s.io.ingress/RulePath';
|
||||
import LabeledInput from '@/components/form/LabeledInput';
|
||||
import { random32 } from '../../utils/string';
|
||||
import RulePath from "@/edit/networking.k8s.io.ingress/RulePath";
|
||||
import LabeledInput from "@/components/form/LabeledInput";
|
||||
import { random32 } from "../../utils/string";
|
||||
export default {
|
||||
components: { RulePath, LabeledInput },
|
||||
props: {
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
type: Object,
|
||||
default: () => {
|
||||
return {};
|
||||
}
|
||||
},
|
||||
},
|
||||
serviceTargets: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
},
|
||||
data() {
|
||||
const { host = '', http = {} } = this.value;
|
||||
const { host = "", http = {} } = this.value;
|
||||
const { paths = [{ id: random32(1) }] } = http;
|
||||
|
||||
return {
|
||||
host, paths, ruleMode: this.value.asDefault ? 'asDefault' : 'setHost'
|
||||
host,
|
||||
paths,
|
||||
ruleMode: this.value.asDefault ? "asDefault" : "setHost",
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -34,7 +36,7 @@ export default {
|
|||
} else {
|
||||
delete out.host;
|
||||
}
|
||||
this.$emit('input', out);
|
||||
this.$emit("input", out);
|
||||
},
|
||||
addPath(ev) {
|
||||
ev.preventDefault();
|
||||
|
|
@ -47,9 +49,9 @@ export default {
|
|||
this.paths = neu;
|
||||
},
|
||||
removeRule() {
|
||||
this.$emit('remove');
|
||||
}
|
||||
}
|
||||
this.$emit("remove");
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
|
@ -57,10 +59,13 @@ export default {
|
|||
<div class="rule" @input="update">
|
||||
<div class="row mb-20">
|
||||
<div id="host" class="col span-6">
|
||||
<LabeledInput v-model="host" :label="t('ingress.rules.requestHost.label')" :placeholder="t('ingress.rules.requestHost.placeholder')" />
|
||||
</div>
|
||||
<div id="host" class="col span-5">
|
||||
<LabeledInput
|
||||
v-model="host"
|
||||
:label="t('ingress.rules.requestHost.label')"
|
||||
:placeholder="t('ingress.rules.requestHost.placeholder')"
|
||||
/>
|
||||
</div>
|
||||
<div id="host" class="col span-5"></div>
|
||||
<div class="col span-1">
|
||||
<button class="btn role-link close" @click="removeRule">
|
||||
<i class="icon icon-2x icon-x" />
|
||||
|
|
@ -69,13 +74,13 @@ export default {
|
|||
</div>
|
||||
<div class="rule-path-headings row mb-0">
|
||||
<div class="col span-4">
|
||||
{{ t('ingress.rules.path.label') }}
|
||||
<label>{{ t("ingress.rules.path.label") }}</label>
|
||||
</div>
|
||||
<div class="col span-4">
|
||||
{{ t('ingress.rules.target.label') }}
|
||||
<label>{{ t("ingress.rules.target.label") }}</label>
|
||||
</div>
|
||||
<div class="col span-3" :style="{'margin-right': '0px'}">
|
||||
{{ t('ingress.rules.port.label') }}
|
||||
<div class="col span-3" :style="{ 'margin-right': '0px' }">
|
||||
<label>{{ t("ingress.rules.port.label") }}</label>
|
||||
</div>
|
||||
<div class="col" />
|
||||
</div>
|
||||
|
|
@ -86,31 +91,37 @@ export default {
|
|||
:value="path"
|
||||
:rule-mode="ruleMode"
|
||||
:service-targets="serviceTargets"
|
||||
@input="e=>$set(paths, i, e)"
|
||||
@remove="e=>removePath(i)"
|
||||
@input="(e) => $set(paths, i, e)"
|
||||
@remove="(e) => removePath(i)"
|
||||
/>
|
||||
</template>
|
||||
<button v-if="ruleMode === 'setHost'" :style="{'padding':'0px 0px 0px 5px'}" class="btn btn-sm role-link" @click="addPath">
|
||||
{{ t('ingress.rules.addPath') }}
|
||||
<button
|
||||
v-if="ruleMode === 'setHost'"
|
||||
:style="{ padding: '0px 0px 0px 5px' }"
|
||||
class="btn btn-sm role-link"
|
||||
@click="addPath"
|
||||
>
|
||||
{{ t("ingress.rules.addPath") }}
|
||||
</button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang='scss' scoped>
|
||||
.rule {
|
||||
background: var(--tabbed-container-bg);
|
||||
border: 1px solid var(--tabbed-border);
|
||||
border-radius: var(--border-radius);
|
||||
padding: 20px;
|
||||
}
|
||||
#host {
|
||||
align-self: center
|
||||
}
|
||||
.close{
|
||||
float:right;
|
||||
padding: 0px;
|
||||
position: relative;
|
||||
top: -20px;
|
||||
right: -20px;
|
||||
}
|
||||
<style lang="scss" scoped>
|
||||
.rule {
|
||||
background: var(--tabbed-container-bg);
|
||||
border: 1px solid var(--tabbed-border);
|
||||
border-radius: var(--border-radius);
|
||||
padding: 20px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
#host {
|
||||
align-self: center;
|
||||
}
|
||||
.close {
|
||||
float: right;
|
||||
padding: 0px;
|
||||
position: relative;
|
||||
top: -10px;
|
||||
right: -10px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue