+
+
+ {{ item.label }}
+ 
+
+
+
+
-
+
- 
新增分组
+
+ 
新增分组
+
@@ -23,74 +45,101 @@
-
-
-
+
+
+
+
+
+
-
+ -->
+
+
+
-
-
@@ -113,30 +167,80 @@
import Footer from '@/components/Footer.vue';
// import GuipInput from '@/components/GuipInput.vue';
import GuipButton from '@/components/GuipButton.vue';
-
+// import GuipSelect from '@/components/GuipSelect.vue';
+import GuipSelectFilter from '@/components/GuipSelectFilter.vue';
+import GuipDialog from '@/components/GuipDialog.vue';
+// import SearchableSelect from '@/components/GuipSelectFilter1.vue';
+// import GuipSelectFilter2 from '@/components/GuipSelectFilter2.vue';
+// import SearchableSelect from '@/components/GuipSelectFilter2.vue'
export default {
name: 'sitelist',
components: {
// HelloWorld
// GuipInput,
+ GuipDialog,
+ GuipSelectFilter,
+ // SearchableSelect,
+ // GuipSelectFilter2,
+ // SearchableSelect,
+ // GuipSelect,
Footer,
GuipButton
},
data() {
return {
+ searchText: '',
+ filteredOptions: this.options,
+ editingIndex: -1,
+ groupName: '',//分组名称
+ addGroupVisiable: false,
+ selectedValue: '',
+ fruitOptions: [
+ { label: '苹果', value: 'apple' },
+ { label: '香蕉', value: 'banana' },
+ { label: '橙子', value: 'orange' },
+ { label: '葡萄', value: 'grape' },
+ { label: '西瓜', value: 'watermelon' },
+ { label: '菠萝', value: 'pineapple' }
+ ],
+ options: [
+ { label: '选项1', value: '1' },
+ { label: '选项2', value: '2' },
+ { label: '选项3', value: '3' },
+ // 更多选项...
+ ],
+ selectedValue1: '',
+ options1: [
+ { label: '苹果', value: '1' },
+ { label: '香蕉', value: '2' },
+ { label: '橙子', value: '22' },
+ { label: '葡萄', value: '13' },
+ { label: '西瓜', value: '31' },
+ { label: '菠萝', value: '32' },
+ { label: '菠萝1', value: '14' },
+ { label: '菠萝2', value: '15' },
+ { label: '菠萝21', value: '156' },
+ { label: '菠萝22', value: '24' },
+ ],
+ btnstyleObj_add: {
+ width: '90px',
+ height: '30px'
+ },
tableData: [
{
name: '哈哈哈',
+ link: 'http://www.chachongz.com',
registerDate: '2025.02.18',
group: '1',
- phoneService: '',
+ phoneService: '撒大事',
status: '1',//配置中中
},
{
name: '知网学诚教育',
+ link: 'http://new.checkcopy.com',
registerDate: '2025.02.18',
group: '2',
- phoneService: '',
+ phoneService: '设计部',
status: '0',//运行中
},
],
@@ -175,7 +279,79 @@ export default {
]
}
},
+ mounted() {
+ const list = ['group', 'status']
+ list.forEach(item => {
+ this.tableData = this.tableData.map(item1 => {
+ item1[item + '_popover'] = false
+ return {
+ ...item1,
+ }
+ })
+ })
+ console.log(this.tableData, '000--');
+
+ },
methods: {
+ // 处理搜索输入
+ handleSearch(keyword) {
+ console.log(keyword,'keyword---');
+ if (this.filterMethod && typeof this.filterMethod === 'function') {
+ // 使用自定义筛选方法
+ this.filteredOptions = this.filterMethod(keyword, this.options)
+ } else {
+ // 默认筛选方法
+ if (!keyword) {
+ this.filteredOptions = this.options
+ } else {
+ const lowerKeyword = keyword.toLowerCase()
+ this.filteredOptions = this.options.filter(item => {
+ const label = item[this.labelKey] || ''
+ return label.toString().toLowerCase().includes(lowerKeyword)
+ })
+ }
+ }
+ },
+ startEditing(index) {
+ this.editingIndex = index
+ // 保存原始数据以便取消编辑时恢复
+ this.originalData = JSON.parse(JSON.stringify(this.tableData[index]))
+ },
+
+ saveEditing() {
+ this.editingIndex = -1
+ this.originalData = null
+ this.$message.success('保存成功')
+ },
+
+ cancelEditing() {
+ if (this.originalData) {
+ this.$set(this.tableData, this.editingIndex, this.originalData)
+ }
+ this.editingIndex = -1
+ this.originalData = null
+ },
+
+ handleDepartmentChange(row, index) {
+ console.log('部门已修改:', index, row.department)
+ // 可以在这里添加部门变更后的逻辑
+ },
+ // 确认按钮事件
+ handleConfirmAddGroup() {
+ this.$message.success('点击了确认按钮');
+ this.addGroupVisiable = false;
+ },
+ // 取消按钮事件
+ handleCancelAddGroup() {
+ this.$message.warning('点击了取消按钮');
+ this.addGroupVisiable = false;
+ },
+ dialogVisibleChange(data) {
+ console.log(data, 'data098908090');
+ },
+ handleChange(value) {
+ console.log('选中值变化:', value)
+ },
popshow() {
var ariaEls = document.querySelectorAll('.el-popover')
ariaEls.forEach((item) => {
@@ -208,13 +384,57 @@ export default {
handleServiceClick(row) {
console.log(row);
},
+ addGroup() {
+ // 新增分组
+ },
+ addSite() {
+ // 新增站点
+ },
+ // 自定义搜索筛选
+ customFilter(keyword, options) {
+ if (!keyword) return options
+ return options.filter(item => {
+ // 自定义筛选逻辑
+ return item.label.includes(keyword) || item.value.includes(keyword)
+ })
+ },
+ customFilter1(keyword, options) {
+ if (!keyword) return options
+ // 自定义筛选逻辑，比如同时匹配 label 和 value
+ return options.filter(item => {
+ return (
+ item.label.includes(keyword) ||
+ item.value.toString().includes(keyword)
+ )
+ })
+ },
+ handleFruitChange(value) {
+ console.log('水果选择变化:', value)
+ },
+ // 气泡弹出框
+ handlePriceClick(row, index, type) {
+ // 关闭其他行的弹框
+ this.tableData.forEach((item, i) => {
+ if (i !== index) {
+ item[type + '_popover'] = false;
+ }
+ });
+ // 打开当前行的弹框
+ row[type + '_popover'] = true;
+ row['edit_' + type] = row[type]
+ // row.edit_price = row.price; // 初始化输入框的值
+ },
}
}
\ No newline at end of file
站点列表
-新增分组
+ 新增分组
+
+
+
+
-
- 新增分组
+ 新增站点
新增分组
+
- {{ scope.row.name }}
+
+ {{ scope.row.name }}
-
+
-
- 取消
- 确定
-
-
-
-
+
{{ groupList[row.group] }}
+
-
-
-
+
- 取消
-
- 确定
-
-
+
+
-
+
+ 
自有域名验证未通过
+
+ 收款方式未配置
+
+ 支付宝收款账号未配置
+
- {{ row.phoneService }}
+ {{
+ row.status == '0' ? '运行中' : '配置中' }}
+ 
+
-
- {{
- scope.row.status
- ==
- '0' ? '运行中' : '配置中' }}
-
-
-
-
-
@@ -106,6 +155,11 @@
+