



001-
001+
001-
001+ <img src="{3407.png}" alt="" /><img src="{3408.png}" alt="" /><img src="{3409.png}" alt="" /><img src="{3410.png}" alt="" />
001-
001+ 功能描述
002+ 1.查看四高产品列表
003+ 2.快速浏览产品
004+ 3.将四高产品加入购物车
005+ 4.进入产品详情页面
006+ 界面
007+
008+
009+ 界面元素-产品列表
010+
011+ 名称
012+ 用途
013+ 显示
014+ 交互
015+ 产品列表
016+ 展示四高系列产品
017+
018+ 每行按四个产品内容排列
019+ 内容包含:产品图片+产品名称+价格
020+ 产品无库存时,不显示价格
021+
022+
023+ 1.鼠标悬停至产品,图片内容更换为产品详情并有快速浏览字段
024+ 2.点击产品图片,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener">产品详情页面
025+
026+ 快速浏览
027+ 进入快速浏览页面
028+ 字段:快速浏览
029+ 1.点击快速浏览,进入指定页面
030+ 界面元素-快速浏览
031+
032+ 名称
033+ 用途
034+ 显示
035+ 交互
036+ 产品信息
037+ 展示产品信息
038+
039+ 产品名称,例:健知己-海豹油100粒
040+ 产品价格,例:HK$260.00
041+ 库存单位:LM00001产品图片多张
042+
043+ 1.点击<a href="/zentao/file-read-3401.png" target="_blank" rel="noreferrer noopener">,圆点底色变量并更换产品图片
044+ 数量
045+ 填写购买数量
046+
047+ 输入框,默认为1
048+ 产品无库存时,不显示
049+
050+
051+ 1.鼠标悬停至输入框,<a href="/zentao/file-read-3402.png" target="_blank" rel="noreferrer noopener">点击上下,增加/减少购买数量,最少为1
052+ 2.输入购买数量
053+
054+ 新增到购物车中
055+ 将产品加入购物车
056+
057+ 【新增到购物车中】按钮
058+ 产品有库存时,显示
059+
060+ 1.点击按钮,产品加入至购物车右侧并出现购物车插件页面
061+ 无库存
062+ 告知用户无库存
063+
064+ 字段:无库存,灰色底框
065+ 产品无库存时,显示
066+
067+ 无
068+ 浏览更多详细资料
069+ 查看指定产品详细资料
070+ 字段:浏览更多详细资料
071+ 1.点击字段,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener">产品详情页面
072+ 界面元素-购物车
073+
074+ 名称
075+ 用途
076+ 显示
077+ 交互
078+ <a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener">
079+ 关闭购物车插件
080+ 图标:<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener">
081+
082+ 1.悬停出现字段:关闭购物车插件
083+ 2.点击图标,关闭购物车插件
084+
085+ 浏览购物车
086+ 进入购物车页面
087+ 【浏览购物车】按钮
088+ 1.点击按钮,进入购物车页面
089+ 购物车产品列表
090+ 展示购物车内的产品
091+ 纵向排列,展示产品名称,价格,数量(至少为1),小计金额
092+
093+ 1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener">按钮,点击删除产品
094+ 2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener">点击+/-,更改产品数量,小计金额更改
095+
096+
097+
098+
001-<img src="{3407.png}" alt="" /><img src="{3408.png}" alt="" /><img src="{3409.png}" alt="" /><img src="{3410.png}" alt="" />
001+ <h3 style="color:#3C4353;background-color:#FFFFFF;">功能描述</h3>
002+ <p style="font-size:14px;background-color:#FFFFFF;">1.查看四高产品列表</p>
003+ <p style="font-size:14px;background-color:#FFFFFF;">2.快速浏览产品</p>
004+ <p style="font-size:14px;background-color:#FFFFFF;">3.将四高产品加入购物车</p>
005+ <p style="font-size:14px;background-color:#FFFFFF;">4.进入产品详情页面</p>
006+ <h3 style="font-size:14px;background-color:#FFFFFF;">界面</h3>
007+ <p><img src="{3407.png}" alt="" /><img src="{3408.png}" alt="" /><img src="{3409.png}" alt="" /><img src="{3410.png}" alt="" /></p>
008+ <p><br /></p>
009+ <h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-产品列表</h3>
010+ <p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
011+ <table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
012+ <th style="background-color:#F1F1F1;">用途</th>
013+ <th style="background-color:#F1F1F1;">显示</th>
014+ <th style="background-color:#F1F1F1;">交互</th>
015+ </tr></tbody><tbody><tr><td>产品列表<br /></td>
016+ <td>展示四高系列产品</td>
017+ <td>
018+ <p>每行按四个产品内容排列</p>
019+ <p>内容包含:产品图片+产品名称+价格</p>
020+ <p>产品无库存时,不显示价格</p>
021+ </td>
022+ <td>
023+ <p>1.鼠标悬停至产品,图片内容更换为产品详情并有快速浏览字段</p>
024+ <p>2.点击产品图片,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">产品详情</span></a>页面</p>
025+ </td>
026+ </tr><tr><td>快速浏览</td>
027+ <td>进入快速浏览页面</td>
028+ <td>字段:快速浏览</td>
029+ <td>1.点击快速浏览,进入指定页面</td>
030+ </tr></tbody></table><h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-快速浏览</h3>
031+ <p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
032+ <table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
033+ <th style="background-color:#F1F1F1;">用途</th>
034+ <th style="background-color:#F1F1F1;">显示</th>
035+ <th style="background-color:#F1F1F1;">交互</th>
036+ </tr></tbody><tbody><tr><td>产品信息<br /></td>
037+ <td>展示产品信息</td>
038+ <td>
039+ <p>产品名称,例:健知己-海豹油100粒</p>
040+ <p>产品价格,例:HK$260.00</p>
041+ <p>库存单位:LM00001<br />产品图片多张</p>
042+ </td>
043+ <td>1.点击<a href="/zentao/file-read-3401.png" target="_blank" rel="noreferrer noopener"><img src="{3401.png}" alt="" /></a>,圆点底色变量并更换产品图片</td>
044+ </tr><tr><td>数量</td>
045+ <td>填写购买数量</td>
046+ <td>
047+ <p>输入框,默认为1</p>
048+ <p>产品无库存时,不显示</p>
049+ </td>
050+ <td>
051+ <p>1.鼠标悬停至输入框,<a href="/zentao/file-read-3402.png" target="_blank" rel="noreferrer noopener"><img src="{3402.png}" alt="" /></a>点击上下,增加/减少购买数量,最少为1</p>
052+ <p>2.输入购买数量</p>
053+ </td>
054+ </tr><tr><td>新增到购物车中</td>
055+ <td>将产品加入购物车</td>
056+ <td>
057+ <p>【新增到购物车中】按钮</p>
058+ <p>产品有库存时,显示</p>
059+ </td>
060+ <td>1.点击按钮,产品加入至购物车右侧并出现购物车插件页面</td>
061+ </tr><tr><td>无库存</td>
062+ <td>告知用户无库存</td>
063+ <td>
064+ <p>字段:无库存,灰色底框</p>
065+ <p>产品无库存时,显示</p>
066+ </td>
067+ <td>无</td>
068+ </tr><tr><td>浏览更多详细资料</td>
069+ <td>查看指定产品详细资料</td>
070+ <td>字段:浏览更多详细资料</td>
071+ <td>1.点击字段,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">产品详情</span></a>页面</td>
072+ </tr></tbody></table><h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-购物车</h3>
073+ <p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
074+ <table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
075+ <th style="background-color:#F1F1F1;">用途</th>
076+ <th style="background-color:#F1F1F1;">显示</th>
077+ <th style="background-color:#F1F1F1;">交互</th>
078+ </tr></tbody><tbody><tr><td><a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener"><img src="{3404.png}" alt="" /></a><br /></td>
079+ <td>关闭购物车插件</td>
080+ <td>图标:<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener"><img src="{3404.png}" alt="" /></a></td>
081+ <td>
082+ <p>1.悬停出现字段:关闭购物车插件</p>
083+ <p>2.点击图标,关闭购物车插件</p>
084+ </td>
085+ </tr><tr><td>浏览购物车</td>
086+ <td>进入购物车页面</td>
087+ <td>【浏览购物车】按钮</td>
088+ <td>1.点击按钮,进入购物车页面</td>
089+ </tr><tr><td>购物车产品列表</td>
090+ <td>展示购物车内的产品</td>
091+ <td>纵向排列,展示产品名称,价格,数量(至少为1),小计金额</td>
092+ <td>
093+ <p>1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener"><img src="{3405.png}" alt="" /></a>按钮,点击删除产品</p>
094+ <p>2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener"><img src="{3406.png}" alt="" /></a>点击+/-,更改产品数量,小计金额更改</p>
095+ </td>
096+ </tr></tbody></table><p><br /></p>
097+ <p><br /></p>
098+ <p><br /></p>
041-库存单位:LM00001产品图片多张
041+ 库存单位:例:1002156产品图片多张
091-纵向排列,展示产品名称,价格,数量(至少为1),小计金额
091+
092-
092+ 纵向排列,展示产品名称,价格,数量(至少为1),小计金额
093-1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener">按钮,点击删除产品
093+ 当购物车没有产品,列表显示字段:购物车是空的
094-2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener">点击+/-,更改产品数量,小计金额更改
094+
095-
095+
096-
096+ 1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener">按钮,点击删除产品
097-
097+ 2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener">点击+/-,更改产品数量,小计金额更改
098-
098+
099+
100+
101+
041-<p>库存单位:LM00001<br />产品图片多张</p>
041+ <p>库存单位:例:1002156<br />产品图片多张</p>
091-<td>纵向排列,展示产品名称,价格,数量(至少为1),小计金额</td>
091+ <td>
092-<td>
092+ <p>纵向排列,展示产品名称,价格,数量(至少为1),小计金额</p>
093-<p>1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener"><img src="{3405.png}" alt="" /></a>按钮,点击删除产品</p>
093+ <p><span>当购物车没有产品,列表显示字段:购物车是空的</span></p>
094-<p>2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener"><img src="{3406.png}" alt="" /></a>点击+/-,更改产品数量,小计金额更改</p>
094+ </td>
095-</td>
095+ <td>
096-</tr></tbody></table><p><br /></p>
096+ <p>1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener"><img src="{3405.png}" alt="" /></a>按钮,点击删除产品</p>
097-<p><br /></p>
097+ <p>2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener"><img src="{3406.png}" alt="" /></a>点击+/-,更改产品数量,小计金额更改</p>
098-<p><br /></p>
098+ </td>
099+ </tr></tbody></table><p><br /></p>
100+ <p><br /></p>
101+ <p><br /></p>
011-名称
011+ 名称
072-界面元素-购物车
072+
073-
073+ 关闭快速浏览框
074-名称
074+ 图标:
075-用途
075+ 1.点击图标,关闭浏览框
076-显示
076+ 界面元素-购物车
077-交互
077+
078-<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener">
078+ 名称
079-关闭购物车插件
079+ 用途
080-图标:<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener">
080+ 显示
081-
081+ 交互
082-1.悬停出现字段:关闭购物车插件
082+ <a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener">
083-2.点击图标,关闭购物车插件
083+ 关闭购物车插件
084-
084+ 图标:<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener">
085-浏览购物车
085+
086-进入购物车页面
086+ 1.悬停出现字段:关闭购物车插件
087-【浏览购物车】按钮
087+ 2.点击图标,关闭购物车插件
088-1.点击按钮,进入购物车页面
088+
089-购物车产品列表
089+ 浏览购物车
090-展示购物车内的产品
090+ 进入购物车页面
091-
091+ 【浏览购物车】按钮
092-纵向排列,展示产品名称,价格,数量(至少为1),小计金额
092+ 1.点击按钮,进入购物车页面
093-当购物车没有产品,列表显示字段:购物车是空的
093+ 购物车产品列表
094-
094+ 展示购物车内的产品
096-1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener">按钮,点击删除产品
096+ 纵向排列,展示产品名称,价格,数量(至少为1),小计金额
097-2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener">点击+/-,更改产品数量,小计金额更改
097+ 当购物车没有产品,列表显示字段:购物车是空的
099-
099+
100-
100+ 1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener">按钮,点击删除产品
101-
101+ 2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener">点击+/-,更改产品数量,小计金额更改
102+
103+
104+
105+
011-<table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
011+ <table class="table table-kindeditor ke-select-col" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
072-</tr></tbody></table><h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-购物车</h3>
072+ </tr><tr><td style="border:1px solid #ddd;"><img src="{3422.png}" alt="" /><br /></td>
073-<p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
073+ <td style="border:1px solid #ddd;"><span>关闭快速浏览框</span><br /></td>
074-<table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
074+ <td style="border:1px solid #ddd;">图标:<img src="{3422.png}" alt="" /><br /></td>
075-<th style="background-color:#F1F1F1;">用途</th>
075+ <td style="border:1px solid #ddd;"><span>1.点击图标,关闭浏览框</span><br /></td>
076-<th style="background-color:#F1F1F1;">显示</th>
076+ </tr></tbody></table><h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-购物车</h3>
077-<th style="background-color:#F1F1F1;">交互</th>
077+ <p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
078-</tr></tbody><tbody><tr><td><a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener"><img src="{3404.png}" alt="" /></a><br /></td>
078+ <table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
079-<td>关闭购物车插件</td>
079+ <th style="background-color:#F1F1F1;">用途</th>
080-<td>图标:<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener"><img src="{3404.png}" alt="" /></a></td>
080+ <th style="background-color:#F1F1F1;">显示</th>
081-<td>
081+ <th style="background-color:#F1F1F1;">交互</th>
082-<p>1.悬停出现字段:关闭购物车插件</p>
082+ </tr></tbody><tbody><tr><td><a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener"><img src="{3404.png}" alt="" /></a><br /></td>
083-<p>2.点击图标,关闭购物车插件</p>
083+ <td>关闭购物车插件</td>
084-</td>
084+ <td>图标:<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener"><img src="{3404.png}" alt="" /></a></td>
085-</tr><tr><td>浏览购物车</td>
085+ <td>
086-<td>进入购物车页面</td>
086+ <p>1.悬停出现字段:关闭购物车插件</p>
087-<td>【浏览购物车】按钮</td>
087+ <p>2.点击图标,关闭购物车插件</p>
088-<td>1.点击按钮,进入购物车页面</td>
088+ </td>
089-</tr><tr><td>购物车产品列表</td>
089+ </tr><tr><td>浏览购物车</td>
090-<td>展示购物车内的产品</td>
090+ <td>进入购物车页面</td>
091-<td>
091+ <td>【浏览购物车】按钮</td>
092-<p>纵向排列,展示产品名称,价格,数量(至少为1),小计金额</p>
092+ <td>1.点击按钮,进入购物车页面</td>
093-<p><span>当购物车没有产品,列表显示字段:购物车是空的</span></p>
093+ </tr><tr><td>购物车产品列表</td>
094-</td>
094+ <td>展示购物车内的产品</td>
096-<p>1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener"><img src="{3405.png}" alt="" /></a>按钮,点击删除产品</p>
096+ <p>纵向排列,展示产品名称,价格,数量(至少为1),小计金额</p>
097-<p>2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener"><img src="{3406.png}" alt="" /></a>点击+/-,更改产品数量,小计金额更改</p>
097+ <p><span>当购物车没有产品,列表显示字段:购物车是空的</span></p>
099-</tr></tbody></table><p><br /></p>
099+ <td>
100-<p><br /></p>
100+ <p>1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener"><img src="{3405.png}" alt="" /></a>按钮,点击删除产品</p>
101-<p><br /></p>
101+ <p>2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener"><img src="{3406.png}" alt="" /></a>点击+/-,更改产品数量,小计金额更改</p>
102+ </td>
103+ </tr></tbody></table><p><br /></p>
104+ <p><br /></p>
105+ <p><br /></p>
011-名称
011+ 名称
096-纵向排列,展示产品名称,价格,数量(至少为1),小计金额
096+ 纵向排列,展示产品图片,名称,价格,数量(至少为1),小计金额
100-1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener">按钮,点击删除产品
100+
101-2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener">点击+/-,更改产品数量,小计金额更改
101+ 1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener">按钮,点击删除产品
102-
102+ 2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener">点击+/-,更改产品数量,小计金额更改
103-
103+ 3.点击产品图片,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener">产品详情页面
104-
104+
105-
105+
106+
107+
108+
011-<table class="table table-kindeditor ke-select-col" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
011+ <table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
096-<p>纵向排列,展示产品名称,价格,数量(至少为1),小计金额</p>
096+ <p>纵向排列,展示产品图片,名称,价格,数量(至少为1),小计金额</p>
100-<p>1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener"><img src="{3405.png}" alt="" /></a>按钮,点击删除产品</p>
100+ <p><br /></p>
101-<p>2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener"><img src="{3406.png}" alt="" /></a>点击+/-,更改产品数量,小计金额更改</p>
101+ <p>1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener"><img src="{3405.png}" alt="" /></a>按钮,点击删除产品</p>
102-</td>
102+ <p>2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener"><img src="{3406.png}" alt="" /></a>点击+/-,更改产品数量,小计金额更改</p>
103-</tr></tbody></table><p><br /></p>
103+ <p>3.点击产品图片,<span>进入</span><a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">产品详情</span></a><span>页面</span></p>
104-<p><br /></p>
104+ <p><br /></p>
105-<p><br /></p>
105+ </td>
106+ </tr></tbody></table><p><br /></p>
107+ <p><br /></p>
108+ <p><br /></p>
029-1.点击快速浏览,进入指定页面
029+ 1.点击快速浏览,显示快速浏览框
092-1.点击按钮,进入购物车页面
092+ 1.点击按钮,进入<a href="/zentao/story-view-1121.html" target="_blank" rel="noreferrer noopener">购物车页面
029-<td>1.点击快速浏览,进入指定页面</td>
029+ <td>1.点击快速浏览,<span>显示</span><span>快速浏览框</span></td>
092-<td>1.点击按钮,进入购物车页面</td>
092+ <td>1.点击按钮,进入<a href="/zentao/story-view-1121.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">购物车</span></a>页面</td>
002-1.查看四高产品列表
002+
003-2.快速浏览产品
003+ 1.查看四高产品列表
004-3.将四高产品加入购物车
004+ 2.将四高产品加入购物车
005-4.进入产品详情页面
005+ 3.将四高产品加入愿望清单
006-界面
006+ 4.进入产品详情页
007-
007+
008-
008+ 界面
009-界面元素-产品列表
009+
010-
010+
011-名称
011+
012-用途
012+ 界面元素-产品列表
013-显示
013+ 名称
014-交互
014+ 用途
015-产品列表
015+ 显示
016-展示四高系列产品
016+ 交互
017-
017+ 产品列表
018-每行按四个产品内容排列
018+ 展示四高系列产品
019-内容包含:产品图片+产品名称+价格
019+
020-产品无库存时,不显示价格
020+ 每行按四个产品内容排列
021-
021+ 内容包含:产品图片+产品名称+价格
022-
022+ 产品无库存时,不显示价格
023-1.鼠标悬停至产品,图片内容更换为产品详情并有快速浏览字段
023+
024-2.点击产品图片,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener">产品详情页面
024+
025-
025+ 1.鼠标悬停至产品,出现阴影框
026-快速浏览
026+ 2.点击产品图片,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener">产品详情页面
027-进入快速浏览页面
027+
028-字段:快速浏览
028+ 阴影框
029-1.点击快速浏览,显示快速浏览框
029+ 将产品加入购物车
030-界面元素-快速浏览
030+
031-
031+ 按钮:<a href="/zentao/file-read-3462.png" target="_blank" rel="noreferrer noopener">
032-名称
032+
033-用途
033+
034-显示
034+ 1.点击按钮,直接加入购物车,弹出提示文本已加入购物车,点击提示文本购物车字段,进入<a href="/zentao/story-change-1121.html" target="_blank" rel="noreferrer noopener">购物车页面
035-交互
035+
036-产品信息
036+ 阴影框
037-展示产品信息
037+ 将产品加入愿望清单
038-
038+ 图标:<a href="/zentao/file-read-3463.png" target="_blank" rel="noreferrer noopener">
039-产品名称,例:健知己-海豹油100粒
039+
040-产品价格,例:HK$260.00
040+ 1.未登入账号时,点击图标,进入<a href="/zentao/story-view-1029.html" target="_blank" rel="noreferrer noopener">登入页面。
041-库存单位:例:1002156产品图片多张
041+ 2.已登入账号时,点击图标,进入<a href="/zentao/story-view-1122.html" target="_blank" rel="noreferrer noopener">我的愿望清单页面并弹出提示文本,点击提示中的字段Here进入首页页面
042-
042+
043-1.点击<a href="/zentao/file-read-3401.png" target="_blank" rel="noreferrer noopener">,圆点底色变量并更换产品图片
043+
044-数量
044+
045-填写购买数量
046-
047-输入框,默认为1
048-产品无库存时,不显示
049-
050-
051-1.鼠标悬停至输入框,<a href="/zentao/file-read-3402.png" target="_blank" rel="noreferrer noopener">点击上下,增加/减少购买数量,最少为1
052-2.输入购买数量
053-
054-新增到购物车中
055-将产品加入购物车
056-
057-【新增到购物车中】按钮
058-产品有库存时,显示
059-
060-1.点击按钮,产品加入至购物车右侧并出现购物车插件页面
061-无库存
062-告知用户无库存
063-
064-字段:无库存,灰色底框
065-产品无库存时,显示
066-
067-无
068-浏览更多详细资料
069-查看指定产品详细资料
070-字段:浏览更多详细资料
071-1.点击字段,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener">产品详情页面
072-
073-关闭快速浏览框
074-图标:
075-1.点击图标,关闭浏览框
076-界面元素-购物车
077-
078-名称
079-用途
080-显示
081-交互
082-<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener">
083-关闭购物车插件
084-图标:<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener">
085-
086-1.悬停出现字段:关闭购物车插件
087-2.点击图标,关闭购物车插件
088-
089-浏览购物车
090-进入购物车页面
091-【浏览购物车】按钮
092-1.点击按钮,进入<a href="/zentao/story-view-1121.html" target="_blank" rel="noreferrer noopener">购物车页面
093-购物车产品列表
094-展示购物车内的产品
095-
096-纵向排列,展示产品图片,名称,价格,数量(至少为1),小计金额
097-当购物车没有产品,列表显示字段:购物车是空的
098-
099-
100-
101-1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener">按钮,点击删除产品
102-2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener">点击+/-,更改产品数量,小计金额更改
103-3.点击产品图片,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener">产品详情页面
104-
105-
106-
107-
108-
002-<p style="font-size:14px;background-color:#FFFFFF;">1.查看四高产品列表</p>
002+ <p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
003-<p style="font-size:14px;background-color:#FFFFFF;">2.快速浏览产品</p>
003+ <p style="font-size:14px;background-color:#FFFFFF;">1.查看四高产品列表</p>
004-<p style="font-size:14px;background-color:#FFFFFF;">3.将四高产品加入购物车</p>
004+ <p style="font-size:14px;background-color:#FFFFFF;">2.将四高产品加入购物车</p>
005-<p style="font-size:14px;background-color:#FFFFFF;">4.进入产品详情页面</p>
005+ <p style="font-size:14px;background-color:#FFFFFF;">3.将四高产品加入愿望清单</p>
006-<h3 style="font-size:14px;background-color:#FFFFFF;">界面</h3>
006+ <p style="font-size:14px;background-color:#FFFFFF;">4.进入产品详情页</p>
007-<p><img src="{3407.png}" alt="" /><img src="{3408.png}" alt="" /><img src="{3409.png}" alt="" /><img src="{3410.png}" alt="" /></p>
007+ <p><br /></p>
008-<p><br /></p>
008+ <h3 style="font-size:14px;background-color:#FFFFFF;">界面</h3>
009-<h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-产品列表</h3>
009+ <p><img src="{3407.png}" alt="" /><img src="{3519.png}" alt="" /></p>
010-<p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
010+ <p><br /></p>
011-<table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
011+ <h3 style="color:#3C4353;background-color:#FFFFFF;"></h3>
012-<th style="background-color:#F1F1F1;">用途</th>
012+ <h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-产品列表</h3>
013-<th style="background-color:#F1F1F1;">显示</th>
013+ <table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
014-<th style="background-color:#F1F1F1;">交互</th>
014+ <th style="background-color:#F1F1F1;">用途</th>
015-</tr></tbody><tbody><tr><td>产品列表<br /></td>
015+ <th style="background-color:#F1F1F1;">显示</th>
016-<td>展示四高系列产品</td>
016+ <th style="background-color:#F1F1F1;">交互</th>
017-<td>
017+ </tr></tbody><tbody><tr><td>产品列表<br /></td>
018-<p>每行按四个产品内容排列</p>
018+ <td>展示四高系列产品</td>
019-<p>内容包含:产品图片+产品名称+价格</p>
019+ <td>
020-<p>产品无库存时,不显示价格</p>
020+ <p>每行按四个产品内容排列</p>
021-</td>
021+ <p>内容包含:产品图片+产品名称+价格</p>
022-<td>
022+ <p>产品无库存时,不显示价格</p>
023-<p>1.鼠标悬停至产品,图片内容更换为产品详情并有快速浏览字段</p>
023+ </td>
024-<p>2.点击产品图片,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">产品详情</span></a>页面</p>
024+ <td>
025-</td>
025+ <p>1.鼠标悬停至产品,出现阴影框</p>
026-</tr><tr><td>快速浏览</td>
026+ <p>2.点击产品图片,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">产品详情</span></a>页面</p>
027-<td>进入快速浏览页面</td>
027+ </td>
028-<td>字段:快速浏览</td>
028+ </tr><tr><td>阴影框<br /></td>
029-<td>1.点击快速浏览,<span>显示</span><span>快速浏览框</span></td>
029+ <td>将产品加入购物车<br /></td>
030-</tr></tbody></table><h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-快速浏览</h3>
030+ <td>
031-<p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
031+ <p>按钮:<a href="/zentao/file-read-3462.png" target="_blank" rel="noreferrer noopener"><img src="{3462.png}" alt="" /></a></p>
032-<table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
032+ </td>
033-<th style="background-color:#F1F1F1;">用途</th>
033+ <td>
034-<th style="background-color:#F1F1F1;">显示</th>
034+ <p>1.点击按钮,直接加入购物车,弹出提示文本已加入购物车,点击提示文本购物车字段,进入<a href="/zentao/story-change-1121.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">购物车</span></a>页面</p>
035-<th style="background-color:#F1F1F1;">交互</th>
035+ </td>
036-</tr></tbody><tbody><tr><td>产品信息<br /></td>
036+ </tr><tr><td>阴影框<br /></td>
037-<td>展示产品信息</td>
037+ <td>将产品加入愿望清单<br /></td>
038-<td>
038+ <td>图标:<a href="/zentao/file-read-3463.png" target="_blank" rel="noreferrer noopener"><img src="{3463.png}" alt="" /></a><br /></td>
039-<p>产品名称,例:健知己-海豹油100粒</p>
039+ <td>
040-<p>产品价格,例:HK$260.00</p>
040+ <p>1.未登入账号时,点击图标,进入<a href="/zentao/story-view-1029.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">登入</span></a>页面。</p>
041-<p>库存单位:例:1002156<br />产品图片多张</p>
041+ <p>2.已登入账号时,点击图标,进入<a href="/zentao/story-view-1122.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">我的愿望清单</span></a>页面并弹出提示文本,点击提示中的字段Here进入首页页面</p>
042-</td>
042+ <div><br /></div>
043-<td>1.点击<a href="/zentao/file-read-3401.png" target="_blank" rel="noreferrer noopener"><img src="{3401.png}" alt="" /></a>,圆点底色变量并更换产品图片</td>
043+ </td>
044-</tr><tr><td>数量</td>
044+ </tr></tbody></table><p></p>
045-<td>填写购买数量</td>
046-<td>
047-<p>输入框,默认为1</p>
048-<p>产品无库存时,不显示</p>
049-</td>
050-<td>
051-<p>1.鼠标悬停至输入框,<a href="/zentao/file-read-3402.png" target="_blank" rel="noreferrer noopener"><img src="{3402.png}" alt="" /></a>点击上下,增加/减少购买数量,最少为1</p>
052-<p>2.输入购买数量</p>
053-</td>
054-</tr><tr><td>新增到购物车中</td>
055-<td>将产品加入购物车</td>
056-<td>
057-<p>【新增到购物车中】按钮</p>
058-<p>产品有库存时,显示</p>
059-</td>
060-<td>1.点击按钮,产品加入至购物车右侧并出现购物车插件页面</td>
061-</tr><tr><td>无库存</td>
062-<td>告知用户无库存</td>
063-<td>
064-<p>字段:无库存,灰色底框</p>
065-<p>产品无库存时,显示</p>
066-</td>
067-<td>无</td>
068-</tr><tr><td>浏览更多详细资料</td>
069-<td>查看指定产品详细资料</td>
070-<td>字段:浏览更多详细资料</td>
071-<td>1.点击字段,进入<a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">产品详情</span></a>页面</td>
072-</tr><tr><td style="border:1px solid #ddd;"><img src="{3422.png}" alt="" /><br /></td>
073-<td style="border:1px solid #ddd;"><span>关闭快速浏览框</span><br /></td>
074-<td style="border:1px solid #ddd;">图标:<img src="{3422.png}" alt="" /><br /></td>
075-<td style="border:1px solid #ddd;"><span>1.点击图标,关闭浏览框</span><br /></td>
076-</tr></tbody></table><h3 style="color:#3C4353;background-color:#FFFFFF;">界面元素-购物车</h3>
077-<p style="font-size:14px;background-color:#FFFFFF;"><br /></p>
078-<table class="table table-kindeditor" style="font-size:14px;background-color:#FFFFFF;width:auto;color:#3C4353;"><tbody><tr><th style="background-color:#F1F1F1;">名称</th>
079-<th style="background-color:#F1F1F1;">用途</th>
080-<th style="background-color:#F1F1F1;">显示</th>
081-<th style="background-color:#F1F1F1;">交互</th>
082-</tr></tbody><tbody><tr><td><a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener"><img src="{3404.png}" alt="" /></a><br /></td>
083-<td>关闭购物车插件</td>
084-<td>图标:<a href="/zentao/file-read-3404.png" target="_blank" rel="noreferrer noopener"><img src="{3404.png}" alt="" /></a></td>
085-<td>
086-<p>1.悬停出现字段:关闭购物车插件</p>
087-<p>2.点击图标,关闭购物车插件</p>
088-</td>
089-</tr><tr><td>浏览购物车</td>
090-<td>进入购物车页面</td>
091-<td>【浏览购物车】按钮</td>
092-<td>1.点击按钮,进入<a href="/zentao/story-view-1121.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">购物车</span></a>页面</td>
093-</tr><tr><td>购物车产品列表</td>
094-<td>展示购物车内的产品</td>
095-<td>
096-<p>纵向排列,展示产品图片,名称,价格,数量(至少为1),小计金额</p>
097-<p><span>当购物车没有产品,列表显示字段:购物车是空的</span></p>
098-</td>
099-<td>
100-<p><br /></p>
101-<p>1.鼠标悬停至产品,出现<a href="/zentao/file-read-3405.png" target="_blank" rel="noreferrer noopener"><img src="{3405.png}" alt="" /></a>按钮,点击删除产品</p>
102-<p>2.<a href="/zentao/file-read-3406.png" target="_blank" rel="noreferrer noopener"><img src="{3406.png}" alt="" /></a>点击+/-,更改产品数量,小计金额更改</p>
103-<p>3.点击产品图片,<span>进入</span><a href="/zentao/story-view-1027.html" target="_blank" rel="noreferrer noopener"><span style="color:#337FE5;">产品详情</span></a><span>页面</span></p>
104-<p><br /></p>
105-</td>
106-</tr></tbody></table><p><br /></p>
107-<p><br /></p>
108-<p><br /></p>
所属产品 | 康而健网上商城客户端 |
---|---|
所属%s | |
所属模块 | 产品系列 |
所属计划 | |
来源 | |
来源备注 | |
当前状态 | 激活 |
所处阶段 |
主干 : 已立项 |
类型 | 功能 |
优先级 | 3 |
预计故事点 | 0sp |
关键词 | |
抄送给 |
由谁创建 | kyxia 于 2021-04-09 12:06:49 |
---|---|
指派给 | |
评审人员 | |
评审时间 | |
由谁关闭 | |
关闭原因 | |
最后修改 | 李成发 于 2021-04-16 15:26:58 |
相关Bug |
|
---|---|
相关用例 |
|
相关合并请求 |
|