Skip to content

Commit 6fcaf99

Browse files
Mds92Mds92
committed
preparation
1 parent 46c964f commit 6fcaf99

8 files changed

Lines changed: 3016 additions & 446 deletions

‎demo/demo.html‎

Lines changed: 24 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -14,10 +14,10 @@
1414
</head>
1515

1616
<body class="bg-light">
17-
<div class="container-fluid">
17+
<div class="container-fluid" id="vueAppOptions">
1818
<h1 class="h2">MD BootstrapPersianDateTimePicker Demo</h1>
1919
<div class="row">
20-
<div class="col-md-4" id="vueAppOptions">
20+
<div class="col-md-4">
2121
<div class="container-fluid bg-white">
2222
<div class="row">
2323
<div class="col-12">
@@ -29,13 +29,12 @@ <h2>Options</h2>
2929
<div class="col-7 pt-2">
3030
<div class="form-check form-check-inline">
3131
<input class="form-check-input" type="radio" name="disabledRadioOptions"
32-
id="disabledRadioOptionsId1" value="true" onchange="optionOnChange('disabled', this.value)">
32+
id="disabledRadioOptionsId1" value="1" v-model="disabled" v-on:change="optionChange('disabled', true)">
3333
<label class="form-check-label" for="disabledRadioOptionsId1">true</label>
3434
</div>
3535
<div class="form-check form-check-inline">
3636
<input class="form-check-input" type="radio" name="disabledRadioOptions"
37-
id="disabledRadioOptionsId2" value="false" onchange="optionOnChange('disabled', this.value)"
38-
checked>
37+
id="disabledRadioOptionsId2" value="0" v-model="disabled" v-on:change="optionChange('disabled', false)">
3938
<label class="form-check-label" for="disabledRadioOptionsId2">false</label>
4039
</div>
4140
</div>
@@ -47,13 +46,12 @@ <h2>Options</h2>
4746
<div class="col-7 pt-2">
4847
<div class="form-check form-check-inline">
4948
<input class="form-check-input" type="radio" name="isGregorianRadioOptions"
50-
id="isGregorianRadioOptionsId1" value="true" onchange="optionOnChange('isGregorian', this.value)">
49+
id="isGregorianRadioOptionsId1" value="1" v-model="isGregorian">
5150
<label class="form-check-label" for="isGregorianRadioOptionsId1">true</label>
5251
</div>
5352
<div class="form-check form-check-inline">
5453
<input class="form-check-input" type="radio" name="isGregorianRadioOptions"
55-
id="isGregorianRadioOptionsId2" value="false" onchange="optionOnChange('isGregorian', this.value)"
56-
checked>
54+
id="isGregorianRadioOptionsId2" value="0" v-model="isGregorian" checked>
5755
<label class="form-check-label" for="isGregorianRadioOptionsId2">false</label>
5856
</div>
5957
</div>
@@ -65,12 +63,12 @@ <h2>Options</h2>
6563
<div class="col-7 pt-2">
6664
<div class="form-check form-check-inline">
6765
<input class="form-check-input" type="radio" name="inLineRadioOptions" id="inLineRadioOptionsId1"
68-
value="true" onchange="optionOnChange('inLine', this.value)">
66+
value="1" v-model="inLine">
6967
<label class="form-check-label" for="inLineRadioOptionsId1">true</label>
7068
</div>
7169
<div class="form-check form-check-inline">
7270
<input class="form-check-input" type="radio" name="inLineRadioOptions" id="inLineRadioOptionsId2"
73-
value="false" onchange="optionOnChange('inLine', this.value)" checked>
71+
value="0" v-model="inLine">
7472
<label class="form-check-label" for="inLineRadioOptionsId2">false</label>
7573
</div>
7674
</div>
@@ -82,13 +80,12 @@ <h2>Options</h2>
8280
<div class="col-7 pt-2">
8381
<div class="form-check form-check-inline">
8482
<input class="form-check-input" type="radio" name="modalModeRadioOptions"
85-
id="modalModeRadioOptionsId1" value="true" onchange="optionOnChange('modalMode', this.value)">
83+
id="modalModeRadioOptionsId1" value="1" v-model="modalMode">
8684
<label class="form-check-label" for="modalModeRadioOptionsId1">true</label>
8785
</div>
8886
<div class="form-check form-check-inline">
8987
<input class="form-check-input" type="radio" name="modalModeRadioOptions"
90-
id="modalModeRadioOptionsId2" value="false" onchange="optionOnChange('modalMode', this.value)"
91-
checked>
88+
id="modalModeRadioOptionsId2" value="0" v-model="modalMode" checked>
9289
<label class="form-check-label" for="modalModeRadioOptionsId2">false</label>
9390
</div>
9491
</div>
@@ -100,14 +97,12 @@ <h2>Options</h2>
10097
<div class="col-7 pt-2">
10198
<div class="form-check form-check-inline">
10299
<input class="form-check-input" type="radio" name="enableTimePickerInlineRadioOptions"
103-
id="enableTimePickerInlineRadioOptionsId1" value="true"
104-
onchange="optionOnChange('enableTimePicker', this.value)">
100+
id="enableTimePickerInlineRadioOptionsId1" value="1" v-model="enableTimePicker">
105101
<label class="form-check-label" for="enableTimePickerInlineRadioOptionsId1">true</label>
106102
</div>
107103
<div class="form-check form-check-inline">
108104
<input class="form-check-input" type="radio" name="enableTimePickerInlineRadioOptions"
109-
id="enableTimePickerInlineRadioOptionsId2" value="false"
110-
onchange="optionOnChange('enableTimePicker', this.value)" checked>
105+
id="enableTimePickerInlineRadioOptionsId2" value="0" v-model="enableTimePicker">
111106
<label class="form-check-label" for="enableTimePickerInlineRadioOptionsId2">false</label>
112107
</div>
113108
</div>
@@ -119,12 +114,12 @@ <h2>Options</h2>
119114
<div class="col-7 pt-2">
120115
<div class="form-check form-check-inline">
121116
<input class="form-check-input" type="radio" name="toDateFromDateRadioOptions"
122-
id="toDateRadioOptionsId1" value="true" onchange="optionOnChange('toDate', this.value)">
117+
id="toDateRadioOptionsId1" value="1" v-model="toDateFromDate">
123118
<label class="form-check-label" for="toDateRadioOptionsId1">true</label>
124119
</div>
125120
<div class="form-check form-check-inline">
126121
<input class="form-check-input" type="radio" name="toDateFromDateRadioOptions"
127-
id="toDateRadioOptionsId2" value="false" onchange="optionOnChange('toDate', this.value)" checked>
122+
id="toDateRadioOptionsId2" value="0" v-model="toDateFromDate">
128123
<label class="form-check-label" for="toDateRadioOptionsId2">false</label>
129124
</div>
130125
</div>
@@ -134,7 +129,8 @@ <h2>Options</h2>
134129
<div class="row">
135130
<label class="col-5 col-form-label">groupId</label>
136131
<div class="col-7 pt-2">
137-
<input class="form-control form-control-sm" type="text" value="group1" data-name="group-id" readonly>
132+
<input class="form-control form-control-sm" type="text" value="group1"
133+
:readonly="toDateFromDate == '0'">
138134
</div>
139135
</div>
140136
<hr>
@@ -144,14 +140,12 @@ <h2>Options</h2>
144140
<div class="col-7 pt-2">
145141
<div class="form-check form-check-inline">
146142
<input class="form-check-input" type="radio" name="rangeSelectorRadioOptions"
147-
id="rangeSelectorRadioOptionsId1" value="true"
148-
onchange="optionOnChange('rangeSelector', this.value)">
143+
id="rangeSelectorRadioOptionsId1" value="1" v-model="rangeSelector">
149144
<label class="form-check-label" for="rangeSelectorRadioOptionsId1">true</label>
150145
</div>
151146
<div class="form-check form-check-inline">
152147
<input class="form-check-input" type="radio" name="rangeSelectorRadioOptions"
153-
id="rangeSelectorRadioOptionsId2" value="false"
154-
onchange="optionOnChange('rangeSelector', this.value)" checked>
148+
id="rangeSelectorRadioOptionsId2" value="0" v-model="rangeSelector">
155149
<label class="form-check-label" for="rangeSelectorRadioOptionsId2">false</label>
156150
</div>
157151
</div>
@@ -163,11 +157,11 @@ <h2>Options</h2>
163157
<div class="col-2"></div>
164158
<div class="col-2 pt-2">
165159
<input class="form-control form-control-sm" type="number" min="0" max="3" value="0"
166-
data-name="rangeSelectorMonthsToShow-start" readonly style="width: 50px;">
160+
:readonly="rangeSelector == '0'" v-model="rangeSelectorMonthsToShowStart" style="width: 50px;">
167161
</div>
168162
<div class="col-2 pt-2">
169163
<input class="form-control form-control-sm" type="number" min="0" max="3" value="0"
170-
data-name="rangeSelectorMonthsToShow-end" readonly style="width: 50px;">
164+
:readonly="rangeSelector == '0'" v-model="rangeSelectorMonthsToShowEnd" style="width: 50px;">
171165
</div>
172166
</div>
173167
<hr>
@@ -176,8 +170,7 @@ <h2>Options</h2>
176170
<label class="col-5 col-form-label">textFormat</label>
177171
<div class="col-7 pt-2">
178172
<div class="input-group input-group-sm">
179-
<input class="form-control form-control-sm" type="text" data-name="text-format"
180-
onchange="optionOnChange('textFormat', this.value)">
173+
<input class="form-control form-control-sm" type="text" v-model="textFormat">
181174
<span class="input-group-text cursor-pointer" data-bs-toggle="modal"
182175
data-bs-target="#textDateFormatModal">Detail</span>
183176
</div>
@@ -189,8 +182,7 @@ <h2>Options</h2>
189182
<label class="col-5 col-form-label">dateFormat</label>
190183
<div class="col-7 pt-2">
191184
<div class="input-group input-group-sm">
192-
<input class="form-control form-control-sm" type="text" data-name="date-format"
193-
onchange="optionOnChange('dateFormat', this.value)">
185+
<input class="form-control form-control-sm" type="text" v-model="dateFormat">
194186
<span class="input-group-text cursor-pointer" data-bs-toggle="modal"
195187
data-bs-target="#textDateFormatModal">Detail</span>
196188
</div>
@@ -201,16 +193,15 @@ <h2>Options</h2>
201193
<div class="row">
202194
<label class="col-5 col-form-label">yearOffset</label>
203195
<div class="col-7 pt-2">
204-
<input class="form-control form-control-sm" type="number" value="15" min="0" data-name="yearOffset"
205-
onchange="optionOnChange('yearOffset', this.value)">
196+
<input class="form-control form-control-sm" type="number" value="15" min="0" v-model="yearOffset">
206197
</div>
207198
</div>
208199
<hr>
209200
<!-- placement -->
210201
<div class="row">
211202
<label class="col-5 col-form-label">placement</label>
212203
<div class="col-7 pt-2">
213-
<select class="form-select form-select-sm" onchange="optionOnChange('placement', this.value)">
204+
<select class="form-select form-select-sm" v-model="placement">
214205
<option value="auto">auto</option>
215206
<option value="top">top</option>
216207
<option value="bottom" selected>bottom</option>

0 commit comments

Comments
 (0)