【21】淘宝sdk——入门实战之客服模块

这里我们要弄一个客服模块，光有产品，没有客服，那怎么赚钱啊，所以，我们的客服就来了

这里的我们的客服模块是950通栏布局

首页也是在控制台中创建我们的客服模块kefu01

再在index.php中写我们的模块

<!-- 950通栏0 -->
<div class="layout grid-m">
<div class="main_01_modules J_TRegion">
<?php $main_01_modules = array(
array('id' => 'kefu01', domId => "kefu_01"), // 客服模块
);
echo include_modules('main_01_modules', $main_01_modules);//引号里是坑名，后面是变量名
?>
</div>

</div>

打开我们创建的客服模块（kefu01.php）写代码

<div class="box J_TBox" <?php echo $_MODULE_TOOLBAR?>>
<div class="kefu950">
<div class="kefu_left">
<div class="keftu_top">
<strong>售前咨询：</strong>
<ul>
<?php
//explode函数是php用用来分割数组的，这里是用“|”来分割引入的数组，当然在网上也有很多是用“，”来分割的，看个人喜欢吧
$WWID_1 = explode('|',$_MODULE['wwid_1']);
$NAME_1 = explode('|',$_MODULE['name_1']);
for ($i=0;$i<count($WWID_1);$i++) {
if (!$WWID_1[$i]==null){
echo '<li><span>'.$NAME_1[$i].':</span>'.$uriManager->supportTag($WWID_1[$i],'点击这里给我发消息',$_MODULE['kefu_style_1'],$_MODULE['kefu_fenliu_1']).'</li>';
}else{
echo '<li><span>NANE:</span>'.$uriManager->supportTag('菲戈之家','点击这里给我发消息',$_MODULE['kefu_style'],$_MODULE['kefu_fenliu']).'</li>';
}
}
?>
</ul>
</div>
<div class="keftu_down">
<strong>售后查件：</strong>
<ul>
<?php
$WWID_2 = explode('|',$_MODULE['wwid_2']);
$NAME_2 = explode('|',$_MODULE['name_2']);
for ($i=0;$i<count($WWID_2);$i++) {
if (!$WWID_2[$i]==null){
echo '<li><span>'.$NAME_2[$i].':</span>'.$uriManager->supportTag($WWID_2[$i],'点击这里给我发消息',$_MODULE['kefu_style_2'],$_MODULE['kefu_fenliu']).'</li>';
}else{
echo '<li><span>NANE:</span>'.$uriManager->supportTag('菲戈之家','点击这里给我发消息',$_MODULE['kefu_style_2'],$_MODULE['kefu_fenliu_2']).'</li>';
}
}
?>
</ul>
</div>
</div>
<div class="kefu_right">
<div class="kefu_right_top"><?php echo $_MODULE['kefu_time'] ?></div>
<div class="kefu_right_down"><?php echo $_MODULE['kefu_tel'] ?></div>
</div>
</div>
</div>

写下我们的功能吧，打开 module.xml

<?xml version="1.0" encoding="GBK" standalone="yes"?>
<module xsi:noNamespaceSchemaLocation="http://www.cnblogs.com/../module.xsd" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
<id>kefu01</id>
<name>950客服</name>
<file>kefu01.php</file>
<thumbnail>assets/images/index.png</thumbnail>
<description>950客服</description>
<requiredCache>true</requiredCache>
<parameters>
<param label="◆售后服务旺旺风格┏" formType="select" readonly="false" description="请选择旺旺风格" ptype="number" name="kefu_style_1">
<option selected="selected" value="2">风格二</option>
<option value="1">风格一</option>
</param>
<param label="售前客服名称组┠" formType="textarea" readonly="false" description="在此输入客服名用|号分割" ptype="text" name="name_1">
苹果|橘子|芒果|香蕉|橙子|西瓜|柑橘
</param>
<param label="售前旺旺ID组┠" formType="textarea" readonly="false" description="在此输入旺旺ID用|号分割" ptype="text" name="wwid_1">
幸福魔方527:柠檬|菲戈:橘子|菲戈:芒果|菲戈:香蕉|菲戈:橙子|菲戈:西瓜|菲戈:柑橘
</param>
<param label="是否需要E客服分流┗" formType="select" readonly="false" description="如果是E客服主号，请选择是否需要分流" ptype="text" name="kefu_fenliu_1">
<option selected="selected" value="false">不分流</option>
<option value="true">分流</option>
</param>
<param label="★售后服务旺旺风格┏" formType="select" readonly="false" description="请选择旺旺风格" ptype="number" name="kefu_style_2">
<option selected="selected" value="1">风格一</option>
<option value="2">风格二</option>
</param>
<param label="阿里旺旺账号ID┠" formType="textarea" readonly="false" description="在此输入客服名用|号分割" ptype="text" name="name_2">
苹果|橘子
</param>
<param label="客服名字┠" formType="textarea" readonly="false" description="在此输入旺旺ID用|号分割" ptype="text" name="wwid_2">
幸福魔方527:柠檬|菲戈:橘子
</param>
<param label="是否需要E客服分流┗" formType="select" readonly="false" description="如果是E客服主号，请选择是否需要分流" ptype="text" name="kefu_fenliu_2">
<option selected="selected" value="false">不分流</option>
<option value="true">分流</option>
</param>
<param label="右侧公告内容┏" formType="text" readonly="false" description="┓请输入网店在线时间【字数不宜过多】" ptype="text" name="kefu_time">
在线时间：9--17:30 (周六休息)
</param>
<param label="右侧公告内容┗" formType="text" readonly="false" description="┛请输入网店联系电话【字数不宜过多】" ptype="text" name="kefu_tel">
联系电话：400-616-1008
</param>
</parameters>
</module>

css样式

.kefu950{background:url(../images/kefu/kefu.jpg) no-repeat;border: 1px solid #DDDDDD;height: 65px;overflow: hidden;width: 948px;}
.kefu_left{display: inline;float: left;width: 560px;height: 65px;margin-left: 90px;overflow: hidden;}
.keftu_top{border-bottom: 1px dotted #CCCCCC;overflow: hidden;}
.keftu_top,.keftu_down{float: left;height: 32px;line-height: 32px;width: 560px;}
.keftu_top strong,.keftu_down strong{color: #666666;display: inline;float: left;margin-left: 12px;}
.keftu_top ul li,.keftu_down ul li{float: left;padding: 0 10px;}
.kefu_right{display: inline;float: right;height: 65px;margin-right: 5px;overflow: hidden;width: 195px;}
.kefu_right_top{ border-bottom: 1px dotted #CCCCCC;float: left;font-size: 12px;height: 32px;line-height: 32px;text-align: center;width: 195px;}
.kefu_right_down{float: left;font-size: 12px;height: 32px;line-height: 32px;text-align: center;width: 195px;}

最后，我们出来的效果是这样的



用到的素材如下：



好了，我们的客服模块也出来了