119 lines
4.0 KiB
HTML
119 lines
4.0 KiB
HTML
<form class="layui-form eject-layuiBox" data-action="/book/addReadingBook">
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">书籍分类</label>
|
|
<div class="layui-input-block">
|
|
<select lay-filter="category" id="category">
|
|
<option value="">全部</option>
|
|
{foreach $categoryList as $cate}
|
|
<option value="{$cate.id}">{$cate.name}</option>
|
|
{/foreach}
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">书籍</label>
|
|
<div class="layui-input-block">
|
|
<div id="book"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">状态</label>
|
|
<div class="layui-input-block">
|
|
<select name="status">
|
|
<option value="to-read">待阅读</option>
|
|
<option value="reading">阅读中</option>
|
|
<option value="finished">已阅读</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">开始</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" name="start" class="layui-input" id="start" placeholder="yyyy-MM-dd">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">结束</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" name="end" class="layui-input" id="end" placeholder="yyyy-MM-dd">
|
|
</div>
|
|
</div>
|
|
<div class="layui-form-item">
|
|
<label class="layui-form-label">备注</label>
|
|
<div class="layui-input-block">
|
|
<input type="text" name="remark" placeholder="文本框" class="layui-input">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="layui-input-block">
|
|
<button type="button" class="layui-btn layui-btn-sm" lay-submit lay-filter="submitAll">保存</button>
|
|
</div>
|
|
<input type="hidden" name="reading_id" value="{$readingID}" />
|
|
</form>
|
|
|
|
<script src="/js/xm-select.js"></script>
|
|
<script>
|
|
|
|
$(document).ready(function(){
|
|
var form = layui.form;
|
|
var laydate = layui.laydate;
|
|
var dropdown = layui.dropdown;
|
|
|
|
laydate.render({
|
|
elem: '#start'
|
|
});
|
|
laydate.render({
|
|
elem: '#end'
|
|
});
|
|
|
|
var book = xmSelect.render({
|
|
el: '#book',
|
|
filterable : true, //开启搜索
|
|
remoteSearch: true,
|
|
radio : true, //开启单选模式
|
|
clickClose : true, //是否点击选项后自动关闭下拉框
|
|
name: 'book_id', //表单提交时的name
|
|
paging: true,
|
|
data : [],
|
|
remoteMethod: function(val, cb, show){
|
|
var categoryID = $('#category').val();
|
|
$.get('/book/apiGetList', {'category_id': categoryID, 'name':val, 'size': 50}, function(data){
|
|
var bookList = [];
|
|
data.bookList.data.forEach(element => {
|
|
var name = element.name + '【' + element.category_name + '】';
|
|
if(element.author != ''){
|
|
name += '【' + element.author + '】';
|
|
}
|
|
bookList.push({
|
|
name: name,
|
|
value: element.id
|
|
})
|
|
});
|
|
cb(bookList);
|
|
})
|
|
}
|
|
});
|
|
|
|
form.on('select(category)',function(data){
|
|
var categoryID = data.value;
|
|
$.get('/book/apiGetList', {'category_id': categoryID, 'size': 50}, function(data){
|
|
var bookList = [];
|
|
data.bookList.data.forEach(element => {
|
|
var name = element.name + '【' + element.category_name + '】';
|
|
if(element.author != ''){
|
|
name += '【' + element.author + '】';
|
|
}
|
|
bookList.push({
|
|
name: name,
|
|
value: element.id
|
|
})
|
|
});
|
|
book.update({data: bookList});
|
|
})
|
|
})
|
|
});
|
|
|
|
</script> |