DiscuzⅩ3.4万能相册编辑插件
<!--
作者：青花
时间：2020年06月06日
转载请注明：https://wdc.store
终于，在休息了几天之后，对相册编辑功能进行了开发，已经写完了，下面是完整代码。使用方法：
1.创建文件空的spacecp_album.txt，然后将以下代码复制粘贴，保存之后，修改后缀为htm，即：spacecp_album.htm，如果您使用的模板是php后缀的，改成php即可；
2.mobeli和touch版都是直接替换：网站根目录/template/模板目录/home/spacecp_album.htm预览图：单页插件代码如下：
-->
<style type="text/css">
#bq{ /*head自定义背景框*/
width:97%;
height:45px;
background-color:#EE3B3B;
border-radius:5px;
position: absolute;
left:6px;
top:2px;
text-align:center;
}
#h2{ /*自定义head标题*/
color:#fff;
line-height:48px;
font-size:20px;
text-decoration:none;
}
#a_l{ /*返回按钮*/
position: absolute;
left:12px;
font-size:18px;
text-decoration:none;
}
#a_r{ /*上传按钮*/
position: absolute;
right:12px;
font-size:18px;
color:#fff;
text-decoration:none;
}
.kuang{ /*顶层通用框体*/
border-radius:5px;
border:2px solid #FFBF00;
width:96%;
font-size:16px;
color:#0080FF;
margin:0 auto;
margin-top:10px;
}
.up_kuang{ /*第一个菜单列表子框*/
border:3px inset #fff013;
border-radius:5px;
width:auto;
height:60;
background-color:#FFD700;
margin:2px 2px 2px 2px;}
.ul{
line-height:60px;
text-align: center;
}
.li_lib_b { /*第一个主菜单*/
list-style:none;
float:left;
width:25%;
}
.li_lib_a { /*图片编辑提示语*/
text-align: center;
color:#836FFF;
}
.up_kuang2{ /*图片编辑第三个框体*/
border-radius:4px;
overflow-x:auto;
width:auto;
background-color:#C6E2FF;
padding:10px 10px 10px 10px;
}
.ms_kuang{/*图片描述框体*/
width:98%;
height:80px;
line-height:40px;
border-radius:5px;
}
.td_t1{ /*表结构td元素*/
width:10%;
text-align: center;
}
.td_t2{ /*表结构td元素*/
width:20%;
text-align: center;
}
.td_t3{ /*表结构td元素*/
width:30%;
text-align: center;
}
.td_t4{ /*表结构td元素*/
width:40%;
text-align: center;
}
.td_img{ /*表结构图片样式*/
border:3px inset #fff;
margin:5px 5px 5px 10px;
border-radius:5px;
}
.td_box{ /*表结构盒子*/
height:30px;
background-color:#EE3B3B;
border-radius:5px;
}
.th_cd{ /*相册编辑-表结构td元素*/
width:28%;
height:40px;
padding-left:10px;
}
.td_cd{ /*相册编辑-表结构td元素*/
border:3px inset #FFBF00;
border-radius:5px;
width:97.5%;
height:30px;
background:#BEF781;
outline:none;
font-size:18px;
color:#FF0040;
text-align:center;
margin-left:3px;
}
.td3_cd{ /*相册编辑-表结构td元素*/
border:3px inset #FFBF00;
margin:3px 3px 3px 3px;
border-radius:5px;
width:97.5%;
height:35px;
background:#BEF781;
outline:none;
font-size:18px;
color:#FA5882;
}
#red{ /*查看相册 菜单颜色*/
color:#EE30A7;
background-color:#fff;
border-radius:5px;
padding:5px 5px 3px 5px;
font-size:14px;
border:3px inset #fff013;
}
#blue{ /*编辑相册 菜单颜色*/
color:#1E90FF;
background-color:#fff;
border-radius:5px;
padding:5px 5px 3px 5px;
font-size:14px;
border:3px inset #fff013;
}
#green{ /*相册列表 菜单颜色*/
color:#43CD80;
background-color:#fff;
border-radius:5px;
padding:5px 5px 3px 5px;
font-size:14px;
border:3px inset #fff013;
}
#purple{ /*编辑图片 菜单颜色*/
color:#836FFF;
background-color:#fff;
border-radius:5px;
padding:5px 5px 3px 5px;
font-size:14px;
border:3px inset #fff013;
}
.fm_btn{ /*编辑和上传按钮样式*/
padding:4px 3px 2px 6px;
background-color:#1E90FF;
margin:5px 15px 5px 15px;
color:#fff;
border-radius:5px;
border:2px inset #1E90FF;
}
.fm_btn1{ /*编辑和上传按钮样式*/
padding:4px 4px 0px 4px;
background-color:#1E90FF;
color:#fff;
border-radius:5px;
border:2px inset #1E90FF;
}
.fm_btn2{ /*编辑和上传按钮样式*/
line-height:30px;
padding:4px 4px 0px 4px;
height:30px;
background-color:#fff;
color:black;
border-radius:5px;
border:2px inset #1E90FF;
}
.b_btn2{ /*确认修改按钮*/
padding:2px 4px 2px 4px;
background-color:#1E90FF;
margin:0px 2px 0px 2px;
color:#fff;
border-radius:5px;
border:2px inset #1E90FF;
font-size:12px;
}
.b_btn3{ /*删除相册按钮*/
padding:4px 4px 4px 4px;
background-color:#1E90FF;
margin:0px 2px 0px 2px;
color:#fff;
border-radius:5px;
border:2px inset #1E90FF;
font-size:12px;
font-weight: bold;
}
</style>
<!--{eval $_G[home_tpl_titles] = array($album[albumname], '{lang album}');}-->
<!--{template common/header}-->
<!--{if $_GET['op'] == 'edit'}-->
<!--第一分页：编辑相册 -->
<!--独立head-->
<header>
<div id="bq">
<center>
<!--{if $space[uid]==$_G[uid]}-->
<h2 id="h2">编辑相册
<!--{/if}-->
<span id="a_l" onClick="javascript :history.back(-1);">返回</span> <a href="home.php?mod=space&do=album&view=me" id="a_r">我的相册</a>
</h2>
</center>
</div> </header>
<!--第一分页：头部菜单 -->
<div class="kuang">
<div class="up_kuang">
<ul class="ul"> <!--{eval $aid = $albumid ? $albumid : -1;}-->
<li clli_lib_b"><a id="red" href="home.php?mod=space&uid=$album[uid]&do=album&id=$aid">查看相册</a></li>
<li class="li_lib_b" {if $_GET['op']=='edit'} class="a"{/if}><a id="blue" href="home.php?mod=spacecp&ac=album&op=edit&albumid=$albumid">编辑相册</a></li>
<li class="li_lib_b" {if $_GET['op']=='editpic'} class="a"{/if}><a id="purple" href="home.php?mod=spacecp&ac=album&op=editpic&albumid=$albumid">编辑图片</a></li> <li class="li_lib_b" ><a id="green" href="home.php?mod=space&uid=$album[uid]&do=album&view=me">相册列表</a></li>
</ul>
</div>
</div>
<!--第一分页：相册编辑功能区 -->
<div class="kuang">
<div class="up_kuang2"> <form method="post" autocomplete="off" id="theform" name="theform" action="home.php?mod=spacecp&ac=album&op=edit&albumid=$albumid"> <table> <tr class="tr_cd"> <th class="th_cd">
<label for="albumname">相册名称</label>
</th> <td class="td_box_cd"><input type="text" id="albumname" name="albumname" value="$album[albumname]" size="20" class="td_cd" /></td> </tr> <tr> <th class="th_cd">
<label for="depict">相册描述</label>
</th> <td class="td_box_cd">
<input name="depict" id="depict" class="td_cd" cols="40" rows="3" value="$album[depict]" />
</td> </tr>
<!--{if $categoryselect}--> <tr> <th class="th_cd">社区分类</th> <td class="td_box_cd"> $categoryselect </td> </tr>
<!--{/if}--> <tr> <th class="th_cd">隐私设置</th> <td class="td_box_cd"> <select name="friend" onchange="passwordShow(this.value);" class="td3_cd"> <option value="0"$friendarr[0]>所有人可见</option> <option value="1"$friendarr[1]>仅好友可见</option> <option value="2"$friendarr[2]>仅指定可见</option> <option value="3"$friendarr[3]>仅自己可见</option> <option value="4"$friendarr[4]>输密码可见</option> </select> </td> </tr> <tbody id="span_password" style="$passwordstyle"> <tr> <th class="th_cd">访问密码</th> <td class="td_box_cd">
<input type="text" name="password" id="uploadpassword" value="$album[password]" size="10" class="td_cd" />
</td> </tr> </tbody> <tbody id="tb_selectgroup" style="$selectgroupstyle"> <tr> <th class="th_cd">好友昵称</th> <td class="td_box_cd"> <input name="target_names" id="target_names" rows="3" class="td_cd" value="$album[target_names]" /> </td> </tr> <tr> </tbody> <tr> <th class="th_cd">提交保存</th> <td> <input type="hidden" name="referer" value="{echo dreferer()}" /> <input type="hidden" name="editsubmit" value="true" /> <button name="submit" type="submit" class="b_btn2" value="true"><strong>确认修改</strong></button> </td> </tr>
<tr> <th class="th_cd">其它操作</th> <td><a class="b_btn3" style="color:#fff;" id="album_delete_$album[albumid]" href="home.php?mod=spacecp&ac=album&op=delete&albumid=$album[albumid]&handlekey=delalbumhk_{$album[albumid]}">删除相册</a></td> </tr>
</table>
<input type="hidden" name="formhash" value="{FORMHASH}" />
</form>
</div>
</div>
<!--第一分页：相册编辑JS部分 -->
<script type="text/javascript"> function passwordShow(value) { if(value==4) { document.getElementById('span_password').style.display = ''; document.getElementById('tb_selectgroup').style.display = 'none'; }
else if(value==2) { document.getElementById('span_password').style.display = 'none'; document.getElementById('tb_selectgroup').style.display = ''; }
else { document.getElementById('span_password').style.display = 'none'; document.getElementById('tb_selectgroup').style.display = 'none'; } } function getgroup(gid) { if(gid) { $.ajax({ type:'GET', url:'home.php?mod=spacecp&ac=privacy&inajax=1&op=getgroup&gid='+gid, dataType:'xml' }) .success(function(s) { v = $(s.lastChild.firstChild.nodeValue).find('.show_message').html(); v = v + ' '; document.getElementById('target_names').innerHTML += v; }); } } $('#editsubmit').on('click', function() { var obj = $(this); var form = $(this.form); popup.open('<img src="' + IMGDIR + '/imageloading.gif">'); $.ajax({ type:'POST', url:form.attr('action') +'&inajax=1', data:form.serialize(), dataType:'xml' }) .success(function(s) { popup.open(s.lastChild.firstChild.nodeValue); window.location.href = 'home.php?mod=space&uid=$album[uid]&do=album&id=$albumid'; }) .error(function() { popup.open('{lang networkerror}', 'wic_alert'); });
return false; });
</script>
<!--第二分页：图片编辑 -->
<!--{elseif $_GET['op'] == 'editpic'}-->
<!--第二分页：图片编辑-head -->
<header>
<div id="bq">
<center>
<!--{if $space[uid]==$_G[uid]}--> <h2 id="h2">编辑图片
<!--{/if}-->
<span id="a_l" onClick="javascript :history.back(-1);">返回</span> <a href="home.php?mod=space&do=album&view=me" id="a_r">我的相册</a>
</h2>
</center>
</div>
</header>
<!--第二分页：图片编辑-头部菜单 -->
<div class="kuang">
<div class="up_kuang">
<ul class="ul"> <!--{eval $aid = $albumid ? $albumid : -1;}--> <li class="li_lib_b"><a id="red" href="home.php?mod=space&uid=$album[uid]&do=album&id=$aid">查看相册</a></li>
<li class="li_lib_b" {if $_GET['op']=='edit'} class="a"{/if}><a id="blue" href="home.php?mod=spacecp&ac=album&op=edit&albumid=$albumid">编辑相册</a></li>
<li class="li_lib_b" {if $_GET['op']=='editpic'} class="a"{/if}><a id="purple" href="home.php?mod=spacecp&ac=album&op=editpic&albumid=$albumid">编辑图片</a></li>
<li class="li_lib_b" ><a id="green" href="home.php?mod=space&uid=$album[uid]&do=album&view=me">相册列表</a>
</li>
</ul>
</div>
</div>
<!--第二分页：图片编辑-提示信息 --> <div class="kuang">
<div class="up_kuang2"> <div class="li_lib_a">[温馨提示]封面图的更新不会立即生效</div>
</div>
</div>
<!--第二分页：图片编辑-功能区 -->
<div class="kuang">
<div class="up_kuang2">
<!--{if $list}-->
<form method="post" autocomplete="off" id="theform" name="theform" action="home.php?mod=spacecp&ac=album&op=editpic&albumid=$albumid">
<table>
<th class="td_t1"> 选择 </th>
<td class="td_t2"> 图片 </td>
<td class="td_t3"> 操作 </td>
<td class="td_t4"> 描述 </td>
</table>
<!--{eval $common = '';}-->
<!--{loop $list $value}-->
<li class="li_lib2"> <table> <th class="th">
<input type="checkbox" name="ids[{$value[picid]}]" value="{$value[picid]}" {$value[checked]}> </th>
<td class="td1">
<a href="$value[bigpic]" target="_blank">
<img src="$value[pic]" alt="" width="80" class="td_img" /></a> </td>
<td class="td2">
<!--{eval $ids .= $common.$value['picid'].':'.$value['picid'];}--> <!--{eval $common = ',';}--> <!--{if $album[albumname]}--> <a href="home.php?mod=spacecp&ac=album&op=setpic&albumid=$value[albumid]&picid=$value[picid]&handlekey=setpichk" id="a_picid_$value[picid]" class="dialog fm_btn" style="color:#fff;font-size:14px;display:block;width:16px;height:82px;">设为封面</a>
<!--{/if}--> </td> <td class="td3"> <textarea name="title[{$value[picid]}]" rows="4" cols="70" class="ms_kuang">$value[title] </textarea>
<input type="hidden" name="oldtitle[{$value[picid]}]" value="$value[title]" > </td>
</table>
</li>
<!--{/loop}-->
<div class="up_kuang2"> <li class="li_lib2">
<th class="th1">
<label for="chkall" onclick="checkAll(this.form, 'ids')">
<input type="checkbox" name="chkall" id="chkall" />
</label>
</th>
<td class="td"> <button type="submit" name="editpicsubmit" value="true" class="fm_btn1" onclick="this.form.action+='&subop=update';"><strong>更新描述</strong></button> </td>
<button type="submit" name="editpicsubmit" value="true" class="fm_btn1" onclick="this.form.action+='&subop=delete';return ischeck('theform', 'ids')"><strong>删除</strong></button>
<!--{if $albumlist}-->
<button type="submit" name="editpicsubmit" value="true" class="fm_btn1" onclick="this.form.action+='&subop=move';return ischeck('theform', 'ids')"><strong>移动到</strong></button>
<select name="newalbumid" class="fm_btn2"> <!--{loop $albumlist $key $value}--> <!--{if $albumid != $value[albumid]}-->
<option value="$value[albumid]">$value[albumname]</option>
<!--{/if}-->
<!--{/loop}-->
<!--{if $albumid>0}-->
<option value="0">默认相册</option>
<!--{/if}-->
</select>
<!--{/if}-->
</li>
<input type="hidden" name="page" value="$page" /> <input type="hidden" name="editpicsubmit" value="true" /> <input type="hidden" name="formhash" value="{FORMHASH}" /> </div>
</form>
<!--第二分页：图片编辑-如果没有图片提示 --> <div class="up_kuang2"> <!--{if $multi}--> <div>$multi</div>
<!--{/if}-->
</div>
<!--第二分页：图片编辑-JS部分 --> <script type="text/javascript"> function checkAll(form, name) { for(var i = 0; i < form.elements.length; i++) { var e = form.elements[i]; if(e.name.match(name)) { e.checked = form.elements['chkall'].checked; } } }
function ischeck(id, prefix) { form = document.getElementById(id); for(var i = 0; i < form.elements.length; i++) { var e = form.elements[i]; if(e.name.match(prefix) && e.checked) { if(confirm("您确定要执行本操作吗？")) { return true; } else { return false; } } } popup.open('请选择要操作的对象','wic_alert'); return false; } var picObj = {{$ids}}; function succeedhandle_setpichk(url, msg, values) {
for(var id in picObj) { document.getElementById('a_picid_' + picObj[id]).innerHTML = "{lang set_to_conver}"; } if(values['picid']) { document.getElementById('a_picid_' + values['picid']).innerHTML = "{lang cover_pic}"; } } </script>
<!--{else}-->
<div class="up_kuang2"> <div>抱歉！相册是空的！</div> </div>
<!--{/if}-->
</div>
</div>
<!--第二分页：图片编辑-删除操作的提示 -->
<div class="kuang">
<div class="up_kuang2">
<text>删除提示：<p>如果删除的图片存在于帖子、博客文章中，删除之后将无法正常显示。</text>
</div>
</div>
<!--{/if}-->
<!--{template common/footer}-->
1767
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
