From 1a82059e7247ef383a3b2f2442c8d6dab62a748d Mon Sep 17 00:00:00 2001
From: pengda <1111@qq.com>
Date: Thu, 26 Jun 2025 16:06:01 +0800
Subject: [PATCH] =?UTF-8?q?=E6=9C=8D=E5=8A=A1=E5=88=97=E8=A1=A8=E9=A1=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/site/tableEdit.svg       |   1 +
 src/router/index.js                 |  14 +-
 src/views/agent/siteList.vue        |   2 +-
 src/views/agent/siteServiceList.vue | 425 ++++++++++++++++++++++++++++++++++++
 4 files changed, 439 insertions(+), 3 deletions(-)
 create mode 100644 src/assets/site/tableEdit.svg
 create mode 100644 src/views/agent/siteServiceList.vue

diff --git a/src/assets/site/tableEdit.svg b/src/assets/site/tableEdit.svg
new file mode 100644
index 0000000..fa5d601
--- /dev/null
+++ b/src/assets/site/tableEdit.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="15.72998046875" height="15.7353515625" viewBox="0 0 15.72998046875 15.7353515625"><g><g><path d="M0.7850341796875,15.73539746875L14.9450341796875,15.73539746875L14.9450341796875,15.73373046875Q15.0223341796875,15.73373046875,15.0981341796875,15.71864646875Q15.1740341796875,15.70356346875,15.2454341796875,15.67397546875Q15.3168341796875,15.64438846875,15.3811341796875,15.60143446875Q15.4454341796875,15.55847946875,15.5001341796875,15.50380946875Q15.5547341796875,15.44913846875,15.5977341796875,15.38485346875Q15.6407341796875,15.32056746875,15.6702341796875,15.24913646875Q15.6998341796875,15.17770646875,15.7149341796875,15.10187646875Q15.7300341796875,15.02604616875,15.7300341796875,14.94873046875Q15.7300341796875,14.87141476875,15.7149341796875,14.79558446875Q15.6998341796875,14.71975446875,15.6702341796875,14.64832446875Q15.6407341796875,14.57689346875,15.5977341796875,14.51260746875Q15.5547341796875,14.44832246875,15.5001341796875,14.39365146875Q15.4454341796875,14.33898146875,15.3811341796875,14.29602646875Q15.3168341796875,14.25307246875,15.2454341796875,14.22348546875Q15.1740341796875,14.19389746875,15.0981341796875,14.17881446875Q15.0223341796875,14.16373046875,14.9450341796875,14.16373046875L14.9450341796875,14.16206346875L0.7850341796875,14.16206346875L0.7850341796875,14.16373046875Q0.7077184796875,14.16373046875,0.6318881796875,14.17881446875Q0.5560581796874999,14.19389746875,0.4846281796875,14.22348546875Q0.4131971796875,14.25307246875,0.3489111796875,14.29602646875Q0.28462617968750004,14.33898146875,0.2299551796875,14.39365146875Q0.17528517968750001,14.44832246875,0.13233017968750005,14.51260746875Q0.0893761796875,14.57689346875,0.05978917968749997,14.64832446875Q0.030201179687500024,14.71975446875,0.015118179687499955,14.79558446875Q0.000034179687499968914,14.87141476875,0.000034179687499968914,14.94873046875Q0.000034179687499968914,15.02604616875,0.015118179687499955,15.10187646875Q0.030201179687500024,15.17770646875,0.05978917968749997,15.24913646875Q0.0893761796875,15.32056746875,0.13233017968750005,15.38485346875Q0.17528517968750001,15.44913846875,0.2299551796875,15.50380946875Q0.28462617968750004,15.55847946875,0.3489111796875,15.60143446875Q0.4131971796875,15.64438846875,0.4846281796875,15.67397546875Q0.5560581796874999,15.70356346875,0.6318881796875,15.71864646875Q0.7077184796875,15.73373046875,0.7850341796875,15.73373046875L0.7850341796875,15.73539746875Z" fill-rule="evenodd" fill="#8A9099" fill-opacity="1"/></g><g><path d="M9.9441694921875,0.23024209375000004L9.9437094921875,0.23069709375000003L1.8036394921875,8.38052109375Q1.6931454921875,8.49115109375,1.6333544921874998,8.63562109375Q1.5735624921875,8.78009109375,1.5735624921875,8.93645109375L1.5735624921875,11.79992109375Q1.5735624921875,11.87742109375,1.5886784921875,11.95342109375Q1.6037934921875001,12.02942109375,1.6334444921875,12.10102109375Q1.6630944921875002,12.17262109375,1.7061404921875,12.23702109375Q1.7491854921874999,12.30142109375,1.8039724921875,12.35622109375Q1.8587584921875,12.41102109375,1.9231804921875,12.45402109375Q1.9876034921875,12.49712109375,2.0591854921875,12.52672109375Q2.1307674921875,12.55642109375,2.2067584921875,12.57152109375Q2.2827495921875,12.58662109375,2.3602294921875,12.58662109375L5.2383294921875,12.58662109375Q5.3948494921875,12.58662109375,5.5394494921875,12.52672109375Q5.6840494921874996,12.46682109375,5.794709492187501,12.35612109375L13.9299294921875,4.21727109375Q13.9847294921875,4.16249109375,14.0277294921875,4.09808109375Q14.0707294921875,4.03367109375,14.1004294921875,3.96210109375Q14.1300294921875,3.89054109375,14.1451294921875,3.81457109375Q14.1602294921875,3.73860109375,14.1602294921875,3.66114109375Q14.1602294921875,3.58368109375,14.1451294921875,3.50771109375Q14.1300294921875,3.43174109375,14.1004294921875,3.36017109375Q14.0707294921875,3.28861109375,14.0277294921875,3.22420109375Q13.9847294921875,3.15979109375,13.9299294921875,3.10500109375L11.0566794921875,0.23048609374999995Q11.0019094921875,0.17568709375000002,10.9374994921875,0.13262709375000004Q10.8730794921875,0.08956809374999997,10.8015094921875,0.059902093749999996Q10.7299294921875,0.030236093750000026,10.6539394921875,0.015104093749999992Q10.5779594921875,-0.000028906249999960387,10.5004794921875,-0.000045906250000005144Q10.4229994921875,-0.0000629062500000499,10.3469994921875,0.015036093750000035Q10.271009492187499,0.030135093750000008,10.1994194921875,0.059770093749999975Q10.1278294921875,0.08940409375000002,10.0633994921875,0.13243609374999998Q9.9989694921875,0.17546709375000002,9.9441694921875,0.23024209375000004ZM10.5005194921875,1.89959109375L3.1468964921875,9.26202109375L3.1468964921875,11.01332109375L4.9123794921875,11.01332109375L12.2612894921875,3.66114109375L10.5005194921875,1.89959109375Z" fill-rule="evenodd" fill="#8A9099" fill-opacity="1"/></g></g></svg>
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index 346aec7..1b39a99 100755
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -8,7 +8,7 @@ import HomeView from '../views/HomeView.vue';
 Vue.use(VueRouter)
 // 侧边导航黑名单
 const blackSliderList = [
-  '/register', '/franchise'
+  '/register', '/franchise','/agent/siteServiceList'
 ];
 // 一级路由
 let first_child_router = []
