Vue+ElementUI Treeの使い方
|
Vue+ElementUI Treeの使い方は参考までに。具体的な内容は以下のとおりです。
フロントエンドコード
<テンプレート>
<div>
<el-dialog title="ターミナルアドレス帳" :visible.sync="isOpen" class="el-dialog-mini">
<div class="forms-menu-con">
<!--
check-on-click-node: 中国語の文字を選択するときにチェックボックスを選択するかどうかを設定します。props: ノードと指定したフィールド間の一致を定義します (たとえば、名前はデータベースから照会された名前属性に対応します)
data: ツリー内のデータ。フィールドをカスタマイズしたり、ビジネス フィールドを追加したりできます。クリックすると、関数が呼び出されて値を取得します。node-key: unique。ノードが選択されたときに一意の識別子として使用されるフィールドを意味します。render-content: コンテンツのレンダリング。ツリー メニューにアイコンやその他のスタイルを追加する場合は、この属性を使用してレンダリング関数を構成します。check-change: チェック ボックスの状態が変わると、関数がトリガーされます。これは主に、単一選択操作とビジネス処理に使用されます。show-checkbox: チェック ボックスを表示します。highlight-current: 選択したノードを強調表示します。check-strictly: チェック ボックスが表示されるときに、親ノードと子ノードを互いに関連付けないという慣行に厳密に従うかどうか。デフォルト値は false です。
-->
<el-tree :data="treeData" :props="treeProps" :check-strictly="true" node-key="id" ref="treeForm" :render-content="renderContent" @check-change="handleClick" show-checkbox highlight-current class="addtree" style="height:275px;">
</el-tree>
<el-col class="フォーム検索列センター">
<el-button @click="送信">
<i class="ump-save" style="font-size:15px;"></i>OK</el-button>
<el-button @click="閉じる">
<i class="ump-quxiao3" style="font-size:16px;"></i>閉じる</el-button>
</el-col>
</div>
</el-ダイアログ>
</div>
</テンプレート>
<スクリプト>
エクスポートデフォルト{
データ（） {
戻る {
isOpen: 偽、
ifonlyTerminal: 1,
ツリーデータ: [],
ツリープロパティ: {
ラベル: 'ラベル',
子供: 「子供」,
無効: this.disabledFn
}
}
},
メソッド: {
disabledFn(データ、ノード) {
data.nodeType == 0 を返します。
},
handleClick(データ、チェック済み、ノード) {
$this = this; とします。
（チェックあり）{
コンソールにログ出力します。
/** このノードは常に単一選択です*/
//$this.$refs.treeForm.setCheckedNodes([データ]);
/** このノードは複数選択に使用されます*/
$this.$refs.treeForm.setChecked([データ]);
}
},
レンダリングコンテンツ(h, {
ノード、
データ、
店
}) {
戻る （
<span クラス = "カスタムツリーノード" >
<span>
<i クラス = {data.icon} ></i>
{ データ.ラベル }
</span>
</span>
);
},
open(選択、ifonlyTerminal) {
$this = this; とします。
ツリーデータ
ifonlyTerminal は、ターミナルをオーバーライドします。
$this.$httpclient.get("/reminder/getTerminalContacts", {
ifonlyTerminal: $this.ifonlyTerminal
}, 関数 (res) {
res.success が true の場合
ツリーデータを返します。
$this.$refs.treeForm.setCheckedKeys(選択項目);
} それ以外 {
$this.$message({
メッセージ: 「初期化に失敗しました。ネットワークが失われました...」
タイプ: 'エラー'
});
}
});
this.isOpen = true;
},
提出する（） {
選択ノードを this.$refs.treeForm.getCheckedNodes() とします。
リストを [] にします。
for(let i=0;i<selectionNode.length;i++){
項目をselectionNode[i]とします。
リスト.push({
id:アイテム.id、
ターミナル名:item.label,
ターミナル番号:item.terminalNum、
シリアル番号:item.serialNum、
ターミナルタイプ:item.terminalType
});
}
console.log(リスト);
this.$parent.setTerminals(リスト);
これを閉じます。
},
近い（） {
this.isOpen = false;
}
}
}
</スクリプト>参照コンポーネント
<テンプレート>
<div>
<el-dialog title="スケジュールされた会議を追加する" :visible.sync="addModelOpen" class="el-dialog-large dialogClass">
<div class="forms-menu mar-10">
<div class="forms-menu-tit">
<span>
<i class="ump-caidan flt-l" style="color:#2681ec;font-size:20px;margin-top:-3px;"></i>
基本情報
</div>
<div class="フォームメニュー-con par-T10">
<el-行>
<el-form :model="addForm" :rules="rules" ref="addForm" :inline="true" label-position="right">
<div class="el-colum-xs12 ブロック">
<div class="フォームグループ el-display">
<el-form-item label="テーマ" prop="title" style="width:1050px;">
<el-input v-model="addForm.title" placeholder="件名を入力してください"></el-input>
</el-form-item>
</div>
</div>
<div class="el-colum-xs12">
<div class="フォームグループ el-display">
<el-form-item label="開始時間" prop="startTime" style="margin-top:20px;width:700px;">
<el-date-picker :picker-options="startTimeValid" @change="newValid" v-model="addForm.startTime" type="datetime" format="yyyy-MM-dd hh:mm" value-format="yyyy-MM-dd hh:mm" placeholder="会議の開始時刻を選択してください"></el-date-picker>
</el-form-item>
</div>
</div>
<div class="el-colum-xs12" style="margin-top:20px;">
<div class="フォームグループ">
<el-form-item label="会議の所要時間" prop="meetTime">
<el-select v-model="addForm.meetTimeHour" placeholder="選択してください" style="width:100px;">
<el-option ラベル="0" 値="0"></el-option>
<el-option ラベル="1" 値="1"></el-option>
<el-option ラベル="2" 値="2"></el-option>
<el-option ラベル="3" 値="3"></el-option>
<el-option ラベル="4" 値="4"></el-option>
<el-option ラベル="5" 値="5"></el-option>
<el-option ラベル="6" 値="6"></el-option>
</el-select>
<span style="margin:0px 10px">営業時間</span>
<el-select v-model="addForm.meetTimeMin" placeholder="選択してください" style="width:100px;">
<el-option ラベル="0" 値="0"></el-option>
<el-option ラベル="10" 値="10"></el-option>
<el-option ラベル="20" 値="20"></el-option>
<el-option ラベル="30" 値="30"></el-option>
<el-option ラベル="45" 値="45"></el-option>
<el-option ラベル="50" 値="50"></el-option>
</el-select>
<span style="margin:0px 10px">分</span>
</el-form-item>
</div>
</div>
<div class="el-colum-xs12" style="margin-top:20px;">
<div class="フォームグループ">
<el-form-item label="会議の詳細" prop="meetDetails" style="width:700px;">
<el-input type="textarea" :rows="3" v-model="addForm.meetDetails" placeholder="会議の概要情報を入力してください..."></el-input>
</el-form-item>
</div>
</div>
<div class="el-colum-xs12 ブロック" style="margin-top:20px;">
<div class="フォームグループ el-display">
<el-form-item label="参加者" prop="noselect" style="width:700px;">
<el-input v-model="terminalNum" placeholder="電話番号、端末番号、端末シリアル番号を入力し、「OK」ボタンをクリックして追加してください"></el-input>
<div class="form-search" style="display: inline">
<el-button @click="addTerminal"><i class="el-icon-document-checked" style="font-size:16px;margin-top:6px;"></i>OK</el-button>
<el-button @click="openContactsModel"><i class="el-icon-plus" style="font-size:16px;margin-top:6px"></i>アドレス帳から追加/キャンセル</el-button>
</div>
<el-checkbox-group v-model="ifonlyTerminal">
<el-checkbox label="A">端末のみ<span style="color:#44b5ff">(この選択には端末のみ含まれ、ユーザーは含まれません)</span></el-checkbox>
</el-チェックボックスグループ>
</el-form-item>
<el-form-item label="選択された端末/ユーザー" prop="端末" style="width:700px;">
<el-input type="textarea" class="textarea" v-model="terminalsInfo" readonly="読み取り専用"></el-input>
</el-form-item>
</div>
</div>
<!-- <div class="el-colum-xs12 block" style="margin-top:20px;">
<div class="フォームグループ el-display">
<el-form-item label="参加者" prop="名前" style="width:700px;">
<el-input v-model="terminalNum" placeholder="電話番号、端末番号、端末シリアル番号を入力し、「OK」ボタンをクリックして追加してください"></el-input>
<div class="form-search" style="display: inline">
<el-button @click="addTerminal"><i class="el-icon-document-checked" style="font-size:16px;margin-top:6px;"></i>OK</el-button>
<el-button @click="openContactsModel"><i class="el-icon-plus" style="font-size:16px;margin-top:6px"></i>アドレス帳から追加/キャンセル</el-button>
</div>
<el-checkbox-group v-model="ifonlyTerminal">
<el-checkbox label="A">端末のみ<span style="color:#44b5ff">(この選択には端末のみ含まれ、ユーザーは含まれません)</span></el-checkbox>
</el-チェックボックスグループ>
<el-input type="textarea" class="textarea" v-model="terminalsInfo"></el-input>
</el-form-item>
</div>
</div> -->
<div class="el-colum-xs12 ブロック" style="margin-top:20px;">
<div class="フォームグループ">
<el-form-item label="会議設定" prop="性別">
<el-checkbox-group v-model="ifAutoRecord">
<el-checkbox label="A"> <span style="color:#44b5ff">会議の開始時に、参加している端末を自動的に呼び出します</span></el-checkbox><br>
</el-チェックボックスグループ>
<el-checkbox-group v-model="ifAutoCall">
<el-checkbox label="B"> <span style="color:#44b5ff">自動的に記録する</span></el-checkbox>
</el-チェックボックスグループ>
</el-form-item>
</div>
</div>
<div class="el-colum-xs12 ブロック" style="margin-top:20px;">
<div class="フォームグループ">
<el-form-item label="クラウド会議室を選択" prop="meetRoomId">
<el-form-item ラベル="" スタイル="width:200px;">
<el-select v-model="addForm.meetRoomId" placeholder="会議室を選択してください">
<el-option v-for=" meetRooms 内のアイテム" :key="item.id" :label="item.roomName" :value="item.id"></el-option>
</el-select>
</el-form-item>
</el-form-item>
</div>
</div>
<div class="el-colum-xs12 ブロック" style="margin-top:20px;">
<div class="フォームグループ">
<el-col class="フォーム検索列センター">
<el-button @click="送信" :disabled="無効">
<i class="ump-save" style="font-size:15px;"></i>保存</el-button>
<el-button @click="閉じる">
<i class="ump-quxiao3" style="font-size:16px;"></i>閉じる</el-button>
<br /><br />
</el-col>
</div>
</div>
</el-form>
</el-row>
</div>
</div>
</el-ダイアログ>
<連絡先ref="連絡先モデル"></連絡先>
</div>
</テンプレート>
<スタイル>
.dialogClass .el-dialog {
高さ: 690ピクセル;
上位: 50%;
上マージン: -369px !重要;
}
.dialogClass .el-dialog .el-dialog__body {
高さ: 670px;
}
</スタイル>
<スクリプト>
'@/common/util.js' から dateUtil をインポートします。
「@/components/meet/reminder/contacts」から連絡先をインポートします。
エクスポートデフォルト{
コンポーネント:
連絡先
},
データ（） {
$this = this; とします。
meetTimeTimeValid = function (ルール、値、コールバック) {
(($this.addForm.meetTimeHour + $this.addForm.meetTimeMin) == 0) の場合 {
callback(new Error('会議の継続時間を選択してください'));
}
折り返し電話（）;
}
let 端末妥当性 = 関数 (ルール、値、コールバック) {
($this.addForm.terminals.length == 0) の場合 {
callback(new Error('参加端末/ユーザーを選択してください'));
}
折り返し電話（）;
}
戻る {
addModelOpen: false、
端末番号: "",
ifonlyTerminal: false、
端末情報: "",
ifAutoRecord: false、
ifAutoCall: false、
無効: false、
ミートルーム: [],
追加フォーム: {
タイトル： ""、
ミーティングルームID: "",
開始時間: "",
部屋番号: "",
会う時間: "0",
会う時間最小値: "20",
終了時間: "",
会う詳細: "",
ifAutoRecord: "",
ifAutoCall: "",
meetPassWord: "",
コントロールパスワード: "",
端末: []
},
ルール:
タイトル： [{
必須: true、
メッセージ: '会議のトピックを入力してください'
トリガー: 'ぼかし'
}],
ミーティングルームID: [{
必須: true、
メッセージ: 「クラウド会議室を選択してください」
トリガー: 'ぼかし'
}],
開始時間: [{
必須: true、
メッセージ: 「開始時間を選択してください」
トリガー: 'ぼかし'
}],
会う詳細: [{
必須: true、
メッセージ: 「会議の詳細を入力してください」
トリガー: 'ぼかし'
}],
会う時間: [{
バリデータ: meetTimeTimeValid、
トリガー: '変更'
}],
端末: [{
バリデータ: 端末Valid、
トリガー: '変更'
}]
},
開始時間有効: {
disabledDate: (時間) => {
time.getTime() <= Date.now() を返します。
}
}
}
},
マウント() {
console.log("緊急プラットフォームへようこそ - 予定会議...");
},
メソッド: {
開ける（） {
$this = this; とします。
$this.$httpclient.get("/reminder/getMeetRooms", {}, 関数 (res) {
res.success が true の場合
: データを保存する
} それ以外 {
$this.$message({
メッセージ: 「クラウド会議室が見つかりません。ネットワークが失われています...」
タイプ: '警告'
});
}
});
this.addModelOpen = true;
},
近い（） {
this.addModelOpen = false;
},
新しい妥当性(){
this.$refs["addForm"].validateField('startTime');
},
提出する（） {
$this = this; とします。
$this.btnStatus = true;
$this.$refs.addForm.validate((有効) => {
(有効 && $this.btnStatus) の場合 {
$this.addForm.ifAutoRecord = $this.ifAutoRecord ? 1 : 0;
$this.addForm.ifAutoCall = $this.ifAutoCall ? 1 : 0;
(i = 0 とします; i < $this.meetRooms.length; i++) {
アイテムを $this.meetRooms[i] とします。
if (item.id == $this.addForm.meetRoomId) {
フォームに部屋番号を追加します。
}
}
$this.$httpclient.post("/reminder", $this.addForm, 関数 (res) {
$this.btnStatus = false;
res.success が true の場合
$this.$parent.search();
閉じる
} それ以外 {
$this.$message({
メッセージ: '[ネットワークがビジーです],' + res.errorMsg,
タイプ: 'エラー'
});
}
});
} それ以外 {
$this.btnStatus = false;
false を返します。
}
});
},
オープンコンタクトモデル() {
リストを [] にします。
(i = 0 とします; i < this.addForm.terminals.length; i++) {
item = this.addForm.terminals[i]とします。
リストをプッシュします(アイテムID)。
}
this.$refs.contactsModel.open(リスト、 this.ifonlyTerminal ? 1 : 0);
},
/**
* この関数はコンポーネントの最後で使用されます。関数名を変更する場合は、呼び出しコンポーネントのコード行 *this.$parent.setTerminals(list);* を変更して置換を完了します。
* 親コンテナから子コンテナに関数を渡すなどの方法もあります。
* 結局、コードを 2 行節約できるので、私はこの方法を使うのが好きです、ハハハ~~
*/
setTerminals(端末) {
this.addForm.terminals = ターミナル;
端末情報 = "" とします。
(i = 0 とします; i < 端末の長さ; i++) {
ターミナルをterminals[i]とします。
端末情報 += "『[" + 端末.端末名 + "]-[" + 端末.端末番号 + "]』";
}
this.terminalsInfo = 端末情報;
},
ターミナルを追加します（）{
$this = this; とします。
ターミナルを $this.addForm.terminals とします。
フラグを true にします。
(i = 0 とします; i < 端末の長さ; i++) {
項目を端末[i]とします。
if (item.terminalNum == $this.terminalNum || item.serialNum == $this.terminalNum) {
フラグ = false;
$this.terminalNum = "";
$this.$message({
メッセージ: 「現在の端末が選択されています。再度追加する必要はありません。」
タイプ: '警告'
});
壊す;
}
}
if (フラグ) {
$this.$httpclient.get('/terminal/getTerminal', {
ターミナル番号: $this.terminalNum
}, 関数 (res) {
res.success が true の場合
ターミナルを res.data とします。
ターミナルをプッシュします。
$this.terminalsInfo += "『[" + ターミナル.terminalName + "]-[" + ターミナル.terminalNum + "]』";
$this.terminalNum = "";
} それ以外 {
$this.$message({
メッセージ: 「現在の端末が見つかりません。正しく入力したかどうか慎重に確認してください。」
タイプ: '警告'
});
}
});
}
}
}
}
</スクリプト>Jsonデータ形式を返す
{
「成功」：true、
"エラーコード": null、
"エラーメッセージ": null、
"データ"： [{
「ラベル」: "\u6E56\u5317\u7701\u8003\u8BD5\u9662",
"id": "17",
"親ID": "17",
"ノードタイプ": 0,
「アイコン」: null、
「子供達」: [{
"ラベル": "\u9662\u529E\u516C\u5BA4",
"id": "23",
"親ID": "17",
"ノードタイプ": 0,
「アイコン」: null、
「子供達」: [{
「ラベル」: "\u9662\u529E\u516C\u5BA4\u4E00\u5904",
"id": "24",
"親ID": "23",
"ノードタイプ": 0,
「アイコン」: null、
「子供」: null
}, {
「ラベル」: "\u9662\u529E\u516C\u5BA4\u4E8C\u5904",
"id": "25",
"親ID": "23",
"ノードタイプ": 0,
「アイコン」: null、
「子供」: null
}]
}]
}, {
「ラベル」: "\u6E56\u5317\u77012020\u5E74\u9AD8\u8003\u5E94\u6025\u673A\u6784",
"id": "18",
"親ID": "18",
"ノードタイプ": 0,
「アイコン」: null、
「子供達」: [{
"ラベル": "\u4E2D\u5FC3\u94F6\u884C",
"id": "A06E0C6FFB29198EE053437CA8C07A48",
"親ID": "18",
"ノードタイプ": 1,
"アイコン": "el-icon-monitor",
「子供」: null、
"端末タイプ": 0,
"端末番号": "769025",
"シリアル番号": "7D1846124E640764"
}, {
「ラベル」: "\u6B66\u6C49\u5E02\u4E00\u4E2D\u8003\u70B9\u5E94\u6025\u529E",
"id": "20",
"親ID": "18",
"ノードタイプ": 0,
「アイコン」: null、
「子供達」: [{
「ラベル」: "\u6B66\u6C49\u4E00\u4E2D\u5E94\u6025\u6307\u6325\u4E2D\u5FC3",
"id": "22",
"親ID": "20",
"ノードタイプ": 0,
「アイコン」: null、
「子供」: null
}]
}, {
「ラベル」: "\u6B66\u6C49\u4E8C\u4E2D\u8003\u70B9\u5E94\u6025\u529E",
"id": "21",
"親ID": "18",
"ノードタイプ": 0,
「アイコン」: null、
「子供」: null
}]
}, {
「ラベル」: 「2020\u5E74\u7814\u7A76\u751F\u8003\u8BD5\u5E94\u6025\u673A\u6784」、
"id": "19",
"親ID": "19",
"ノードタイプ": 0,
「アイコン」: null、
「子供達」: [{
"ラベル": "\u738B\u7269\u6D41",
"id": "A0BA62D5108D1565E053437CA8C0C74B",
"親ID": "19",
"ノードタイプ": 1,
"アイコン": "el-icon-user",
「子供」: null、
"端末タイプ": 1,
"端末番号": "15010330199",
"シリアル番号": "15010330199"
}, {
「ラベル」: "\u6B66\u6C49\u8003\u533A",
"id": "27",
"親ID": "19",
"ノードタイプ": 0,
「アイコン」: null、
「子供達」: [{
「ラベル」: "\u6B66\u6C49\u4E00\u533A\u5E94\u6025\u529E",
"id": "28",
"親ID": "27",
"ノードタイプ": 0,
「アイコン」: null、
「子供」: null
}, {
「ラベル」: "\u6B66\u6C49\u4E8C\u533A\u5E94\u6025\u529E",
"id": "41",
"親ID": "27",
"ノードタイプ": 0,
「アイコン」: null、
「子供」: null
}]
}]
}, {
「ラベル」: "\u6E56\u5317\u77012019\u5E74\u9AD8\u8003\u5E94\u6025",
"id": "26",
"親ID": "26",
"ノードタイプ": 0,
「アイコン」: null、
「子供」: null
}]
}背景コード
パッケージ com.itechhero.app.module.edu.meet.reminder.service;
com.github.pagehelper.PageHelper をインポートします。
com.itechhero.app.module.edu.common.model.TreeBean をインポートします。
com.itechhero.app.module.edu.meet.reminder.mapper.MeetReminderMapper をインポートします。
com.itechhero.app.module.edu.meet.reminder.mapper.ReminderTerminalLinkMapper をインポートします。
com.itechhero.app.module.edu.meet.reminder.model.MeetReminder をインポートします。
com.itechhero.app.module.edu.meet.reminder.model.ReminderTerminalLink をインポートします。
com.itechhero.app.module.edu.meet.reminder.model.TerminalTreeBean をインポートします。
com.itechhero.app.module.edu.terminal.mapper.TerminalMapper をインポートします。
com.itechhero.app.module.edu.terminal.model.Terminal をインポートします。
com.itechhero.app.module.edu.utils.exceptions.ReqException をインポートします。
com.itechhero.app.module.edu.utils.req.CMap をインポートします。
com.itechhero.app.module.edu.utils.req.PageData をインポートします。
com.itechhero.app.module.edu.utils.req.ResBean をインポートします。
com.itechhero.app.module.edu.xylink.api.reminder.ReminderApi をインポートします。
com.itechhero.app.module.edu.xylink.util.Result をインポートします。
lombok.extern.slf4j.Slf4j をインポートします。
org.springframework.beans.factory.annotation.Autowired をインポートします。
org.springframework.stereotype.Service をインポートします。
org.springframework.transaction.annotation.Transactional をインポートします。
java.util.ArrayList をインポートします。
java.util.List をインポートします。
java.util.Map をインポートします。
/**
* 会議予約サービス* 著者: Wu Bo* 時間: 2020-03-09 17:28
※ペンネーム：その年の秋ナス^^
*/
翻訳者
@サービス
@トランザクション
パブリッククラスMeetReminderService{
オートワイヤード
プライベート MeetReminderMapper meetReminderMapper;
オートワイヤード
プライベート TerminalMapper ターミナルMapper;
オートワイヤード
プライベートリマインダーターミナルリンクマッパーリマインダーターミナルリンクマッパー;
/**
* 通信端末ツリーを取得 * 著者: Wu Bo * 時間: 2020-03-14 10:32
※ペンネーム：その年の秋ナス^^
*/
パブリックResBean getContacts(Integer ifonlyTerminal) {
リスト<TreeBean> ルート = this.meetReminderMapper.getRootContacts();
ルートの KidContacts を取得します。
ResBean.success(root) を返します。
}
/**
* 端末アドレス帳サブノードを取得* 著者: Wu Bo* 時間: 2020-03-14 11:07
※ペンネーム：その年の秋ナス^^
*/
プライベートvoid getKidContacts(List<TreeBean> ルート、Integer ifonlyTerminal) {
log.info("\n{}", ルート);
(TreeBean treeBean : ルート) {
リスト<TreeBean> kidsContacts = 新しいArrayList<>();
/*ターミナル*/
リスト<TerminalTreeBean> ターミナル連絡先 = this.terminalMapper.getTerminalKidsForTree(treeBean.getId(), ifonlyTerminal);
ターミナルコンタクトが null でターミナルコンタクト.size() が 0 の場合
kidsContacts.addAll(ターミナル連絡先);
}
/*部門*/
リスト<TreeBean> orgKidsContacts = this.meetReminderMapper.getKidsContacts(treeBean.getId());
orgKidsContacts が null で orgKidsContacts.size() が 0 の場合
kidsContacts.addAll(orgKidsContacts);
}
（kidsContacts.size() != 0）の場合{
treeBean.setKids(kidsContacts);
}
子供の連絡先を取得します(子供の連絡先、ターミナルの場合のみ)。
}
}
/**
* 選択した端末を取得* 著者: Wu Bo* 時間: 2020-03-14 21:36
※ペンネーム：その年の秋ナス^^
*/
パブリックResBean getTerminals(CMapパラメータ) {
リスト<CMap> list=this.reminderTerminalLinkmapper.getTerminals(param);
log.info("\n[スケジュールされた電話会議の端末デバイスを取得する]\n{}",list);
ResBean.success(リスト)を返します。
}
}マッパー.xml
<!-- アドレス帳を取得する -->
<select id="getRootContacts" resultType="com.itechhero.app.module.edu.common.model.TreeBean">
選択
ID||'' AS "id",
YJJGMC AS "ラベル"、
FBMID||'' を "parentId" として、
0 を「nodeType」として - フロントエンドが YJ_ZB_ZBJG から選択できるかどうかを判断するため
1=1 かつ ID=FBMID
</選択>
<!-- アドレス帳の子ノードを取得します -->
<select id="getKidsContacts" resultType="com.itechhero.app.module.edu.common.model.TreeBean">
選択
ID||'' AS "id",
YJJGMC AS "ラベル"、
FBMID||'' を "parentId" として、
0 は「nodeType」
YJ_ZB_ZBJGより
1=1の場合
AND ID||'' != #{parentId}
FBMID||'' = #{parentId}
</選択>
<!-- 端末のアドレス帳 TREE を取得します -->
<select id="getTerminalKidsForTree" resultType="com.itechhero.app.module.edu.meet.reminder.model.TerminalTreeBean">
選択
IDを「id」として、
TERMINAL_NAMEを「ラベル」として、
ターミナルタイプ、
ターミナル番号、
シリアル番号、
ORG_ID||'' を "parentId" として、
1 は「nodeType」として、
case TERMINAL_TYPE -- フロントエンドのアイコンを設定します（データベースへの直接書き込みを容易にするため、フロントエンドの判断に注意してください）
0 の場合は 'el-icon-monitor'
そうでなければ 'el-icon-user' は "icon" として終了します
YJ_TERMINALから
ここで1=1
および ORG_ID||'' =#{parentId}
<if テスト="ifonlyTerminal==1">
TERMINAL_TYPE = 0 の場合
</if>
</選択>以上がこの記事の全内容です。皆様の勉強のお役に立てれば幸いです。また、123WORDPRESS.COM を応援していただければ幸いです。 以下もご興味があるかもしれません:
|
<<: データディレクトリとmy-default.iniなしでMYSQL5.7.24をインストールし、サービスが起動しない場合に最適なソリューション
>>: CentOS 7 で Python を 3.6.6 にアップグレードした後に発生する yum エラー問題の解決方法の概要
推薦する
MySQLでテーブルインデックスを構築する方法
目次複数の種類のフィルタリングをサポート複数の範囲のクエリを避ける並べ替えを最適化するインデックスの...
Vue3 の ref toRef と toRefs の違いを理解する方法
目次1. 基本1.参照2. 参照3. 参照4. 最適な使い方2. 詳細な1. なぜrefが必要なのか...
時間範囲効果を実現するためのJavaScript
この記事では、時間範囲効果を実現するためのJavaScriptの具体的なコードを参考までに紹介します...
docker ログが取得できない問題の解決方法
毎日サービスをチェックしているときに、portainer からコンテナ ログを確認しようとしたところ...
Vue.js プロジェクトの開始方法
目次1. Node.jsとVue 2. ローカル開発環境でフロントエンドのVueプロジェクトを実行す...
JavaScript デザインパターン プロキシパターンの学習
目次概要実装保護エージェント仮想エージェント画像の遅延読み込みを実現する仮想プロキシ概要プロキシ パ...
Linux でユーザーを完全に削除する 2 つの方法
Linux 操作実験環境: Centos7 仮想マシンまず、共通ユーザーgubeiqingを作成しま...
Vue のループフォーム項目例の詳細な説明
場合によっては、ユーザーがボタンをクリックして同様のフォームを追加し、クリックごとに 1 回追加でき...
JavaScriptの知識ポイントの詳しい説明
目次1. JavaScriptの基礎2. 基本的なJavaScript構文3. JavaScript...
ウェブフロントエンド開発の細部
1 選択タグは閉じられている必要があります <select></select>...
ウェブサイトのコンテンツが検索エンジンに含まれないようにする方法
通常、Web サイトを構築する目的は、検索エンジンにインデックス登録してもらい、プロモーションを拡大...
Linux インストール Apache サーバー構成プロセス
袋を用意するインストールApacheがすでにインストールされているかどうかを確認するrpm -qa ...
MySQL トランザクション分離はどのように実現されますか?
目次同時シナリオ書き込む読む読む読み取り-書き込みと書き込み-読み取りMySQL のロック行レベルロ...
vscodeで保存した後のHTML自動フォーマットの問題を解決する
vsCode のバージョンは最近更新され、現在のバージョン番号は 1.43 です。実際、vsCode...
VMware 仮想マシンのインストール Apple Mac OS の超詳細なチュートリアル
目次要約する仕事の都合で Apple の Mac OS に対応するソフトウェアをインストールする必要...