yijia-webman/app/view/book/editReadingBook.html

135 lines
4.7 KiB
HTML

<form class="layui-form eject-layuiBox" data-action="/book/editReadingBook">
<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 style="color:red;">{$book.name}</div>
<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 {if $readingBook.status == 'to-read'}selected{/if} value="to-read">待阅读</option>
<option {if $readingBook.status == 'reading'}selected{/if} value="reading">阅读中</option>
<option {if $readingBook.status == 'finished'}selected{/if} 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" class="layui-input" id="start" name="start" value="{$readingBook.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" class="layui-input" id="end" name="end" value="{$readingBook.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" value="{$readingBook.remark}" />
</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="id" value="{$readingBook.id}" />
</form>
<script src="/js/xm-select.js"></script>
<script>
$(document).ready(function(){
var form = layui.form;
var laydate = layui.laydate;
var dropdown = layui.dropdown;
var initValue = ["{$readingBook.book_id}"];
var bookID = {$readingBook.book_id};
console.log(bookID);
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 : [],
initValue: initValue,
remoteMethod: function(val, cb, show){
var categoryID = $('#category').val();
$.get('/book/apiGetList', {'category_id': categoryID, 'name':val, 'size': 500}, function(data){
var bookList = [];
data.bookList.data.forEach(element => {
var name = element.name + '【' + element.category_name + '】';
if(element.author != ''){
name += '【' + element.author + '】';
}
if(element.id == bookID){
bookList.push({
name: name,
value: element.id,
selected: true
});
}else{
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>