@@ -80,6 +80,17 @@ const routes = [{
     }
   },
   {
+    path: '/agent/siteServiceList',
+    name: '服务列表',
+    isFirst: true,
+    component: () => import( /* webpackChunkName: "siteList" */ '../views/agent/siteServiceList.vue'),
+    meta: {
+      title: '服务列表',
+      breadcrumbParent: '站点列表',
+      // hideBreadcrumb: true // 一级页面不显示面包屑
+    }
+  },
+  {
     path: '/agent/siteBaseSetting',
     name: '站点基本设置',
     component: () => import( /* webpackChunkName: "siteList" */ '../views/agent/siteBaseSetting.vue'),
@@ -399,7 +410,6 @@ router.beforeEach((to, from, next) => {
   } else {
     store.commit('SET_HEADER', true); // 其他页面显示顶部
   }
-  store.commit('SET_BREADRIGHTTEXT', '')//清空面包屑右侧内容
   store.dispatch('showLoading')
   next();
 });
diff --git a/src/views/agent/siteList.vue b/src/views/agent/siteList.vue
index 962b394..6ffd992 100644
--- a/src/views/agent/siteList.vue
+++ b/src/views/agent/siteList.vue
@@ -141,7 +141,7 @@ export default {
             // 分组id
             gid: 0,
             // 服务列表url
-            serviceListUrl: '/ui',
+            serviceListUrl: '/agent/siteServiceList',
             // 站点设置url
             siteSettingUrl: '/agent/siteBaseSetting',
             // 新增站点url
diff --git a/src/views/agent/siteServiceList.vue b/src/views/agent/siteServiceList.vue
new file mode 100644
index 0000000..5a4f288
--- /dev/null
+++ b/src/views/agent/siteServiceList.vue
@@ -0,0 +1,425 @@
+<template>
+    <div class="main-content12">
+        <div class="flex-common">
+            <h3>服务列表</h3>
+            <div class="warning-text">
+                <img class="warning-icon" src="@/assets/site/info_filled.svg" alt="">
+                <span>PC端站点使用的“科技清新蓝”模板仅支持AI相关服务，列表中置灰的服务不支持。可编辑置灰服务，但需更换模板才能在PC端站点显示。</span>
+            </div>
+
+            <!-- page header -->
+            <div class="pageheader">
+                <div class="pageheader-left">
+                    <el-checkbox @change="toggleAllSelection">全选</el-checkbox>
+                    <span class="checked-text">共80条，已选0条</span>
+                    <GuipButton type="ignore" :btnstyle="btnInfostyleObj">批量删除</GuipButton>
+                </div>
+                <div class="pageheader-right">
+                    <GuipButton type="primary" :btnstyle="btnstyleObj">添加查重服务</GuipButton>
+                    <GuipButton type="primary" :btnstyle="btnstyleObj">添加写作辅助</GuipButton>
+                    <GuipButton type="primary" :btnstyle="btnstyleObj">添加AIGC</GuipButton>
+                </div>
+            </div>
+
+            <!-- page content -->
+            <el-form>
+                <GuipTable :tableData="serviceList" ref="multipleTable" @selectChange="handleSelectionChange" autoColumn="true" :loading="tableLoading">
+
+                    <el-table-column label="选择" width="70" header-align="center" align="center">
+                        <template slot-scope="scope">
+                            <el-checkbox @change="toggleSelection(scope.row)"></el-checkbox>
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column prop="type_desc" label="服务版本"></el-table-column>
+                    <el-table-column prop="supply_price_desc" label="今日供货价">
+                        <template slot-scope="scope">
+                            <div class="flex cell_render">
+                                {{ scope.row.supply_price_desc }}
+                                <svg-icon :size="16" :path="require('@/assets/site/tableEdit.svg')" :color="'#8A9099'" :hoverColor="'#006AFF'" />
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="price_desc" label="售价">
+                        <template slot-scope="scope">
+                            <div class="flex cell_render">
+                                {{ scope.row.price_desc }}
+                                <svg-icon :size="16" :path="require('@/assets/site/tableEdit.svg')" :color="'#8A9099'" :hoverColor="'#006AFF'" />
+                            </div>
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column prop="payment_method_desc" label="收款方式">
+                        <template slot-scope="scope">
+                            <div class="flex cell_render">
+                                <span class="default-pay-method">{{scope.row.payment_method_desc}}</span>
+                                <svg-icon :size="16" :path="require('@/assets/site/tableEdit.svg')" :color="'#8A9099'" :hoverColor="'#006AFF'" />
+                            </div>
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column prop="sort_id" label="排序">
+                        <template slot-scope="scope">
+                            <div class="flex cell_render">
+                                {{ scope.row.sort_id }}
+                                <svg-icon :size="16" :path="require('@/assets/site/tableEdit.svg')" :color="'#8A9099'" :hoverColor="'#006AFF'" />
+                            </div>
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column prop="sort_id" label="上首页">
+                        <template slot-scope="scope">
+                            <div class="flex cell_render">
+                                <GuipSwitch :modelValue="scope.row.sort_id" activeText="默认类型" @change="onSwitchChange"></GuipSwitch>
+                            </div>
+                        </template>
+                    </el-table-column>
+
+                    <el-table-column label="操作" fixed="right">
+                        <template slot-scope="scope">
+                            <el-link type="primary" :href="serviceListUrl+'?uid='+scope.row.uid" target="_blank" class="mr-16">编辑</el-link>
+                            <el-link type="primary" :href="siteSettingUrl+'?uid='+scope.row.uid" target="_blank">删除</el-link>
+                        </template>
+                    </el-table-column>
+
+                </GuipTable>
+            </el-form>
+        </div>
+    </div>
+</template>
+
+<script>
+
+import store from '@/store';
+import GuipButton from "@/components/GuipButton.vue";
+import GuipTable from "@/components/GuipTable.vue";
+import GuipDialog from "@/components/GuipDialog.vue";
+import SvgIcon from "@/components/SvgIcon.vue";
+import GuipInput from "@/components/GuipInput.vue";
+import GuipSwitch from "@/components/GuipSwitch.vue";
+
+export default {
+    name: 'siteServiceList',
+    components: {
+        GuipSwitch,
+        // eslint-disable-next-line vue/no-unused-components
+        GuipInput, SvgIcon, GuipDialog, GuipTable,
+        GuipButton
+
+    },
+    data() {
+        return {
+            // AUTH
+            token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTAwNTM3MjQsIm5iZiI6MTc1MDA1MzcyNCwiZXhwIjoxNzUyNjQ1NzI0LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.xyIqBLelB-k6jCifgRevBJTyg_Qrm6m1e4OcHhOpepU',
+            //删除按钮样式
+            btnInfostyleObj:{
+                width: '99px',
+                height: '32px',
+                borderRadius: '2px',
+            },
+            //添加按钮样式
+            btnstyleObj: {
+                width: '114px',
+                height: '32px',
+                borderRadius: '4px',
+                background: '#006AFF',
+            },
+            // 表格加载
+            tableLoading: false,
+            //站点id
+            uid:0,
+            //站点简称
+            siteShortName: "",
+            // 站点列表
+            serviceList: [],
+
+
+
+
+            // 站点分组
+            siteGroups: [],
+            // 分组id
+            gid: 0,
+            // 服务列表url
+            serviceListUrl: '/ui',
+            // 站点设置url
+            siteSettingUrl: '/agent/siteBaseSetting',
+            // 新增站点url
+            addNewSiteUrl: '/ui',
+            popoverFlag:false,
+            // 站点分组名称
+            selected_group: '',
+            isUpIco: false,
+            currentIcon: require('@/assets/site/drop_icon.svg'),
+            currentGroup: '',
+            fitlerIcon: require('@/assets/site/filter.svg'),
+            // 手机服务
+            phoneServices: [
+                {'id': 0,  value: '不限' },
+                {'id': 1,  value: '微信H5' },
+                {'id': 2,  value: '小程序' },
+            ],
+            // 当前选中的手机服务
+            currentPhoneService: '',
+            // 添加分组弹框显示标识
+            addGroupDialogVisible: false,
+            // 取消按钮显示
+            showCancelButton: true,
+            // 确定按钮显示
+            groupname: '',
+        }
+    },
+    created() {
+        if(!this.$route.query.uid) {
+            this.$message.error('非法请求');
+            this.$router.push('/agent/siteList')
+        }
+        this.uid = this.$route.query.uid;
+    },
+    mounted() {
+        store.commit('SET_BREADRIGHTTEXT', '跳转链接');
+        this.getSiteServiceList();
+    },
+    methods: {
+        toggleAllSelection() {
+            this.$refs.multipleTable.$refs.guiptable.toggleAllSelection();
+        },
+        toggleSelection(row){
+            console.log(row)
+        },
+        // 获取服务列表
+        getSiteServiceList() {
+            this.tableLoading = true
+            const that = this
+            that.serviceList = []
+            this.$http('POST', '/agentnew/ajax_get_service_list', {
+                uid: this.uid,
+            },{
+                headers:{
+                    'Auth': this.token
+                }
+            }).then(response => {
+                this.tableLoading = false
+                this.$nextTick(() => {
+                    that.serviceList = response.data.service_list
+                })
+            }).catch(error => {
+                console.error(error, 'error')
+            })
+        },
+        // 获取站点分组
+        getSiteGroups() {
+            const that = this
+            that.siteGroups = []
+            this.$http('POST', '/agentnew/ajax_get_site_groups', {
+                gid: this.gid,
+            },{
+                headers:{
+                    'Auth': this.token
+                }
+            }).then(response => {
+                this.$nextTick(() => {
+                    that.siteGroups = response.data
+                })
+            }).catch(error => {
+                console.error(error, 'error')
+            })
+        },
+        // 点击站点分组单元格时触发
+        groupSetting(row, index) {
+            // 如果已经打开当前行的弹框，则关闭
+            if (row.showPopover === true) {
+                row['showPopover'] = false;
+                // 切换图标
+                this.toggleIcon();
+
+                return;
+            }
+
+            // 如果存在分组 则显示已设置分组
+            if (row.group) {
+                this.selected_group = row.group;
+            }
+
+            // 关闭其他行的弹框
+            this.popoverFlag = true;
+            this.siteList.forEach((item, i) => {
+                if (i !== index) {
+                    item['showPopover'] = false;
+                }
+            });
+            // 打开当前行的弹框
+            row['showPopover'] = true;
+
+            // 切换图标
+            this.toggleIcon();
+        },
+        // 保存站点分组
+        addSiteGroupIndex(row) {
+            this.$http('POST', '/agentnew/ajax_add_site_group_index', {
+                groupid: this.selected_group,
+                uid: row.uid,
+            },{
+                headers:{
+                    'Auth': this.token
+                }
+            }).then(response => {
+                if (response.status) {
+                    // 保存成功弹层提示
+                    this.$Message.success(response.info);
+
+                    // 更新分组名称
+                    this.siteGroups.forEach((item) => {
+                        if (item.id === this.selected_group) {
+                            row['group'] = item.name;
+                        }
+                    });
+                    row['groupid'] = this.selected_group; // 更新价格
+                    row['showPopover'] = false; // 关闭弹框
+                    this.$set(this.siteList, row)
+                    this.currentIcon = require('@/assets/site/drop_icon.svg');
+                } else {
+                    this.$Message.error(response.info);
+                }
+            }).catch(error => {
+                console.error(error, 'error')
+            })
+        },
+        // 取消编辑
+        cancleGroupIndexSetting(row) {
+            // 关闭弹框
+            row['showPopover'] = false;
+            this.popoverFlag = false
+            // row[type + '_popover'] = false; // 关闭弹框
+            this.currentIcon = require('@/assets/site/drop_icon.svg');
+            this.$Message.info('已取消编辑');
+
+        },
+        toggleIcon() {
+            this.isUpIco = !this.isUpIco; // 切换状态
+
+            // 根据状态更新图标和颜色
+            if (this.isUpIco) {
+                this.currentIcon = require('@/assets/site/up_icon.svg'); // 向上图标
+            } else {
+                this.currentIcon = require('@/assets/site/drop_icon.svg'); // 向下图标
+            }
+        },
+        // 表格点击、选择
+        handleSelectionChange(data) {
+            // 多选模式下的时候 data 为数组格式
+            // 单选的时候是 对象
+            console.log(data, '表格行信息');
+        },
+        // 弹框相关方法---start
+        showAddGroup() {
+            this.addGroupDialogVisible = true;
+        },
+        // 确认按钮事件
+        addGroup() {
+            this.addGroupDialogVisible = false;
+
+            this.$http('POST', '/agentnew/ajax_add_site_group', {
+                name: this.groupname,
+            },{
+                headers:{
+                    'Auth': this.token
+                }
+            }).then(response => {
+                this.$nextTick(() => {
+                    if (response.status) {
+                        this.$Message.success(response.info);
+                        // 更新分组
+                        this.getSiteGroups()
+                        // 清空分组名称
+                        this.groupname = ''
+                    } else {
+                        this.$Message.error(response.info);
+                    }
+                })
+            }).catch(error => {
+                console.error(error, 'error')
+            })
+        },
+        // 取消按钮事件
+        cancleAddGroup() {
+            this.addGroupDialogVisible = false;
+        },
+        // 关闭弹框事件
+        closeAddGroup() {
+            this.addGroupDialogVisible = false;
+        },
+        addGroupDialogVisibleChange(data) {
+            console.log(data, 'data098908090');
+        },
+        // 弹框相关方法---end
+        addNewSite() {
+            window.open(this.addNewSiteUrl, '_blank');
+        }
+    },
+}
+</script>
+<style lang="scss" scoped>
+.warning-text{
+  display: flex;
+  align-items: center;
+  padding: 8px 37px;
+  align-self: stretch;
+  z-index: 1;
+  border-radius: 4px;
+  background: #FFF1F0;
+  border: 1px solid #FFA39E;
+  .warning-icon{
+    width: 16px;
+    height: 16px;;
+    margin-right: 8px;
+  }
+  span{
+    color: #1E2226;
+    letter-spacing: 0.08em;
+  }
+}
+.pageheader {
+  display: flex;
+  justify-content: space-between; /* 关键属性 */
+  align-items: center;
+  margin: 16px 0px 16px 0px;
+}
+.pageheader-left {
+  display: flex;
+  gap: 15px;
+  align-items: center
+}
+.checked-text{
+  line-height: 13px;
+  letter-spacing: 0.08em;
+  color: #8A9099;
+  font-size: 12px;
+}
+.pageheader-right{
+  display: flex;
+  gap: 15px;
+}
+
+.pagetitle {
+  font-size: 18px;
+  font-weight: bold;
+  line-height: normal;
+  letter-spacing: 0.08em;
+  color: #1E2226;
+  margin-top:8px;
+}
+.default-pay-method{
+  width: 110px;
+  height: 22px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 2px 10px;
+  gap: 6px;
+  z-index: 0;
+  border: 1px solid #DFE2E6;
+  border-radius: 4px;
+  background: #F6F7FA;
+}
+</style>
\ No newline at end of file