You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
295 lines
15 KiB
295 lines
15 KiB
5 days ago
|
<template>
|
||
|
|
<div>
|
||
|
|
<div class="step3-wrap min-flex">
|
||
|
|
<div class="step3-top flex-common">
|
||
|
|
<h3 class="flex gap8"><img src="@/assets/menu/littleTitleIcon1.svg" alt="">服务列表</h3>
|
||
|
|
<div class="btngroup">
|
||
|
|
<GuipButton type="ignore" :btnstyle="{ width: '97px', height: '33px' }" @click="serviceAdd(1)">添加查重服务</GuipButton>
|
||
|
|
<GuipButton type="ignore" :btnstyle="{ width: '97px', height: '33px' }" @click="serviceAdd(3)">添加写作辅助</GuipButton>
|
||
|
|
<GuipButton type="ignore" :btnstyle="{ width: '97px', height: '33px' }" @click="serviceAdd(2)">添加AIGC</GuipButton>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div>
|
||
|
|
<div class="flex-common table-wrap">
|
||
|
|
<el-form>
|
||
|
|
<GuipTable :border="true" :tableData="tableData" :loading="tableLoading">
|
||
|
|
<el-table-column prop="name" fixed="left" label="检测服务" width="200">
|
||
|
|
<template slot-scope="scope">
|
||
|
|
<div class="flex nowrap ">
|
||
|
|
<div :class="(scope.row.type == 'a' ? 'green' : 'blue')">{{ scope.row.type == 'a' ? '查重服务' : '写作辅助'
|
||
|
|
}}</div>
|
||
|
|
<div class="">{{ scope.row.name }}</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="stock" label="今日供货价" min-width="138">
|
||
|
|
<template slot-scope="scope">
|
||
|
|
<div class="flex cell_render">
|
||
|
|
<span>¥{{ scope.row.stock }}/篇</span>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="price" label="售价" width="300">
|
||
|
|
<template #default="{ row,$index }">
|
||
|
|
<el-popover v-model="row.pricePopoverVisible" :ref="`pricePopover-${row.id}`"
|
||
|
|
placement="bottom" trigger="manual" :append-to-body="false" :visible-arrow="true"
|
||
|
|
popper-class="custom-popover" @show="popshow" >
|
||
|
|
<div style="text-align: center">
|
||
|
|
<GuipInput ref="GuipInput" v-if="!row.word" width="252px" v-model="row.edit_price" label="售价"
|
||
|
|
placeholder="请输入售价" unit="元">
|
||
|
|
</GuipInput>
|
||
|
|
<div v-else class="flex">
|
||
|
|
<GuipInput ref="GuipInput" width="133px" v-model="row.edit_price" label="售价" placeholder="请输入售价"
|
||
|
|
unit="元">
|
||
|
|
</GuipInput>
|
||
|
|
<span class="shortspan">/</span>
|
||
|
|
<GuipInput ref="GuipInput" width="133px" v-model="row.edit_word" placeholder="请输入字符" unit="字符">
|
||
|
|
</GuipInput>
|
||
|
|
</div>
|
||
|
|
<div class="flex" style="text-align: right; margin-top: 32px;justify-content: flex-end;">
|
||
|
|
<GuipButton size="medium" @click="cancelEdit(row, 'price')">取消</GuipButton>
|
||
|
|
<GuipButton type="primary" @click="savePrice(row, 'price')" size="medium">确定</GuipButton>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<template #reference>
|
||
|
|
<div class="flex cell_render" @click="handlePriceClick(row,$index,'price')">
|
||
|
|
<span v-if="row.word" :key="random()">¥{{ row.price }}/{{ row.word }}字</span>
|
||
|
|
<span v-else :key="random()">¥{{ row.price }}/篇</span>
|
||
|
|
<span>测试用一下</span>
|
||
|
|
<span>随便写的</span>
|
||
|
|
<svg-icon :size="16" :path="require('@/assets/register/tableEdit.svg')" :color="'#8A9099'"
|
||
|
|
:hoverColor="'#006AFF'" />
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-popover>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
|
||
|
|
<el-table-column prop="num" label="排序" min-width="95">
|
||
|
|
<template #default="{ row,$index }">
|
||
|
|
<!-- <el-tooltip :manual="true" v-model="row.numPopoverVisible" placement="top" effect="light">
|
||
|
|
<template #content>
|
||
|
|
<div style="text-align: center">
|
||
|
|
<GuipInput ref="GuipInput" width="252px" v-model="row.edit_num" label="排序" placeholder="请输入数字">
|
||
|
|
</GuipInput>
|
||
|
|
<p
|
||
|
|
style="width: 252px;margin-left: 40px;text-align: right;color: #8A9099;letter-spacing: 0.08em;">
|
||
|
|
输入＞0的数，越小排序越前；重复则新者优先；0则默认排序</p>
|
||
|
|
<div class="flex" style="text-align: right; margin-top: 32px;justify-content: flex-end;">
|
||
|
|
<GuipButton size="medium" @click="cancelEdit(row, 'num')">取消</GuipButton>
|
||
|
|
<GuipButton type="primary" @click="savePrice(row, 'num')" size="medium">确定</GuipButton>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<div class="flex cell_render" @click="row.numPopoverVisible = true">
|
||
|
|
<span>{{ row.num }}</span>
|
||
|
|
<svg-icon :size="16" :path="require('@/assets/register/tableEdit.svg')" :color="'#8A9099'"
|
||
|
|
:hoverColor="'#006AFF'" />
|
||
|
|
</div>
|
||
|
|
</el-tooltip> -->
|
||
|
|
<el-popover v-model="row.numPopoverVisible" :ref="`popover-${row.id}`"
|
||
|
|
placement="bottom" trigger="manual" :append-to-body="false" :visible-arrow="true"
|
||
|
|
popper-class="custom-popover" @show="popshow" >
|
||
|
|
<!-- <el-popover v-model="row.numPopoverVisible" placement="top" class="single-popover" trigger="manual" :append-to-body="false" :ref="`popover-${row.id}`"> -->
|
||
|
|
<div style="text-align: center" :visible-arrow="true">
|
||
|
|
<GuipInput ref="GuipInput" width="252px" v-model="row.edit_num" label="排序" placeholder="请输入数字">
|
||
|
|
</GuipInput>
|
||
|
|
<p
|
||
|
|
style="width: 252px;margin-left: 40px;text-align: right;color: #8A9099;letter-spacing: 0.08em;">
|
||
|
|
输入＞0的数，越小排序越前；重复则新者优先；0则默认排序</p>
|
||
|
|
<div class="flex" style="text-align: right; margin-top: 32px;justify-content: flex-end;">
|
||
|
|
<GuipButton size="medium" @click="cancelEdit(row, 'num')">取消</GuipButton>
|
||
|
|
<GuipButton type="primary" @click="savePrice(row, 'num')" size="medium">确定</GuipButton>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<span slot="reference" @click="handlePriceClick(row,$index,'num')">
|
||
|
|
<div class="flex cell_render">
|
||
|
|
<GuipToolTip :content="row.num">
|
||
|
|
<span class="nowrap">{{ row.num }}</span>
|
||
|
|
</GuipToolTip>
|
||
|
|
<svg-icon :size="16" :path="require('@/assets/register/tableEdit.svg')" :color="'#8A9099'"
|
||
|
|
:hoverColor="'#006AFF'" />
|
||
|
|
</div>
|
||
|
|
</span>
|
||
|
|
</el-popover>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="stock" label="收款方式" min-width="258">
|
||
|
|
<template slot-scope="scope">
|
||
|
|
<div class="flex cell_render">
|
||
|
|
<span :class="(scope.row.payment == '0' ? 'normal_payment' : 'self_payment')">
|
||
|
|
{{ scope.row.payment == '0' ? '默认站点支付' : '自定义支付' }}</span>
|
||
|
|
<svg-icon :size="16" :path="require('@/assets/register/tableEdit.svg')"
|
||
|
|
:color="'#8A9099'" :hoverColor="'#006AFF'" />
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="stock" fixed="right" label="上首页" min-width="160">
|
||
|
|
<template slot-scope="scope">
|
||
|
|
<GuipSwitch :modelValue="scope.row.homeFlag">
|
||
|
|
</GuipSwitch>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column label="操作" fixed="right" min-width="150px">
|
||
|
|
<div class="flex">
|
||
|
|
<el-button type="text">编辑</el-button>
|
||
|
|
<el-button type="text">删除</el-button>
|
||
|
|
</div>
|
||
|
|
</el-table-column>
|
||
|
|
</GuipTable>
|
||
|
|
|
||
|
|
<el-pagination background @size-change='handleSizeChange' @current-change='handleCurrentChange'
|
||
|
|
:current-page="currentPage" :page-size=pageSize layout="prev, pager, next,jumper"
|
||
|
|
:total="tableData.length">
|
||
|
|
</el-pagination>
|
||
|
|
</el-form>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="register-btns">
|
||
|
|
<GuipButton type="system" :btnstyle="{ width: '144px', height: '46px' }" @click="jumpStep">跳过</GuipButton>
|
||
|
|
<GuipButton type="primary" :btnstyle="{ width: '144px', height: '46px' }" @click="nextStep">完成</GuipButton>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
|
||
|
|
|
||
|
|
import GuipButton from "@/components/GuipButton.vue";
|
||
|
|
import GuipInput from "@/components/GuipInput.vue";
|
||
|
|
import GuipToolTip from "@/components/GuipToolTip.vue";
|
||
|
|
import SvgIcon from "@/components/SvgIcon.vue";
|
||
|
|
import GuipSwitch from "@/components/GuipSwitch.vue";
|
||
|
|
import GuipTable from "@/components/GuipTable.vue";
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'domainSet',
|
||
|
|
props: {
|
||
|
|
siteInfo: {
|
||
|
|
type: Object,
|
||
|
|
required: true
|
||
|
|
}
|
||
|
|
},
|
||
|
|
components: {
|
||
|
|
GuipTable, GuipSwitch, SvgIcon, GuipToolTip, GuipInput,
|
||
|
|
GuipButton
|
||
|
|
|
||
|
|
},
|
||
|
|
data(){
|
||
|
|
return {
|
||
|
|
token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
|
||
|
|
tableData:[],
|
||
|
|
tableLoading:false,
|
||
|
|
currentPage: 1, //当前页
|
||
|
|
pageSize: 2, //每页的容量
|
||
|
|
total: 0, //列表总数
|
||
|
|
// 服务列表url
|
||
|
|
serviceAddUrl: '/agent/siteAddService',
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
if(Object.keys(this.siteInfo).length === 0) {
|
||
|
|
this.$message.error('未知错误');
|
||
|
|
this.$emit('handelStep', 1)
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods:{
|
||
|
|
jumpStep(){
|
||
|
|
this.$emit('handelStep', 4)
|
||
|
|
},
|
||
|
|
nextStep(){
|
||
|
|
//保存数据
|
||
|
|
|
||
|
|
this.$emit('handelStep', 4)
|
||
|
|
},
|
||
|
|
|
||
|
|
|
||
|
|
handleSizeChange(val) {
|
||
|
|
this.pageSize = val
|
||
|
|
},
|
||
|
|
handleCurrentChange(val) {
|
||
|
|
this.currentPage = val
|
||
|
|
},
|
||
|
|
serviceAdd(prodid){
|
||
|
|
this.$router.push(this.serviceAddUrl + '?uid=' + this.siteInfo.uid + '&prodid=' + prodid)
|
||
|
|
},
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
handleEvent(data){
|
||
|
|
this.newDomain = data
|
||
|
|
},
|
||
|
|
saveConfirm() {
|
||
|
|
let obj = {}
|
||
|
|
obj.uid = this.info.uid
|
||
|
|
obj.type = this.info.type
|
||
|
|
if(this.domainFrom === '1'){
|
||
|
|
if(!this.newDomain.prefix || !this.newDomain.domain) return false
|
||
|
|
obj.domain = this.newDomain.prefix + this.newDomain.domain
|
||
|
|
}else{
|
||
|
|
obj.domain = ''
|
||
|
|
}
|
||
|
|
|
||
|
|
const that = this
|
||
|
|
this.$http('POST', '/agentnew/ajax_update_service_domain', obj,{
|
||
|
|
headers:{
|
||
|
|
'Auth': this.token
|
||
|
|
}
|
||
|
|
}).then(response => {
|
||
|
|
if(response.status){
|
||
|
|
that.$message.success('保存成功');
|
||
|
|
|
||
|
|
//替换域名
|
||
|
|
const protocol = new URL(that.info.domain).protocol;
|
||
|
|
if(this.domainFrom === '1'){
|
||
|
|
that.info.domain = protocol + "//" +obj.domain;
|
||
|
|
that.info.ser_domain = protocol + "//" +obj.domain;
|
||
|
|
}else{
|
||
|
|
that.info.domain = that.info.site_domain;
|
||
|
|
that.info.ser_domain = '';
|
||
|
|
}
|
||
|
|
|
||
|
|
that.$emit('saveEvent', that.info)
|
||
|
|
return true;
|
||
|
|
}
|
||
|
|
that.$message.error(response.info);
|
||
|
|
}).catch(error => {
|
||
|
|
console.error(error, 'error')
|
||
|
|
})
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style lang="scss">
|
||
|
|
.step3-wrap {
|
||
|
|
flex: 1;
|
||
|
|
|
||
|
|
.step3-top {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
padding-bottom: 0;
|
||
|
|
align-items: end;
|
||
|
|
h3{
|
||
|
|
margin: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.btngroup {
|
||
|
|
display: flex;
|
||
|
|
height: 33px;
|
||
|
|
|
||
|
|
button {
|
||
|
|
font-size: 12px;
|
||
|
|
margin-left: 12px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|