|
@@ -0,0 +1,365 @@
|
|
|
+<template>
|
|
|
+ <div class="promotionRuleset-wrap">
|
|
|
+ <a-spin :spinning="spinning" tip="Loading...">
|
|
|
+ <a-page-header :ghost="false" :backIcon="false" class="promotionDetail-cont" style="padding:16px 24px;">
|
|
|
+ <template slot="subTitle">
|
|
|
+ <a href="javascript:;" id="promotionDetail-back" @click="handleBack"><a-icon type="left"></a-icon> 返回列表</a>
|
|
|
+ <span style="margin: 0 10px 0 20px;color: #666;font-size: 14px;font-weight: 600;">促销名称:{{ detailData&&detailData.title||'--' }}</span>
|
|
|
+ <a-button type="link" class="button-default" id="promotionDetail-showInfo" @click="isShowBisiceInfo=!isShowBisiceInfo">
|
|
|
+ <a-icon :type="isShowBisiceInfo ? 'eye-invisible' : 'eye'"/> {{ isShowBisiceInfo?'隐藏':'查看' }}信息
|
|
|
+ </a-button>
|
|
|
+ </template>
|
|
|
+ </a-page-header>
|
|
|
+ <!-- 基础信息 -->
|
|
|
+ <a-card size="small" title="基础信息" :bordered="false" v-show="!isShowBisiceInfo" class="promotionDetail-cont">
|
|
|
+ <a-descriptions size="small" v-if="detailData">
|
|
|
+ <a-descriptions-item label="促销名称">{{ detailData.title || '--' }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="促销简称">{{ detailData.description || '--' }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="促销时间" v-if="detailData.promotionDateStart&& detailData.promotionDateEnd">{{ detailData.promotionDateStart }}-{{ detailData.promotionDateEnd }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="促销时间" v-else>--</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="审核通过时间">{{ detailData.auditDate||'--' }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="费用所属部门">{{ detailData.expenseDepartmentName || '--' }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="参与客户" v-if="detailData.dealerScope!='ALL_DEALER'"><div @click="handleSee">共<span class="link-bule">{{ detailData.dealerQty }}</span>个</div></a-descriptions-item>
|
|
|
+ <a-descriptions-item label="参与客户" v-else>全部客户</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="最大参与次数">{{ detailData.dealerMaxJoinFlag=='1' ? detailData.dealerMaxJoinQty :'不限' }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="活动订单起订金额(元)">{{ detailData.minOrderFlag ==='0'?'不限':detailData.minOrderAmount?toThousands(detailData.minOrderAmount):'--' }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="活动经费上限(元)":span="2">{{ detailData.upperLimitFlag ==='0'?'不限':detailData.upperLimitAmount? toThousands(detailData.upperLimitAmount):'--' }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="促销描述" :span="3">
|
|
|
+ <div class="descItem">{{ detailData.content || '--' }}</div>
|
|
|
+ </a-descriptions-item>
|
|
|
+ <a-descriptions-item label="终止说明" :span="3" v-if="detailData.state === 'IS_OVER'&&detailData.overInfo">{{ detailData.overInfo }}</a-descriptions-item>
|
|
|
+ <a-descriptions-item label="附件" :span="3">
|
|
|
+ <div class="attachmentBox" v-if="detailData.attachmentList&&detailData.attachmentList.length>0">
|
|
|
+ <a
|
|
|
+ id="promotionDetail-downloadFile"
|
|
|
+ class="link-bule"
|
|
|
+ target="downloadFile"
|
|
|
+ :href="item.filePath"
|
|
|
+ v-for="item in detailData.attachmentList"
|
|
|
+ :key="item.id"
|
|
|
+ download>{{ item.fileName }}</a>
|
|
|
+ </div>
|
|
|
+ <span v-else>--</span>
|
|
|
+ </a-descriptions-item>
|
|
|
+ </a-descriptions>
|
|
|
+ </a-card>
|
|
|
+ <a-card size="small" title="规则设置" :bordered="false" class="pages-wrap">
|
|
|
+ <div class="btnGroup" v-if="$hasPermissions('B_rulesAddEdit')">
|
|
|
+ <a-button type="primary" class="button-info" id="promotionDetail-sendProducts" @click="openBtnModal('SendProducts')" :disabled="disabled">买产品送产品</a-button>
|
|
|
+ <a-button type="primary" class="button-info" id="promotionDetail-sendAmount" @click="openBtnModal('SendAmount')" :disabled="disabled">买产品送采购额</a-button>
|
|
|
+ <a-button type="primary" style="margin-left:5px;" id="promotionDetail-specialOffer" @click="openBtnModal('SpecialOffer')" :disabled="disabled">特价产品</a-button>
|
|
|
+ </div>
|
|
|
+ <!-- 列表 -->
|
|
|
+ <s-table
|
|
|
+ class="sTable"
|
|
|
+ ref="table"
|
|
|
+ size="small"
|
|
|
+ :rowKey="(record) => record.id"
|
|
|
+ :columns="columns"
|
|
|
+ :data="loadData"
|
|
|
+ :defaultLoadData="false"
|
|
|
+ :showPagination="false"
|
|
|
+ :scroll="{ y: !isShowBisiceInfo?365:568}"
|
|
|
+ bordered>
|
|
|
+ <!-- 门槛规则 -->
|
|
|
+ <template slot="cillProduct" slot-scope="text, record">
|
|
|
+ <div v-if="record.gateFlag === '1'">
|
|
|
+ <span v-if="record.gateType==='RATIO_AMOUNT'">
|
|
|
+ 购买门槛产品金额{{ record.gateValue?(record.gateValue*100).toFixed(2) :'0.00' }}%作为配额
|
|
|
+ </span>
|
|
|
+ <span v-else-if="record.gateType==='MIN_AMOUNT'">
|
|
|
+ 购买门槛产品满最低金额{{ toThousands(record.gateValue) }}元,不限制配额
|
|
|
+ </span>
|
|
|
+ <span v-else>
|
|
|
+ <span v-if="record.promotionRuleType!='PROMO_PROD'">购买满{{ toThousands(record.gateValue) }}元门槛产品,可使用 {{ toThousands(record.quotaAmount) }}元配额,采购规则中的正价商品</span>
|
|
|
+ <span v-else>购买每满{{ record.gateUnit==='YUAN'? toThousands(record.gateValue):record.gateValue }}{{ record.gateUnit==='YUAN'?'元':'个' }}门槛产品,可采购{{ record.quotaAmount }}个特价产品</span>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <span v-else>无</span>
|
|
|
+ </template>
|
|
|
+ <!-- 规则 -->
|
|
|
+ <template slot="ruleProduct" slot-scope="text, record">
|
|
|
+ <div v-html="record.ruleInfo"></div>
|
|
|
+ <!-- <div v-if="record.promotionRuleType == 'BUY_PROD_GIVE_PROD'">
|
|
|
+ <div>{{ record.stackFlag==='1'?'规则叠加;':'' }}{{ record.accrualFlag==='1'?'数量叠加;':'' }}{{ record.convertExpenseFlag==='1'?'可转费用报销单;':'' }}</div>
|
|
|
+ <div v-if="record.giveRuleList && record.giveRuleList.length>0">
|
|
|
+ <div v-for="item in record.giveRuleList" :key="item.scopeLevel">
|
|
|
+ {{ record.giveRuleList.length>1?item.scopeLevel+'、' :'' }}{{ item.regularSameFlag==='1'?'同款':'不同款' }}产品,购买满{{ item.regularUnit==='YUAN'?toThousands(item.regularValue):item.regularValue }}{{ item.regularUnit==='YUAN'?'元':'个' }}正价产品,送{{ item.promotionValue }}个促销产品;
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="record.restrictFlag==='1'">限制正价产品{{ record.restrictCategory }}款;</div>
|
|
|
+ <div v-if="record.borrowTimeLimtType">产品累计:{{ record.borrowTimeLimtTypeDictValue }}<span v-if="record.borrowedShowFlag==='1'">,加盟商显示“转促”标签;</span></div>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="record.promotionRuleType == 'BUY_PROD_GIVE_MONEY'">
|
|
|
+ <div v-if="record.stackFlag==='1'">规则叠加;</div>
|
|
|
+ <div v-if="record.giveRuleList&&record.giveRuleList.length>0">
|
|
|
+ <div v-if="record.giveRuleType==='SUM_MONEY'">金额叠加;购买满{{ record.giveRuleList[0].regularUnit==='YUAN'?toThousands(record.giveRuleList[0].regularValue):record.giveRuleList[0].regularValue }}{{ record.giveRuleList[0].regularUnit==='YUAN'?'元':'个' }}正价产品,送{{ toThousands(record.giveRuleList[0].promotionValue) }}元<span v-if="record.giveRuleList[0].regularUnit==='YUAN'">({{ record.giveRuleList[0].regularValue!=0?((record.giveRuleList[0].promotionValue/record.giveRuleList[0].regularValue)*100).toFixed(2):'0.00' }}%促销品采购额)</span><span v-else>(促销品采购额)</span></div>
|
|
|
+ <div v-if="record.giveRuleType==='RATIO' &&record.giveRuleList && record.giveRuleList.length>0 ">
|
|
|
+ <span>按比例;</span>
|
|
|
+ <div v-for="item in record.giveRuleList" :key="item.scopeLevel">
|
|
|
+ {{ record.giveRuleList.length>1?item.scopeLevel+'、' :'' }}产品购买满{{ item.regularUnit==='YUAN'?toThousands(item.regularValue):item.regularValue }}{{ item.regularUnit==='YUAN'?'元':'个' }}正价产品,送正价产品总金额的{{ item.promotionValue.toFixed(2) }}%为促销品采购额
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div v-if="record.borrowTimeLimtType">产品累计:{{ record.borrowTimeLimtTypeDictValue }}{{ record.borrowedShowFlag==='1'?',':'' }}<span v-if="record.borrowedShowFlag==='1'">加盟商显示“转促”标签;</span></div>
|
|
|
+ </div>
|
|
|
+ <span v-else>--</span>
|
|
|
+ </div>
|
|
|
+ <div v-else-if="record.promotionRuleType == 'PROMO_PROD'">
|
|
|
+ <div v-if="record.stackFlag==='1' && record.discountType !='0'">规则叠加;</div>
|
|
|
+ <span v-if="record.discountType ==='0'">手动输入特价</span>
|
|
|
+ <div v-else-if="record.discountType ==='1'" v-html="record.ruleInfo"></div>
|
|
|
+ <span v-else>各级别价直降;省级直降{{ toThousands(record.provinceValue) }},市级直降{{ toThousands(record.cityValue) }},特约直降{{ toThousands(record.specialValue) }}</span>
|
|
|
+ <div v-if="record.borrowTimeLimtType">产品累计:{{ record.borrowTimeLimtTypeDictValue }}{{ record.borrowedShowFlag==='1'?',':'' }}<span v-if="record.borrowedShowFlag==='1'">加盟商显示“转促”标签;</span></div>
|
|
|
+ </div>
|
|
|
+ <div v-else>--</div> -->
|
|
|
+ </template>
|
|
|
+ <!-- 操作 -->
|
|
|
+ <template slot="action" slot-scope="text, record">
|
|
|
+ <a-button
|
|
|
+ v-if="$hasPermissions('B_rulesAddEdit')"
|
|
|
+ size="small"
|
|
|
+ type="link"
|
|
|
+ @click="handleEdit(record)"
|
|
|
+ class="button-info"
|
|
|
+ :id="'promotionDetail-edit-btn-'+record.id">编辑</a-button>
|
|
|
+ <a-button
|
|
|
+ v-if="$hasPermissions('B_rulesDel')"
|
|
|
+ size="small"
|
|
|
+ type="link"
|
|
|
+ @click="handleDel(record)"
|
|
|
+ class="button-error"
|
|
|
+ :id="'promotionDetail-del-btn-'+record.id">删除</a-button>
|
|
|
+ </template>
|
|
|
+ </s-table>
|
|
|
+ </a-card>
|
|
|
+ </a-spin>
|
|
|
+ <div class="affix-cont">
|
|
|
+ <a-button
|
|
|
+ type="primary"
|
|
|
+ class="button-info"
|
|
|
+ id="promotionDetail-submit"
|
|
|
+ size="large"
|
|
|
+ style="padding:0 40px;"
|
|
|
+ @click="handleSubmit"
|
|
|
+ :disabled="disabled"
|
|
|
+ v-if="$hasPermissions('B_rulesSubmit')&&(mainContentList&&mainContentList.length>0)">提交</a-button>
|
|
|
+ </div>
|
|
|
+ <!-- 查看参与客户 -->
|
|
|
+ <lookUp-customers-modal ref="lookUpCustomers" :openModal="openCustomerModal" @close="openCustomerModal = false"></lookUp-customers-modal>
|
|
|
+ <!-- 促销品费用归属品牌/促销品费用归属品类 -->
|
|
|
+ <brandCategoryModal :openType="openType" :openModal="openModal" @close="openModal = false"></brandCategoryModal>
|
|
|
+ <!-- 买产品送产品 弹窗 -->
|
|
|
+ <sendProductsModal :openModal="openSendProductsModal" :itemSn="detailSn" :promotionSn="$route.query.sn" @ok="$refs.table.refresh()" @close="openSendProductsModal = false"></sendProductsModal>
|
|
|
+ <!-- 买产品送采购额 弹窗 -->
|
|
|
+ <sendAmountModal :openModal="openSendAmountModal" :itemSn="detailSn" :promotionSn="$route.query.sn" @ok="$refs.table.refresh()" @close="openSendAmountModal = false"></sendAmountModal>
|
|
|
+ <!-- 特价产品 弹窗 -->
|
|
|
+ <specialOfferModal :openModal="openSpecialOfferModal" :itemSn="detailSn" :promotionSn="$route.query.sn" @ok="$refs.table.refresh()" @close="openSpecialOfferModal = false"></specialOfferModal>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import { commonMixin } from '@/utils/mixin'
|
|
|
+// 组件
|
|
|
+import { STable } from '@/components'
|
|
|
+import lookUpCustomersModal from '../promotionManagement/lookUpCustomersModal'
|
|
|
+import brandCategoryModal from './brandCategoryModal'
|
|
|
+import sendProductsModal from './sendProductsModal'
|
|
|
+import sendAmountModal from './sendAmountModal'
|
|
|
+import specialOfferModal from './specialOfferModal'
|
|
|
+// 接口
|
|
|
+import { getRuleQueryList, dealerPromotionInfo, promotionRulesDel, promotionSubmit } from '@/api/promotion'
|
|
|
+export default {
|
|
|
+ name: 'DealerPromotionManagementRule',
|
|
|
+ mixins: [commonMixin],
|
|
|
+ components: { STable, lookUpCustomersModal, brandCategoryModal, sendProductsModal, sendAmountModal, specialOfferModal },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ spinning: false,
|
|
|
+ fromRouter: null,
|
|
|
+ disabled: false, // 提交按钮是否可操作
|
|
|
+ detailData: null, // 详情数据
|
|
|
+ countData: null, // 数量数据
|
|
|
+ openModal: false, // 促销品费用归属品牌/促销品费用归属品类弹窗
|
|
|
+ openType: undefined, // 打开弹窗类型
|
|
|
+ isShowBisiceInfo: false, // 显示隐藏基础信息
|
|
|
+ openCustomerModal: false, // 查看客户弹窗
|
|
|
+ openSendProductsModal: false, // 买产品送产品弹窗
|
|
|
+ openSendAmountModal: false, // 买产品送采购额弹窗
|
|
|
+ openSpecialOfferModal: false, // 特价产品弹窗
|
|
|
+ // 加载数据方法 必须为 Promise 对象
|
|
|
+ loadData: parameter => {
|
|
|
+ this.disabled = true
|
|
|
+ this.spinning = true
|
|
|
+ const dataAjax = Object.assign(parameter, { promotionSn: this.$route.query.sn })
|
|
|
+ // 获取列表数据 无分页
|
|
|
+ return getRuleQueryList(dataAjax).then(res => {
|
|
|
+ let data
|
|
|
+ if (res.status == 200) {
|
|
|
+ data = res.data
|
|
|
+ for (var i = 0; i < data.length; i++) {
|
|
|
+ data[i].no = i + 1
|
|
|
+ }
|
|
|
+ this.disabled = false
|
|
|
+ }
|
|
|
+ this.spinning = false
|
|
|
+ this.mainContentList = data
|
|
|
+ return data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ detailSn: null, // 当前sn
|
|
|
+ mainContentList: [], // 列表数据
|
|
|
+ columns: [
|
|
|
+ { title: '序号', dataIndex: 'no', width: '6%', align: 'center' },
|
|
|
+ { title: '促销类型', dataIndex: 'promotionRuleTypeDictValue', width: '13%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '规则简称', dataIndex: 'description', width: '15%', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
+ { title: '规则门槛', scopedSlots: { customRender: 'cillProduct' }, width: '23%', align: 'center' },
|
|
|
+ { title: '规则', scopedSlots: { customRender: 'ruleProduct' }, width: '33%', align: 'left' },
|
|
|
+ { title: '操作', scopedSlots: { customRender: 'action' }, width: '10%', align: 'center' }
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 返回
|
|
|
+ handleBack () {
|
|
|
+ this.$router.push({ name: 'dealerPromotionManagement', query: { closeLastOldTab: true } })
|
|
|
+ },
|
|
|
+ // 基础信息详情
|
|
|
+ getDetail () {
|
|
|
+ dealerPromotionInfo({ sn: this.$route.query.sn }).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ this.$refs.table.refresh(true)
|
|
|
+ if (res.data && res.data.attachmentList) {
|
|
|
+ res.data.attachmentList.forEach(item => {
|
|
|
+ item.filePath = item.filePath.replace(/^http:\/\//i, 'https://')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.detailData = res.data || null
|
|
|
+ } else {
|
|
|
+ this.detailData = null
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 买产品送产品、买产品送采购额、特价产品 弹窗
|
|
|
+ openBtnModal (str) {
|
|
|
+ this.detailSn = null
|
|
|
+ const name = 'open' + str + 'Modal'
|
|
|
+ this[name] = true
|
|
|
+ },
|
|
|
+ // 查看客户
|
|
|
+ handleSee () {
|
|
|
+ this.openCustomerModal = true
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.$refs.lookUpCustomers.pageInit({ dealerSnList: this.detailData.dealerSnList ? this.detailData.dealerSnList : undefined })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 删除规则
|
|
|
+ handleDel (row) {
|
|
|
+ const _this = this
|
|
|
+ this.$confirm({
|
|
|
+ title: '提示',
|
|
|
+ content: '确认要该规则吗?',
|
|
|
+ centered: true,
|
|
|
+ onOk () {
|
|
|
+ _this.spinning = true
|
|
|
+ promotionRulesDel({ promotionSn: _this.$route.query.sn, promotionRuleSn: row.promotionRuleSn }).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ _this.$message.success(res.message)
|
|
|
+ _this.$refs.table.refresh()
|
|
|
+ _this.spinning = false
|
|
|
+ } else {
|
|
|
+ _this.spinning = false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 提交
|
|
|
+ handleSubmit () {
|
|
|
+ const _this = this
|
|
|
+ _this.disabled = true
|
|
|
+ promotionSubmit({ sn: _this.$route.query.sn }).then(res => {
|
|
|
+ if (res.status == 200) {
|
|
|
+ _this.$message.success(res.message)
|
|
|
+ _this.handleBack()
|
|
|
+ }
|
|
|
+ _this.disabled = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 编辑
|
|
|
+ handleEdit (row) {
|
|
|
+ this.detailSn = row.promotionRuleSn
|
|
|
+ if (row.promotionRuleType === 'BUY_PROD_GIVE_PROD') {
|
|
|
+ this.openSendProductsModal = true
|
|
|
+ } else if (row.promotionRuleType === 'BUY_PROD_GIVE_MONEY') {
|
|
|
+ this.openSendAmountModal = true
|
|
|
+ } else {
|
|
|
+ this.openSpecialOfferModal = true
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ if (!this.$store.state.app.isNewTab || this.outBizSubSn || this.bizSn) { // 页签刷新 或 为弹框时调用
|
|
|
+ this.getDetail()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ activated () {
|
|
|
+ // 如果是新页签打开或者进入新的子页(例:存在列表第2条数据编辑页页签时再打开第4条数据的编辑页),则重置当前页面
|
|
|
+ if (this.$store.state.app.isNewTab || !this.$store.state.app.isNewSubTab) {
|
|
|
+ this.getDetail()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ beforeRouteEnter (to, from, next) {
|
|
|
+ next(vm => {
|
|
|
+ vm.fromRouter = from
|
|
|
+ })
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+ .promotionRuleset-wrap{
|
|
|
+ position: relative;
|
|
|
+ height: 100%;
|
|
|
+ padding-bottom: 71px;
|
|
|
+ box-sizing: border-box;
|
|
|
+ transform: translateZ(0);
|
|
|
+ .promotionDetail-cont{
|
|
|
+ margin-bottom: 6px;
|
|
|
+ }
|
|
|
+ .btnGroup{
|
|
|
+ margin-bottom:15px;
|
|
|
+ }
|
|
|
+ .flex{
|
|
|
+ display:flex;
|
|
|
+ align-items: center;
|
|
|
+ }
|
|
|
+ .footer-cont{
|
|
|
+ margin-top: 5px;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .attachmentBox>a::after{
|
|
|
+ content:','
|
|
|
+ }
|
|
|
+ .attachmentBox>a:last-child::after{
|
|
|
+ content:''
|
|
|
+ }
|
|
|
+ /deep/.ant-descriptions-item-label .ant-descriptions-item-colon{
|
|
|
+ display:inline-block !important;
|
|
|
+ vertical-align: top;
|
|
|
+ max-width:10%;
|
|
|
+ }
|
|
|
+ /deep/.ant-descriptions-item-content{
|
|
|
+ display:inline-block !important;
|
|
|
+ max-width:89%;
|
|
|
+ vertical-align: top;
|
|
|
+ }
|
|
|
+ .footerBtn{
|
|
|
+ width: 100%;
|
|
|
+ text-align:center;
|
|
|
+ position:fixed;
|
|
|
+ bottom:0;
|
|
|
+ right:0px;
|
|
|
+ box-shadow: 0 0 20px #dcdee2;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|